How We Built a Scalable Cloud‑Native WebIDE for End‑to‑End Development

From WebIDE

Our organization started late with WebIDE development; while the industry adopted solutions like Theia‑IDE and CloudStudio, we built internal tools such as ***Studio, ***IDE, and K***. In 2018 we evaluated D*******s ***Studio but later abandoned it, and in 2019 we created YunIDE using the open‑source code‑server and Kubernetes, later migrating to a more integrated solution.

https://github.com/cdr/code-server

We then combined ****IDE with XCloud, Dawn tools, and cloud query to realize a vertical, easy‑to‑use online development environment that streamlines the entire Init‑to‑Publish (I2P) workflow.

https://github.com/alibaba/dawn

Self‑Built Process and Challenges

WebIDE consists of three core parts:

Client – moves code editing and other local functions to the browser.

Server – manages data exchange and resource scheduling.

Container Pool – the runtime containers where user code actually runs.

The typical architecture is shown in the diagram below.

Server Design

YunIDE is cloud‑native from the start, leveraging cloud infrastructure and open‑source tools for permission management, container scheduling, and persistent storage, differing from many WebIDE implementations. An early architecture diagram is shown.

Key challenges included deep understanding of containers and Kubernetes, handling resource scheduling for fast cold starts, and ensuring isolation without performance loss.

Editor & IPC

The client side reuses the VSCode implementation via code‑server, providing a familiar experience and extensibility through VSCode extensions. We added a proxy and authentication layer for socket IPC on the HTTP level.

Key Issues

Resource utilization – sharing resources while maintaining isolation in weak editing scenarios.

High availability – shortening container lifecycles while preserving user files via NFS mounts.

Startup speed – achieving sub‑minute cold starts with container pools and buffers.

Plugin ecosystem – leveraging VSCode’s rich marketplace while addressing customization limits.

Solution Variants

We evaluated three WebIDE deployment schemes:

Scheme 1: Bind local hosts to container IPs – reliable but cumbersome for users.

Scheme 2: Unified preview domain with pathname routing – fails to handle diverse resource URLs.

Scheme 3: Variable wildcard domains per workspace – most complete solution but limited extensibility.

The final preview implementation is illustrated below.

Scenario Deployment

We focused on vertical scenarios rather than a monolithic IDE, applying the platform to:

XCloud VC component development – low‑code UI materials.

HarmonyOS ACE / international site component development – marketing assets.

Dawn engineering – supporting outsourced and rapid development.

Cloud query FaaS – serverless rapid project creation.

Each scenario customizes images and plugins, converging entry points through XCloud.

Pandemic Response

During the COVID‑19 outbreak, WebIDE became crucial for remote developers and outsourced teams, eliminating the need for local environment setup and enabling instant development via a browser.