Low‑Code Platform Practices at vivo: Frontend‑Backend Separation, High‑Performance Rendering Engine, and Efficient Visual Configuration

The article, based on Wang Ning's talk at the 2022 vivo Developer Conference, introduces vivo's low‑code platform "Houyi" and its five key practice dimensions: front‑end/back‑end separated low‑code architecture, a custom high‑performance rendering engine, an efficient visual configuration scheme, billion‑scale content delivery, and the coexistence of low‑code with traditional development.

Front‑end/Back‑end Separated Low‑Code Solution – Early on, the platform used a monolithic front‑end approach, but rapid business growth required independent page output and pure server‑side low‑code capabilities. A major refactor introduced clear separation of front‑end and back‑end services, enabling developers to focus on UI/UX while back‑end handles concurrency, availability, and business logic. The separation also extends to low‑code service capabilities, allowing DSL generation on the developer side and runtime parsing on the client side.

Self‑Developed High‑Performance Rendering Engine – The engine consists of a dynamic form renderer, list renderer, and dynamic interaction interpreter. It translates visual DSL into functional pages, forms, tables, and charts. Form rendering leverages JSONSchema‑driven architecture for data and state management, while the list renderer builds on the open‑source vxe‑table library, supporting virtual scrolling, tree tables, and custom renderers. Both components are mounted into a shared interaction context, enabling seamless data binding and component communication.

Efficient Visual Configuration Scheme – Pages are treated as resources with hierarchical management, supporting various navigation styles (tab‑history, breadcrumb, etc.). Visual configuration decouples resource management from page rendering, offering drag‑and‑drop layout, template and code‑snippet reuse, version comparison, one‑click rollback, and right‑click operations for copy‑paste across blocks, pages, or applications. The platform also provides built‑in features such as watermarks, menu search, notifications, and dynamic API proxying.

Billion‑Scale Content Delivery – Content is stored in MongoDB with custom sharding for isolation and scalability. High availability is achieved through independent image services, multi‑level caching, and dedicated Redis clusters. The system handles millions of QPS, with asynchronous concurrency, dynamic updates, and SDK extensibility to meet personalized business needs.

Coexistence with Traditional Development – Low‑code does not replace programmers; instead, it complements traditional development by offering iframe and micro‑app integration, page‑level, block‑level, and component‑level embedding. Existing legacy applications can be gradually integrated into the low‑code platform, preserving their menus while gaining low‑code configurability.

Overall, the Houyi platform demonstrates how a well‑designed low‑code solution can accelerate development, improve maintainability, and scale to massive traffic while remaining compatible with conventional engineering practices.