How Tencent Classroom’s Front‑End Team Survived Pandemic Traffic Surges

I work in Tencent's IMWeb team, responsible for the front‑end development of the online education platform Tencent Classroom.

1. Front‑end Challenge One – Main Domain

We experienced unprecedented traffic peaks during the Spring Festival holiday, with a massive number of schools forced to conduct online classes, resulting in a sudden, mandatory surge of students and teachers accessing the platform.

The main domain, served by Nginx, is managed by the front‑end team. Under Tencent's operation system, the next layer (STGW) is maintained by the business side, making the front‑end team the true DevOps bridge between operations and business.

If the main domain fails, the HTML cannot be loaded and the entire site collapses.

2. Front‑end Challenge Two – Audio/Video Live Streaming

Audio‑video is critical for live classes; any failure renders the entire platform ineffective.

The team quickly launched features such as Fast Live, simplified WebRTC signaling, traffic splitting, HLS fallback to WebRTC, and mixed‑stream toggles.

3. Front‑end Challenge Three – SAS Data Management Platform

The SAS platform handles all operational, category, and product configurations, integrates with CKV and CDB for data storage, uses COS for file storage, and employs JSON Schema to generate data services, synchronizing ZK nodes for backend queries.

Hundreds of tables rely on this platform; it uses GraphQL for queries, providing robust monitoring and easy scaling.

4. Front‑end Challenge Four – IMPush Messaging

IMPush is a self‑developed message channel handling all socket message forwarding, maintaining full‑duplex connections with the backend, using Redis for caching. Both the agent and center components face high pressure under massive concurrent loads.

5. Front‑end Challenge Five – Monitoring, Logging, and Gray Release

We treat monitoring, logging, and gray release as the "three swords" of front‑end professionalism. Our stack includes BadJS, Sentry, and FullLink for script error monitoring, with fallback plans to ensure rapid bug localization under extreme traffic.

Logging is integrated via an ELK stack, feeding a unified reporting middle‑platform that aggregates data in Kibana for custom dashboards.

6. Front‑end Challenge Six – Backend Protection

We help the backend by dynamically shielding non‑essential APIs based on load, keeping core CGI functional even when other interfaces time out or return errors.

7. Rapid Development Solutions

7.1 Nohost Solution

The Nohost approach supports parallel development of multiple test environments, enabling front‑end distribution and Docker‑based backend integration.

7.2 Tolstoy Solution

Tolstoy connects backend PB and CGI, automatically generating documentation, mocks, declaration files, and test cases, especially for TypeScript, greatly accelerating development.

7.3 Thanos Solution

Thanos, which I led, secures the release pipeline beyond CI/CD, providing additional safeguards to form a closed‑loop deployment process, handling branch release admission and coverage issues.

8. Personal Technical Capability

Team members must quickly adapt to a wide range of technologies—ranging from legacy FIS and jQuery to React, TypeScript, RN, and audio‑video stacks—across many client platforms (web, PC, mobile apps, mini‑programs, public accounts, etc.).

9. Small Achievements

Through collective effort, Tencent Classroom gained higher exposure and recognition, validating the team's hard work.

10. Invitation

If you want to join the online‑education front‑end team and work with authors of Whistle, Nohost, BadJS, Stone‑UI, etc., we welcome you to grow together.