Architecture difference
Formily has a two-layer architecture. The@formily/core layer manages form state as a reactive
data model — fields are observable objects with effects, linkage rules, and computed states powered
by a reactive programming system. The @formily/react layer binds this core to React components. On
top of that, @formily/antd and @formily/element-plus provide UI component adapters. For
JSON-driven forms, Formily’s SchemaField component renders forms from JSON Schema (JSON Schema
draft-07 subset). The Designable package provides a visual drag-and-drop form editor.
This architecture gives Formily exceptional power for complex enterprise scenarios: cross-field
reactive dependencies, field-level observers, async effects, and fine-grained control over every
field’s lifecycle. The trade-off is a steep learning curve — the reactive programming model, effects
API, and schema configuration options are significantly more complex than most teams need.
FormEngine also has a JSON schema and a visual designer, but its architecture is more
straightforward. The schema describes structure, props, validation, and conditional logic
declaratively. There’s no reactive programming model — conditional rendering and computed properties
are defined as expressions in the JSON, not as effect callbacks. This makes FormEngine easier to
adopt, easier to onboard new team members on, and easier for non-developers to use with Designer.
Feature comparison
| Feature | Formily | FormEngine |
|---|---|---|
| Form definition | JSON Schema (draft-07) or React components | FormEngine JSON schema |
| Reactive programming model | Yes (effects, observable fields) | No (declarative expressions) |
| Visual drag-and-drop editor | Formily Designable (separate setup) | FormEngine Designer (ready to embed) |
| Runtime schema loading (from API/DB) | Yes | Yes |
| MUI integration | Community adapter | Native adapter |
| Ant Design integration | Official @formily/antd | Custom adapter |
| Cross-field dependencies | Effects API (powerful, complex) | Declarative renderWhen + computed props |
| Async validation | Yes | Yes |
| Multi-language / localization | Yes | Built-in |
| TypeScript support | Yes | Yes |
| Field array / repeater | Yes | Yes (Repeater component) |
| Open-source license | MIT | MIT (Core); commercial (Designer) |
| Primary ecosystem | Alibaba / Chinese enterprise | International |
| Learning curve | High | Moderate |
When Formily is the right choice
- Your team has deep expertise in reactive programming and wants fine-grained field lifecycle control
- You need Ant Design or Element Plus as your UI layer with official adapter support
- You’re building within an existing Alibaba/Chinese enterprise ecosystem
- You need the full power of Formily’s effects system for extremely complex cross-field dependencies
- You have the team bandwidth to learn and maintain Formily’s API surface
When FormEngine is stronger
- Your team needs to onboard quickly — FormEngine’s declarative schema is easier to learn
- Non-developer teams (product managers, ops) need to create or edit forms without writing code
- You want an embeddable visual designer that works out of the box without custom Designable configuration
- You prefer MUI or Mantine as your component library
- You want operational simplicity — forms as portable JSON objects that any team member can understand
Migration playbook
Formily and FormEngine are both JSON-capable, but their schemas are not compatible. Migration is a schema rewrite:- Keep mature, stable Formily forms in place.
- For new forms, or high-change forms, use FormEngine Core.
- Map Formily’s linkage/conditional rules to FormEngine’s declarative Conditional Logic.
- Port Formily effects to FormEngine Actions and Events.
- Replace Formily Designable with FormEngine Designer for teams that need out-of-the-box visual editing.
FAQ
Is Formily more powerful than FormEngine?
For advanced reactive form scenarios — field-level observers, effect-driven cross-field state, complex async dependency chains — Formily’s architecture is more powerful. FormEngine covers most real-world enterprise form requirements declaratively without the complexity. The right choice depends on whether your use case actually needs that additional power.Does FormEngine support Ant Design components?
FormEngine’s UI layer is pluggable. A custom Ant Design adapter can be written. There’s no official@react-form-builder/components-antd package at the time of writing — if antd is your primary UI
library, Formily’s @formily/antd is the more complete off-the-shelf option.
Is Formily used outside of Alibaba’s ecosystem?
Yes, but the majority of its adoption and community activity is in Chinese enterprise contexts. English documentation and community support are less comprehensive than the Chinese-language ecosystem.Can FormEngine’s Designer replace Formily Designable?
They serve the same purpose (visual form authoring for non-developers) but work differently. FormEngine Designer is designed to be embedded in your application with minimal setup. Formily Designable is more customizable but requires significant configuration to deploy. If out-of-the-box embeddability is the requirement, FormEngine Designer is easier to set up.Can Formily and FormEngine coexist in the same project?
Yes. Incremental migration is practical — keep existing Formily forms and build new forms in FormEngine.What is the main operational advantage of FormEngine over Formily?
FormEngine’s simpler API and off-the-shelf Designer make it faster for teams to reach production. Non-developer participation in form creation works without custom tooling. For teams that don’t need Formily’s reactive programming depth, FormEngine typically ships faster.See also
- Workflow approval forms — enterprise case: multi-step approval with role-based fields
- Customer onboarding forms — multi-tenant, plan-tiered, ops-editable forms
- Core vs Designer: pricing and licensing — what’s free and what’s commercial
- Core architecture — schema model, renderWhen, validation pipeline
- GitHub repository
- Designer pricing