Rspack — A Fast Rust-Based Webpack-Compatible Bundler

What it is

Rspack is a JavaScript bundler written in Rust that implements the webpack loader and plugin API. Built by ByteDance's web infra team, it lets existing webpack projects migrate with minimal configuration changes while gaining significant build speed improvements.

Rspack targets frontend teams already invested in webpack who cannot justify a full migration to Vite or Turbopack. If you have hundreds of webpack loaders and plugins in production, Rspack lets you keep them and still get Rust-level performance.

How it saves time or tokens

Rspack's primary value is build speed. A project that takes 60 seconds to build with webpack can often complete in 6-12 seconds with Rspack. This compounds across a team: faster CI pipelines, faster local dev server startup, and faster hot module replacement (HMR) during development.

Because Rspack is API-compatible with webpack, migration cost is low. Teams do not need to rewrite their build configuration or replace custom plugins. The time saved on migration alone can be measured in weeks compared to switching to a fundamentally different bundler.

How to use

1. Scaffold a new Rspack project:

npm create rspack@latest myapp
cd myapp
npm run dev

1. Or migrate an existing webpack project by replacing the webpack dependency:

npm install -D @rspack/core @rspack/cli

1. Rename webpack.config.js to rspack.config.js (or keep it and point the CLI at it). Most webpack configurations work without changes:

// rspack.config.js
module.exports = {
  entry: './src/index.ts',
  output: { path: __dirname + '/dist', filename: 'bundle.js' },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        loader: 'builtin:swc-loader',
        options: { jsc: { parser: { syntax: 'typescript' } } }
      },
    ],
  },
};

Example

A typical React + TypeScript project configuration:

const { HtmlRspackPlugin } = require('@rspack/core');

module.exports = {
  entry: './src/main.tsx',
  resolve: { extensions: ['.tsx', '.ts', '.js'] },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        loader: 'builtin:swc-loader',
        options: {
          jsc: { parser: { syntax: 'typescript', tsx: true } },
        },
      },
    ],
  },
  plugins: [new HtmlRspackPlugin({ template: './index.html' })],
};

Run npx rspack serve for development with HMR, or npx rspack build for production.

Related on TokRepo

• Automation tools -- build tools and CI/CD automation
• Coding AI tools -- developer productivity tools

Common pitfalls

• Not all webpack plugins are compatible. Plugins that rely on internal webpack APIs or monkey-patch the compiler may fail. Check the Rspack compatibility list before migrating.
• Rspack uses SWC instead of Babel by default. If your project depends on Babel plugins for JSX transforms or decorators, you need to configure the SWC equivalents.
• The builtin:swc-loader is not the same as the standalone swc-loader npm package. Use the built-in version for best performance.