Evolution of Baidu Aifanfan Lead List: From Rapid Delivery to High-Performance Architecture

This article details the technical evolution of Baidu Aifanfan's lead list page, which is the highest-traffic page in the product. The journey progressed through six major versions to achieve "high availability, high quality, and high experience."

V1 - Quick Delivery: Initial implementation used MySQL for basic CRUD operations to ensure rapid product launch.

V2 - Configuration Extension: Addressed the contradiction between basic form/list functions and user demands for customization through three key approaches: metadata-driven design for dynamic search item rendering, indicator parser for flexible table header configuration and fast data loading, and frontend configuration engine to reduce development costs.

V3 - Experience Upgrade: Redesigned the page into three modules (title, toolbar, table) and implemented strategies including sticky table headers, floating horizontal scrollbars, and prioritized operation buttons to improve screen space utilization to 70%.

V4 - Search Capability: Migrated from MySQL to Baidu Cloud ES to handle 58 preset fields, 125 dynamic extension fields, and billion-level data. Used WATT for real-time data synchronization from DB to ES.

V5 - Read Your Writes: Implemented a solution using Redis sorted queues to ensure data consistency during DB-ES synchronization delays. The system retrieves recently modified lead IDs from Redis and merges them with ES query results.

V6 - Performance Optimization: Established a comprehensive APM system and achieved significant improvements: server-side P90 latency reduced from 25,000ms to below 800ms, frontend progressive rendering reduced from 20,000ms to below 500ms, and static resource gzipped size reduced by 67% (from 693.52KB to 228.83KB).

Key optimization techniques included: BFF Mesh service upgrade, Promise.all parallel requests, Redis caching, ES full-text search, custom AFF-UI table component (300% rendering performance improvement), CDN acceleration, and webpack compilation optimization.