Build Tools Comparison

Benchmark comparing JavaScript bundlers and build tools (Rspack, Rsbuild, webpack, Vite, rolldown-vite, esbuild, Parcel and Farm) for dev server startup time, build performance and bundle size for applications with different module sizes.

Metrics

Notes

• Build target is set to es2022 (Chrome >= 93) for all tools.
• Minification is enabled in production for all tools.
• Source map is enabled in development and disabled in production for all tools.
• Benchmarks run on GitHub Actions with variable hardware, which may cause inconsistent results.

Results

Data from GitHub Actions: https://github.com/rspack-contrib/build-tools-performance/actions/runs/19323852850 (2025-11-13)

react-1k

A React app with 1,000 components and 1,500 modules from node_modules, using dynamic imports to simulate SPA.

CASE=react-1k pnpm benchmark

Development metrics:

Build metrics:

react-5k

A React app with 5,000 components and 5,000 modules from node_modules, using dynamic imports to simulate SPA.

CASE=react-5k pnpm benchmark

Development metrics:

Build metrics:

react-10k

A React app with 10,000 components and 10,000 modules from node_modules, using dynamic imports to simulate SPA.

CASE=react-10k pnpm benchmark

Development metrics:

Build metrics:

ui-components

A React app that imports UI components from several popular UI libraries.

Including @mui/material, antd, @chakra-ui/react, @fluentui/react, @headlessui/react, @mantine/core, react-bootstrap, element-plus, vant, and vuetify.

CASE=ui-components pnpm benchmark

Build metrics:

rome

A complex TypeScript Node.js project that includes multiple packages from the rome toolchain.

CASE=rome pnpm benchmark

Build metrics:

Run locally

Run the benchmark.ts script to get the results (requires Node.js >= 22):

# Run the benchmark for the react-5k case
pnpm benchmark

# Run the benchmark for the react-10k case
CASE=react-10k pnpm benchmark

If you want to start the project with the specified tool, try:

pnpm i # install dependencies

# Cd to the case directory
cd cases/react-5k
cd cases/react-10k

# Dev server
pnpm start:rspack # Start Rspack
pnpm start:rsbuild # Start Rsbuild
pnpm start:webpack # Start webpack
pnpm start:vite # Start Vite
pnpm start:rolldown-vite # Start Vite (Rolldown)
pnpm start:farm # Start Farm

# Build
pnpm build:rspack # Build Rspack
pnpm build:rsbuild # Build Rsbuild
pnpm build:webpack # Build webpack
pnpm build:vite # Build Vite
pnpm build:rolldown-vite # Build Vite (Rolldown)
pnpm build:farm # Build Farm

Options

Use CASE to switch the benchmark case:

CASE=react-1k pnpm benchmark
CASE=react-5k pnpm benchmark
CASE=react-10k pnpm benchmark

Use TOOLS to specify the build tools or bundlers:

# Run with all tools
TOOLS=all pnpm benchmark

# Run Rspack and Rsbuild
TOOLS=rspack,rsbuild pnpm benchmark

Use RUN_TIMES to specify the number of runs (defaults to 3):

RUN_TIMES=3 pnpm benchmark

Use WARMUP_TIMES to specify the number of warmup runs (defaults to 2):

WARMUP_TIMES=2 pnpm benchmark

Use FARM=true to run Farm:

FARM=true pnpm benchmark

Credits

Forked from farm-fe/performance-compare, thanks to the Farm team!