How Yuque Scaled from Prototype to Commercial SaaS with a JavaScript Full‑Stack

Prototype Stage

Yuque was created in 2016 as an internal documentation tool for Ant Financial Cloud. The backend relied on internal BaaS services: Object (MongoDB‑like storage), File (OSS‑based file storage) and DockerLab (container hosting). All services were implemented in Node.js. The application layer used the Egg framework (Ant’s Node.js wrapper) and a React front‑end with Ant Design UI and CodeMirror for a markdown editor. This minimal stack proved the feasibility of an online knowledge base.

Internal Service Stage

To replace products like Confluence for hundreds of thousands of Alibaba employees, Yuque migrated from pure markdown to a rich‑text editor (formulas, drawings, mind maps). Key architectural changes:

Replaced BaaS with internal IaaS components (MySQL, OSS, cache, search) for higher stability and performance.

Kept Node.js/Egg but refactored the monolith into a large single‑module application with an ORM to clarify data‑model boundaries.

Switched the editor from CodeMirror to a forked Slate implementation and introduced a custom content storage format.

The product became a formal internal service with a stable feature set.

Commercialization Stage

In early 2018 Yuque opened to external customers, adding collaborative editing, tables, mind maps and real‑time features. The architecture evolved as follows:

All infrastructure migrated to Alibaba Cloud (compute, storage, AI services such as OCR and translation).

The core remained a large Node.js/Egg monolith, but independent functionalities were extracted:

This split reduced coupling, improved scalability and lowered operational costs.

JavaScript Full‑Stack Approach

Yuque defines engineers as “one‑specialty‑many‑skills” product engineers rather than generic full‑stack developers. They act as technical partners with product ownership, contribute deep expertise (backend, testing, build tooling, CSS, etc.), and drive end‑to‑end feature development, automated testing, code review and release practices (gray‑release, emergency rollback, monitoring). Benefits of a JavaScript‑only stack include code reuse across web and desktop editors, reduced context switching and unified tooling.

Security and Stability Practices

Security layers :

Front‑end: XSS prevention and input sanitization.

Backend: strict permission checks, response filtering, no SQL concatenation, sandboxed execution for user‑provided code, SSRF filtering.

Cloud services: protection against abuse, data leakage and content safety.

Stability measures :

Eliminate single points of failure; deploy across multiple zones.

Distinguish strong vs. weak dependencies (e.g., move session storage from Redis to MySQL to avoid hard dependency).

Full‑trace logs, business event metrics and performance monitoring enable rapid incident detection and root‑cause analysis.

Architecture Patterns

Yuque adopts a mixed architecture:

Large Node.js monolith hosts core business logic.

Microservices for independent, stable modules (e.g., real‑time collaboration) accessed via HTTP.

Task clusters for CPU‑intensive or third‑party dependent jobs (file preview services) using queue‑based isolation.

Serverless function compute for stateless, on‑demand tasks (Mermaid, PlantUML rendering). Example: a user submits Mermaid code, the request is routed to a Function Compute instance that runs puppeteer to generate an SVG.

Domain‑driven design follows a hexagonal (ports‑and‑adapters) model:

Controllers act as HTTP adapters, handling request validation, permission checks and response formatting.

Adapters encapsulate interactions with external services, logging calls and translating data.

Model layer abstracts storage; e.g., a Doc model stores metadata in MySQL and encrypted content in OSS. The business logic remains agnostic to the underlying storage, allowing migration to other SQL‑compatible databases (e.g., OceanBase) with minimal changes.

Publishing a document triggers:

HTTP request → Controller → Model writes to MySQL/OSS and updates cache.

Asynchronous message pushes to downstream systems (e.g., DingTalk WebHook, search index).

All interactions are isolated via adapters, ensuring clean core logic and traceable call chains.

Technology‑Stack Selection Principles

Match the stack to the product stage: early stages prioritize rapid iteration; later stages prioritize stability and performance.

Leverage team expertise: the majority of engineers have JavaScript backgrounds, making a full‑stack JavaScript approach natural.

Regardless of language, prioritize security, stability and maintainability.