KakaoPage Developer Shares Experience Adopting SWC to Improve Next.js Build Speed

A KakaoPage frontend developer shared their experience analyzing SWC (Speedy Web Compiler) and evaluating its applicability to resolve build speed issues encountered during the adoption of a monorepo. The existing Next.js project suffered from a bottleneck where builds took 5 to 10 minutes due to the use of Babel and Terser.

SWC Performance and Principles

SWC is a build tool written in Rust, with its core advantage being the ability to perform parallel processing, overcoming the single-threaded limitations of JavaScript. According to official Next.js documentation, transpilation can be up to 17 times faster, and code minification up to 7 times faster. Thanks to Rust's parallel processing capabilities, files without dependencies can be transformed simultaneously, resulting in significantly faster speeds compared to JavaScript-based Babel or Terser.

Actual Build Time Test Results

The developer compared build times between SWC and existing tools across projects of various scales in a MacBook Pro environment.

• Small-scale project: With SWC, the build took approximately 6 seconds, compared to approximately 8.2 seconds with Babel/Terser, showing a speed improvement of about 20-30%.
• Medium-scale project (styled-components website): With SWC, the build took 41 seconds, compared to 50 seconds with Babel/Terser, an improvement of about 18%.
• Vercel deployment environment: With SWC, the build took 48.35 seconds, compared to 86.34 seconds with Babel/Terser, confirming a speed improvement of nearly 2x.

External research reports have noted performance improvements of up to 74.05% in WSL1 environments. This suggests that the benefits of SWC's parallel processing can be maximized depending on the project scale and operating system environment.

Current Adoption Status and Limitations at KakaoPage

Currently, SWC has not been applied to the KakaoPage project. This is because major Babel plugins, such as @emotion/babel-plugin which supports the CSS-in-JS library emotion used in the project, are not compatible with SWC. The Next.js team is expanding SWC support for major libraries like styled-components and Jest, and support for emotion has also been confirmed for the near future. Considering the efficiency relative to the cost of replacing libraries, the team plans to maintain the existing build method for now while reviewing SWC adoption in the future based on ecosystem changes.