Rome: Enhancing Front‑end Development Collaboration and Efficiency at Meituan

This article, derived from Meituan’s 76th technical salon, introduces the Rome front‑end development framework and its evolution path, aiming to improve collaborative efficiency for large‑scale front‑end teams.

1. Background

Meituan’s to‑store business faces rapid iteration, high code volume, and many legacy systems. Cross‑team collaboration is required due to frequent inter‑departmental demands, and a large proportion of new hires need streamlined onboarding.

Technically, the original static‑S3 architecture and Node.js‑centric full‑stack approach caused high operational costs, low SEO requirements, and difficulty in scaling.

2. Engineering Ecosystem, Evolution Path, and Scale‑up

2.1 Engineering Ecosystem

Key pain points include inconsistent directory structures, fragmented engineering capabilities across teams, verbose configuration, and scattered infrastructure implementations.

Rome addresses these by:

Standardizing directory conventions with automated checks.

Converging dependency versions and selections.

Providing unified cross‑stack engineering capabilities.

Embedding baseline development standards (ESLint, Prettier, etc.).

One‑line integrations enable CDN fallback, alert monitoring, and watermarking without developers needing to manage underlying infrastructure.

2.2 Evolution Path

The framework moves from a Webpack/Vue‑centric stack to a layered architecture:

Low‑level plugin mechanism for extensibility.

Bundler layer supporting Webpack, esbuild, Rspack, Vite.

Plugin/ preset layer for business‑specific extensions.

Brand command layer for internal tooling.

This design allows new frameworks to be built by only implementing language‑specific plugins while reusing the core infrastructure.

2.3 Scale‑up Strategies

Migration tools automate project upgrades from non‑Rome to Rome, using static analysis, build‑tool hooks, and AST‑based transformations to achieve up to 60% migration accuracy. Large‑version upgrades are supported by automated dependency checks, configuration diffing, and compatibility validation.

3. Framework Development Assistance

Rome provides IDE‑based assistance tools, both web‑based (Vue UI, Umi UI) and VSCode extensions, to improve developer productivity. Benefits include cross‑IDE consistency, reduced version‑fragmentation, and dynamic rule distribution for quality checks.

Challenges such as limited UI space in IDEs are mitigated by focusing on high‑frequency tasks and integrating with CloudIDE for seamless experience.

4. Framework Metrics and Business Practices

Metrics cover coverage, usage frequency, and value quantification. Data is collected from CI/CD pipelines, IDE usage, and platform telemetry, then aggregated into dashboards for monthly trends, organizational breakdowns, and technology‑stack analysis.

Key measurement dimensions include engineering capability adoption, build efficiency, and incident reduction, supporting continuous improvement and ROI assessment.

5. Summary and Future Trends

Future focus areas include optimizing dependency installation, compile speed, and release pipelines; deeper integration of the development chain akin to SaaS platforms like Vercel; adopting Rust‑based infrastructure and newer bundlers; and leveraging AI (e.g., Copilot) for code generation and knowledge‑base assistance.