Why Chengwu Low-Code Platform Chose Amis Over Vue, Ant Design Pro & Formily
The article details how the Chengwu low-code platform selected Amis as its frontend engine after evaluating Vue, Ant Design Pro, and Formily, highlighting Amis's schema-driven rendering, dynamic configuration, built-in components, and visual editor that enable zero-frontend-development page generation and multi-tenant adaptability.
Introduction
Building the enterprise low-code platform "Chengwu" required a frontend framework capable of handling dynamic forms, process components, visual configurators, and complex interactions. The team evaluated React with custom components, Vue + Element, Ant Design Pro, and low-code suites like Formily and Amis, ultimately selecting Amis as the core frontend rendering engine.
Core Requirements for the Frontend Framework
Strong dynamic loading : Forms, pages, and process nodes must render instantly from backend JSON without frontend compilation.
Visual-driven design : Support drag-and-drop page building with WYSIWYG editing.
Complex interaction compatibility : Handle linkage logic, conditional visibility, nested components, and lazy data loading.
Multi-end adaptation : A single DSL must generate different styles for SaaS customization.
Low maintenance cost : Avoid repetitive development and reduce frontend engineer workload.
Traditional component libraries could not meet these advanced dynamic and configurable needs, leading the team to schema-driven rendering frameworks like Amis.
Amis Overview: Schema-Driven Frontend Engine
Amis is a Baidu open-source low-code frontend rendering engine that defines UI structure and behavior via JSON Schema, eliminating hand-written HTML/JSX. Its core advantages include:
Dynamic page generation from configuration, no bundling or frontend compilation required.
Over 100 built-in components covering complex forms, CRUD tables, conditional display, linkage logic, charts, and more.
Reactive component behavior control with conditional rendering, data mapping, and event action chains.
Tight backend integration with built-in support for API fetching, submission, pagination, and validation lifecycles.
WYSIWYG online editor for drag-and-drop page design.
Active community and documentation with regular updates.
Why Not Vue + Element?
Vue + Element is common for internal systems but has limitations for low-code scenarios:
Dynamic loading : Page-level async loading possible, but form components cannot be loaded purely via configuration.
Form complexity : Advanced form logic requires extensive custom code.
Form designer : No official support; would need in-house development.
Project extensibility : New pages require frontend development involvement.
Multi-tenancy : Requires manual component abstraction and logic branch maintenance.
Vue is a framework, not a complete page generation engine, demanding heavy development investment to build missing capabilities.
Comparison with Ant Design Pro and Formily
Amis vs Ant Design Pro
Rendering : Ant Design Pro uses static JSX development; Amis uses JSON Schema dynamic driving.
Dynamic forms : Ant Design Pro has limited capabilities requiring hook composition; Amis provides all capabilities declaratively.
Component coverage : Ant Design Pro covers common admin scenarios; Amis offers 100+ components including reports, charts, and images.
Multi-tenancy : Ant Design Pro relies on permission routing; Amis adapts via a single schema configuration.
Amis vs Formily
Technical positioning : Formily is a form engine; Amis is a page engine that includes forms.
Usage : Formily mixes Schema with JSX development; Amis uses pure Schema without frontend compilation.
Component extension : Formily extension is complex; Amis provides slots and Renderer for easier extension.
Formily's focus on forms and requirement for frontend project integration made it unsuitable for the goal of zero frontend development involvement.
Practical Results: Amis in Chengwu Platform
1. Dynamic Form Generator
Backend JSON Schema configuration dynamically generates:
Nested tables
Dynamic validation rules
Remote dictionary fetching
Cross-form linkage (e.g., province-city cascading)
Conditional visibility (e.g., show extra fields only when "Yes" selected)
Zero frontend intervention required, significantly accelerating delivery.
2. CRUD Page Templates
Unified CRUD templates built with Amis support:
API-driven data fetching and pagination
Custom action buttons (batch delete, import/export)
Embedded modal forms and drawer editing
Column-level permission control
Components reuse across modules via schema configuration changes, keeping maintenance cost minimal.
3. Visual Process Configurator Nesting
LogicFlow editor embedded within Amis pages enables users to:
Configure node logic
Set per-node form interfaces (Schema)
Debug data flow between nodes
Integration with Amis nesting capabilities works smoothly without breaking frontend layout logic.
Challenges and Mitigation Strategies
Complex schema structure : Deeply nested fields are hard to debug; addressed by combining with documentation.
Default Baidu-style styling : Required dedicated effort for unified style overhaul.
Component extension needs secondary encapsulation : Custom charts and upload components require Renderer-based plugins.
Cautious upgrades : Low-code platform upgrades affect all pages; full schema compatibility testing is mandatory.
Adopted strategies:
Unified schema generator service to avoid repetitive authoring.
Stable backend API contracts, especially pagination and query parameter names.
End-to-end testing to ensure component behavior consistency.
Conclusion: Why Amis Is Chengwu's Best Choice
Amis was selected for its overwhelming advantages in low-code platform construction:
Complete schema rendering capability covering virtually all required frontend components.
True frontend-backend decoupling allowing backend to independently generate page structures.
Dynamic loading without frontend compilation, supporting online configuration and instant refresh.
Out-of-the-box readiness drastically reducing development time.
Visual editor enabling non-technical users to configure pages quickly.
After comparing Vue, Ant Design Pro, and Formily, Amis excelled in dynamism, configuration-driven approach, and low-code platform friendliness. Combined with Chengwu's backend schema management and data permission system, Amis became the platform's frontend cornerstone.
Signed-in readers can open the original source through BestHub's protected redirect.
This article has been distilled and summarized from source material, then republished for learning and reference. If you believe it infringes your rights, please contactand we will review it promptly.
How this landed with the community
Was this worth your time?
0 Comments
Thoughtful readers leave field notes, pushback, and hard-won operational detail here.
