1<!doctype html> 2<html lang="en"> 3 <head><meta charset="utf-8"> 4<meta name="viewport" content="width=device-width, initial-scale=1"> 5<title>Introduction - Rsbuild</title>
vendor: 64 bytes, lines 5-6
5 6<script async src="https://www.googletagmanager.com/gtag/js?id=
6G-L6BZ6TKW4R
vendor: 12 bytes, line 6
6"></script>
7<script>{;var defaultLang = "en", langs = ["en","zh"];if (!/bot|spider|crawl|lighthouse/i.test(window.navigator.userAgent)) {;var firstVisitKey = 'rspress-visited', visited = localStorage.getItem(firstVisitKey);if (!visited) {;localStorage.setItem(firstVisitKey, '1');var targetLang = window.navigator.language.split('-')[0], { pathname, search } = window.location, pathSegments = pathname.split('/').filter(Boolean), currentLang = langs.includes(pathSegments[0]) ? pathSegments[0] : defaultLang;if (langs.includes(targetLang) && targetLang !== currentLang) {;var newPathSegments = pathSegments.slice();if (targetLang === defaultLang) {;newPathSegments.splice(0, 1);} else if (currentLang === defaultLang) {;newPathSegments.splice(0, 0, targetLang);} else {;newPathSegments[0] = targetLang;};;var newPathname = '/' + newPathSegments.join('/'), trailingSlash = newPathname !== '/' && pathname.endsWith('/') ? '/' : '';window.location['replace'](newPathname + trailingSlash + search);};};};}</script>
vendor: 1 bytes, line 7
7
8<script>{;const saved = localStorage.getItem('rspress-theme-appearance');const preferDark = window.matchMedia('(prefers-color-scheme: dark)').matches;const defaultTheme = 'auto';const theme = saved === 'light' || saved === 'dark' || saved === 'auto' ? saved : defaultTheme;const isDark = theme === 'auto' ? preferDark : theme === 'dark';document.documentElement.classList.toggle('dark', isDark);document.documentElement.classList.toggle('rp-dark', isDark);document.documentElement.style.colorScheme = isDark ? 'dark' : 'light';}</script>
vendor: 1 bytes, line 8
8
9<script> 10
vendor: 139 bytes, lines 10-13
10window.dataLayer = window.dataLayer || []; 11 function gtag(){dataLayer.push(arguments);} 12 gtag('js', new Date()); 13 gtag('config', '
13G-L6BZ6TKW4R
vendor: 3 bytes, line 13
13');
13</script>
13 14<link href="/static/css/styles.e446e1a781.css" rel="stylesheet"> 15<link rel="preload" href="/static/js/async/route-155d4f3e33c2.eb2ab095f8.js" as="script"> 16<link href="/static/font/open-sans.3d9ea938b6.woff2" rel="preload" as="font" crossorigin>
17<script defer src="/static/js/styles.f12f32ba8e.js"></script>
vendor: 1 bytes, line 17
17
18<script defer src="/static/js/lib-react.0ee665aa5e.js"></script>
vendor: 1 bytes, line 18
18
19<script defer src="/static/js/lib-router.635d71b1ab.js"></script>
vendor: 1 bytes, line 19
19
20<script defer src="/static/js/s.dcca2475df.js"></script>
vendor: 1 bytes, line 20
20
21<script defer src="/static/js/index.4cea045afe.js"></script>
21 22<meta http-equiv="X-UA-Compatible" content="IE=edge"> 23<meta name="generator" content="Rspress v2.0.22"> 24<meta property="og:image" content="https://assets.rspack.rs/rsbuild/rsbuild-og-image.png"> 25<meta property="og:url" content="https://rsbuild.rs"> 26<meta property="og:description" content="Introduction to Rsbuild, including its core capabilities, performance model, ecosystem fit, and next steps."> 27<meta property="twitter:site" content="@rspack_dev"> 28<meta property="twitter:card" content="summary_large_image"> 29<meta name="baidu-site-verification" content="codeva-mYbzBtlg6o"> 30<link rel="alternate" hreflang="en" href="/guide/start/"> 31<link rel="alternate" hreflang="zh" href="/zh/guide/start/"> 32<link rel="apple-touch-icon" sizes="192x192" href="https://assets.rspack.rs/rsbuild/rsbuild-logo-192x192.png"> 33<link rel="manifest" href="/manifest.webmanifest"> 34<link rel="icon" href="https://assets.rspack.rs/rsbuild/favicon-128x128.png"> 35<link rel="alternate" type="text/markdown" href="/guide/start/index.md"> 36<link rel="describedby" href="/llms.txt"> 37<meta property="og:type" content="website"> 38<meta property="og:title" content="Introduction - Rsbuild"> 39<meta name="description" content="Introduction to Rsbuild, including its core capabilities, performance model, ecosystem fit, and next steps."></head> 40 41 <body> 42 <div id="__rspress_root"><link rel="preconnect" href="https://LBYJGZQY5U-dsn.algolia.net" crossorigin=""/><link rel="preload" as="image" href="https://assets.rspack.rs/rsbuild/navbar-logo-light.png"/><link rel="preload" as="image" href="https://assets.rspack.rs/rsbuild/navbar-logo-dark.png"/><link rel="preload" as="image" href="https://assets.rspack.rs/rsbuild/assets/rsbuild-1-0-build-tools.png"/><link rel="preload" as="image" href="https://assets.rspack.rs/rstack/rstack-overview.png"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rspack/core?style=flat-square&colorA=564341&colorB=EDED91"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rsbuild/core?style=flat-square&colorA=564341&colorB=EDED91"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rslib/core?style=flat-square&colorA=564341&colorB=EDED91"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rspress/core?style=flat-square&colorA=564341&colorB=EDED91"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rsdoctor/core?style=flat-square&colorA=564341&colorB=EDED91"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rstest/core?style=flat-square&colorA=564341&colorB=EDED91"/><link rel="preload" as="image" href="https://img.shields.io/npm/v/@rslint/core?style=flat-square&colorA=564341&colorB=EDED91"/><div class="rp-llms-hint" style="position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);clip-path:inset(50%);white-space:nowrap;border:0">For AI agents: the complete documentation index is available at /llms.txt, the full documentation bundle is available at /llms-full.txt, and this page is available as Markdown at /guide/start/index.md.</div><header class="rp-nav"><div class="rp-nav__left"><div class="root-nhoLZk"><div class="wrapper-u2FzAf"><svg width="20" height="20" fill="none"><title>close</title><path d="M2.5 5H5V2.5H2.5V5zM5 11.25H2.5v-2.5H5v2.5zm12.5 0H15v-2.5h2.5v2.5zm-8.75 0h2.5v-2.5h-2.5v2.5zM5 17.5H2.5V15H5v2.5zm10 0h2.5V15H15v2.5zm-3.75 0h-2.5V15h2.5v2.5zM17.5 5H15V2.5h2.5V5zM8.75 5h2.5V2.5h-2.5V5z" fill="currentColor"></path></svg></div></div><div class="rp-nav__title"><a href="/" class="rp-nav__title__link rp-link"><div class="rp-nav__title__logo"><img src="https://assets.rspack.rs/rsbuild/navbar-logo-light.png" alt="logo" id="logo" class="rspress-logo rp-nav__title__logo-image rp-nav__title__logo-image--light"/><img src="https://assets.rspack.rs/rsbuild/navbar-logo-dark.png" alt="logo" id="logo" class="rspress-logo rp-nav__title__logo-image rp-nav__title__logo-image--dark"/></div></a></div></div><div class="rp-nav__right"><button type="button" class="DocSearch DocSearch-Button" aria-label="Search (Meta+k)" aria-keyshortcuts="Meta+k"><span class="DocSearch-Button-Container">
42<svg width="20" height="20" class="DocSearch-Search-Icon" viewBox="0 0 24 24" aria-hidden="true"><circle cx="11" cy="11" r="8" stroke="currentColor" fill="none" stroke-width="1.4"></circle><path d="m21 21-4.3-4.3" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"></path></svg><span class="DocSearch-Button-Placeholder">Search</span></span><span class="DocSearch-Button-Keys"></span></button><ul class="rp-nav-menu rp-nav-menu--right"><li class="rp-nav-menu__item rp-nav-menu__item--active"><a href="/guide/start/" class="rp-nav-menu__item__container rp-link">Guide</a></li><li class="rp-nav-menu__item"><a href="/config/" class="rp-nav-menu__item__container rp-link">Config</a></li><li class="rp-nav-menu__item"><a href="/plugins/list/" class="rp-nav-menu__item__container rp-link">Plugin</a></li><li class="rp-nav-menu__item"><a href="/api/start/" class="rp-nav-menu__item__container rp-link">API</a></li><li class="rp-nav-menu__item"><a href="/blog/" class="rp-nav-menu__item__container rp-link">Blog</a></li><li class="rp-nav-menu__item"><div class="rp-nav-menu__item__container">Version<svg width="1em" height="1em" viewBox="0 0 32 32" class="rp-nav-menu__item__icon"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></div><ul class="rp-hover-group rp-hover-group--hidden rp-hover-group--center"><li class="rp-hover-group__item" style="padding-left:8px" data-depth="0"><a href="https://github.com/web-infra-dev/rsbuild/releases" target="_blank" class="rp-hover-group__item__link rp-link" aria-label="Changelog">Changelog</a></li><li class="rp-hover-group__item" style="padding-left:8px" data-depth="0"><a href="https://v1.rsbuild.rs/" target="_blank" class="rp-hover-group__item__link rp-link" aria-label="Rsbuild 1.x Docs">Rsbuild 1.x Docs</a></li><li class="rp-hover-group__item" style="padding-left:8px" data-depth="0"><a href="https://v0.rsbuild.rs/" target="_blank" class="rp-hover-group__item__link rp-link" aria-label="Rsbuild 0.x Docs">Rsbuild 0.x Docs</a></li></ul></li></ul><div class="rp-nav__others"><div class="rp-nav-menu__divider"></div><li class="rp-nav-menu__item"><div class="rp-nav-menu__item__container">English<svg width="1em" height="1em" viewBox="0 0 32 32" class="rp-nav-menu__item__icon"><path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></div><ul class="rp-hover-group rp-hover-group--hidden rp-hover-group--center"><li class="rp-hover-group__item rp-hover-group__item--active" style="padding-left:8px" data-depth="0"><div class="rp-hover-group__item__link" lang="en">English</div></li><li class="rp-hover-group__item" style="padding-left:8px" data-depth="0"><a href="/zh/guide/start" class="rp-hover-group__item__link rp-link" aria-label="ç®ä½ä¸æ" lang="zh" hrefLang="zh" rel="alternate">ç®ä½ä¸æ</a></li></ul></li><div class="rp-switch-appearance"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewBox="0 0 24 24" class="rp-switch-appearance__icon rp-switch-appearance__icon--sun"><path fill="currentColor" d="m7.001 15.848-1.226 1.226a.58.58 0 0 0 0 .818.58.58 0 0 0 .818 0l1.226-1.226a.58.58 0 0 0 0-.818.58.58 0 0 0-.818 0m-.352-8.735a.584.584 0 0 0 .825-.825L6.237 5.051a.584.584 0 0 0-.825.825zM5.011 11.07h-1.75a.584.584 0 0 0 0 1.167h1.75c.324 0 .584-.26.584-.583a.585.585 0 0 0-.584-.584m7.003-5.835c.324 0 .584-.26.584-.584V2.9a.58.58 0 0 0-.584-.584.58.58 0 0 0-.583.583V4.65c0 .323.262.584.583.584m5.616 1.621 1.226-1.225a.58.58 0 0 0 0-.818.58.58 0 0 0-.818 0l-1.226 1.225a.58.58 0 0 0 0 .818.576.576 0 0 0 .818 0m3.138 4.214h-1.75a.58.58 0 0 0-.584.584c0 .324.26.584.583.584h1.751a.584.584 0 1 0 0-1.167m-3.389 5.124a.584.584 0 0 0-.825.825l1.238 1.238a.584.584 0 0 0 .825-.826zm-5.365-9.795a5.256 5.256 0 0 0-5.257 5.258 5.256 5.256 0 0 0 5.257 5.257 5.256 5.256 0 0 0 5.257-5.257 5.256 5.256 0 0 0-5.257-5.258m0 11.675a.58.58 0 0 0-.583.583v1.751a.582.582 0 1 0 1.167 0v-1.75a.584.584 0 0 0-.584-.584"></path></svg><svg xmlns="http://www.w3.org/2000/svg" width="19" height="19" fill="currentColor" viewBox="0 0 19 19" class="rp-switch-appearance__icon rp-switch-appearance__icon--moon">
42<path fill="currentColor" d="M9.166 0a9.2 9.2 0 0 1 1.857.188.834.834 0 0 1 .042 1.623 4.47 4.47 0 1 0 5.457 5.457l.048-.135a.834.834 0 0 1 1.575.177q.186.902.188 1.856A9.168 9.168 0 1 1 9.166 0"></path></svg></div><div class="rp-social-links"><a href="https://github.com/web-infra-dev/rsbuild" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M12 .297c-6.63 0-12 5.373-12 12c0 5.303 3.438 9.8 8.205 11.385c.6.113.82-.258.82-.577c0-.285-.01-1.04-.015-2.04c-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729c1.205.084 1.838 1.236 1.838 1.236c1.07 1.835 2.809 1.305 3.495.998c.108-.776.417-1.305.76-1.605c-2.665-.3-5.466-1.332-5.466-5.93c0-1.31.465-2.38 1.235-3.22c-.135-.303-.54-1.523.105-3.176c0 0 1.005-.322 3.3 1.23c.96-.267 1.98-.399 3-.405c1.02.006 2.04.138 3 .405c2.28-1.552 3.285-1.23 3.285-1.23c.645 1.653.24 2.873.12 3.176c.765.84 1.23 1.91 1.23 3.22c0 4.61-2.805 5.625-5.475 5.92c.42.36.81 1.096.81 2.22c0 1.606-.015 2.896-.015 3.286c0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></div></div></a><a href="https://twitter.com/rspack_dev" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584l-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z"/></svg></div></div></a><a href="https://discord.gg/XsaKEEk4mW" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M20.317 4.37a19.8 19.8 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.3 18.3 0 0 0-5.487 0a13 13 0 0 0-.617-1.25a.08.08 0 0 0-.079-.037A19.7 19.7 0 0 0 3.677 4.37a.1.1 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.08.08 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.08.08 0 0 0 .084-.028a14 14 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13 13 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10 10 0 0 0 .372-.292a.07.07 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.07.07 0 0 1 .078.01q.181.149.373.292a.077.077 0 0 1-.006.127a12.3 12.3 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.08.08 0 0 0 .084.028a19.8 19.8 0 0 0 6.002-3.03a.08.08 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.06.06 0 0 0-.031-.03M8.02 15.33c-1.182 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418m7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418"/></svg></div></div></a><a href="https://bsky.app/profile/rspack.rs" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565C.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479c.815 2.736 3.713 3.66 6.383 3.364q.204-.03.415-.056q-.207.033-.415.056c-3.912.58-7.387 2.005-2.83 7.078c5.013 5.19 6.87-1.113 7.823-4.308c.953 3.195 2.05 9.271 7.733 4.308c4.267-4.308 1.172-6.498-2.74-7.078a9 9 0 0 1-.415-.056q.21.026.415.056c2.67.297 5.568-.628 6.383-3.364c.246-.828.624-5.79.624-6.478c0-.69-.139-1.861-.902-2.206c-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8"/></svg></div></div></a><ul class="rp-hover-group rp-hover-group--hidden rp-hover-group--right"></ul></div></div><button aria-label="mobile hamburger" class="rp-nav-hamburger rp-nav-hamburger__sm"><svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" fill="none" viewBox="0 0 21 21"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.667" d="M3.645 5.225h13.333M3.645 10.225h13.333M3.645 15.225h13.333"></path></svg></button><button aria-label="mobile hamburger" class="rp-nav-hamburger rp-nav-hamburger__md"><svg xmlns="http://www.w3.org/2000/svg" width="21" height="21" fill="none" viewBox="0 0 21 21"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.667" d="M3.645 5.225h13.333M3.645 10.225h13.333M3.645 15.225h13.333"></path></svg><ul class="rp-hover-group rp-hover-group--hidden rp-hover-group--right"><div class="rp-nav-menu__others-mobile__container"><div class="rp-nav-hamburger__md__hover-group"><div class="rp-nav-screen-appearance"><div class="rp-nav-screen-appearance__left">Theme</div><div class="rp-nav-screen-appearance__right"></div></div><div class="rp-nav-screen-langs"><div class="rp-nav-screen-langs__left">Languages</div><div class="rp-nav-screen-langs__right">English<svg width="1em" height="1em" viewBox="0 0 32 32" class="rp-nav-screen-langs__icon ">
42<path fill="currentColor" d="M16 22 6 12l1.4-1.4 8.6 8.6 8.6-8.6L26 12z"></path></svg></div></div><div class="rp-nav-screen-langs-group" style="display:grid;grid-template-rows:0fr;transition:grid-template-rows 0.2s ease-out"><div class="rp-nav-screen-langs-group__inner"><span class="rp-nav-screen-langs-group__item rp-nav-screen-langs-group__item--active" aria-current="page" aria-disabled="true">English</span><a href="/zh/guide/start" class="rp-nav-screen-langs-group__item rp-link" hrefLang="zh" lang="zh" rel="alternate">ç®ä½ä¸æ</a></div></div><div class="rp-nav-screen-divider"></div><div class="rp-social-links"><a href="https://github.com/web-infra-dev/rsbuild" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M12 .297c-6.63 0-12 5.373-12 12c0 5.303 3.438 9.8 8.205 11.385c.6.113.82-.258.82-.577c0-.285-.01-1.04-.015-2.04c-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729c1.205.084 1.838 1.236 1.838 1.236c1.07 1.835 2.809 1.305 3.495.998c.108-.776.417-1.305.76-1.605c-2.665-.3-5.466-1.332-5.466-5.93c0-1.31.465-2.38 1.235-3.22c-.135-.303-.54-1.523.105-3.176c0 0 1.005-.322 3.3 1.23c.96-.267 1.98-.399 3-.405c1.02.006 2.04.138 3 .405c2.28-1.552 3.285-1.23 3.285-1.23c.645 1.653.24 2.873.12 3.176c.765.84 1.23 1.91 1.23 3.22c0 4.61-2.805 5.625-5.475 5.92c.42.36.81 1.096.81 2.22c0 1.606-.015 2.896-.015 3.286c0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg></div></div></a><a href="https://twitter.com/rspack_dev" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M18.901 1.153h3.68l-8.04 9.19L24 22.846h-7.406l-5.8-7.584l-6.638 7.584H.474l8.6-9.83L0 1.154h7.594l5.243 6.932ZM17.61 20.644h2.039L6.486 3.24H4.298Z"/></svg></div></div></a><a href="https://discord.gg/XsaKEEk4mW" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M20.317 4.37a19.8 19.8 0 0 0-4.885-1.515a.074.074 0 0 0-.079.037c-.21.375-.444.864-.608 1.25a18.3 18.3 0 0 0-5.487 0a13 13 0 0 0-.617-1.25a.08.08 0 0 0-.079-.037A19.7 19.7 0 0 0 3.677 4.37a.1.1 0 0 0-.032.027C.533 9.046-.32 13.58.099 18.057a.08.08 0 0 0 .031.057a19.9 19.9 0 0 0 5.993 3.03a.08.08 0 0 0 .084-.028a14 14 0 0 0 1.226-1.994a.076.076 0 0 0-.041-.106a13 13 0 0 1-1.872-.892a.077.077 0 0 1-.008-.128a10 10 0 0 0 .372-.292a.07.07 0 0 1 .077-.01c3.928 1.793 8.18 1.793 12.062 0a.07.07 0 0 1 .078.01q.181.149.373.292a.077.077 0 0 1-.006.127a12.3 12.3 0 0 1-1.873.892a.077.077 0 0 0-.041.107c.36.698.772 1.362 1.225 1.993a.08.08 0 0 0 .084.028a19.8 19.8 0 0 0 6.002-3.03a.08.08 0 0 0 .032-.054c.5-5.177-.838-9.674-3.549-13.66a.06.06 0 0 0-.031-.03M8.02 15.33c-1.182 0-2.157-1.085-2.157-2.419c0-1.333.956-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.956 2.418-2.157 2.418m7.975 0c-1.183 0-2.157-1.085-2.157-2.419c0-1.333.955-2.419 2.157-2.419c1.21 0 2.176 1.096 2.157 2.42c0 1.333-.946 2.418-2.157 2.418"/></svg></div></div></a><a href="https://bsky.app/profile/rspack.rs" target="_blank" rel="noopener noreferrer" class="rp-social-links__item"><div class="rp-social-links__icon"><div class="rp-social-links__icon"><svg xmlns="http://www.w3.org/2000/svg" width="100%" viewBox="0 0 24 24"><path fill="currentColor" d="M12 10.8c-1.087-2.114-4.046-6.053-6.798-7.995C2.566.944 1.561 1.266.902 1.565C.139 1.908 0 3.08 0 3.768c0 .69.378 5.65.624 6.479c.815 2.736 3.713 3.66 6.383 3.364q.204-.03.415-.056q-.207.033-.415.056c-3.912.58-7.387 2.005-2.83 7.078c5.013 5.19 6.87-1.113 7.823-4.308c.953 3.195 2.05 9.271 7.733 4.308c4.267-4.308 1.172-6.498-2.74-7.078a9 9 0 0 1-.415-.056q.21.026.415.056c2.67.297 5.568-.628 6.383-3.364c.246-.828.624-5.79.624-6.478c0-.69-.139-1.861-.9
4202-2.206c-.659-.298-1.664-.62-4.3 1.24C16.046 4.748 13.087 8.687 12 10.8"/></svg></div></div></a><ul class="rp-hover-group rp-hover-group--hidden rp-hover-group--right"></ul></div></div></div></ul></button></div></header><div class="rp-doc-layout__menu"><div class="rp-sidebar-menu"><button type="button" class="rp-sidebar-menu__left"><svg width="1em" height="1em" viewBox="0 0 32 32"><path fill="currentColor" d="M4 6h24v2H4zm0 18h24v2H4zm0-12h24v2H4zm0 6h24v2H4z"></path></svg><span>Menu</span></button><button type="button" class="rp-sidebar-menu__right"><span class="rp-sidebar-menu__right__text">ON THIS PAGE</span><svg width="14" height="14" class="rp-progress-circle"><circle cx="7" cy="7" r="6" stroke-linecap="round" fill="none" stroke="var(--rp-c-divider-light)" stroke-width="2"></circle><circle cx="7" cy="7" r="6" stroke-linecap="round" fill="none" stroke="var(--rp-c-brand)" stroke-width="2" stroke-dasharray="37.69911184307752" stroke-dashoffset="37.69911184307752" transform="rotate(-90 7 7)" style="transition:stroke-dashoffset 0.3s"></circle></svg><svg width="1em" height="1em" viewBox="0 0 32 32" class="rp-sidebar-menu__right__icon" style="transform:rotate(0deg);transition:transform 0.2s ease-out"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></button></div></div><div class="rp-doc-layout__container"><aside class="rp-doc-layout__sidebar rp-scrollbar"><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Start</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/start/" class="rp-sidebar-item rp-sidebar-item--active rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Introduction</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/start/quick-start" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Quick start</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/start/features" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Features</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/start/glossary" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Glossary</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/start/ai" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">AI</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Framework</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/framework/react" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">React</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/framework/vue" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Vue</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/framework/preact" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Preact</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/framework/svelte" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Svelte</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/framework/solid" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Solid</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Basic</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/basic/cli" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">CLI</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/server" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Dev server</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/output-files" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Output files</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/static-assets" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Static assets</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/html-template" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">HTML</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/json-files" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">JSON</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/wasm-assets" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Wasm</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/typescript" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">TypeScript</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/web-workers" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Web Workers</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/basic/deployment" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Deployment</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Configuration</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/configuration/rspack" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Configure Rspack</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/configuration/rsbuild" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Configure Rsbuild</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/configuration/swc" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Configure SWC</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Styling</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/styling/css-usage" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">CSS</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/styling/css-modules" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">CSS Modules</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/styling/css-in-js" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">CSS-in-JS</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/styling/tailwindcss" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Tailwind CSS v4</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/styling/tailwindcss-v3" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Tailwind CSS v3</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/styling/unocss" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">UnoCSS</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Advanced</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/advanced/alias" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Path aliases</span></div><div class="rp-sidebar-item__right"></div></a>
42<a href="/guide/advanced/env-vars" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Environment variables</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/hmr" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Hot module replacement</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/logging" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Logging</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/browserslist" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Browserslist</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/browser-compatibility" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Browser compatibility</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/module-federation" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Module Federation</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/environments" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Multi-environment builds</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/ssr" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Server-side rendering (SSR)</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/advanced/testing" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Testing</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Optimization</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/optimization/code-splitting" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Code splitting</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/optimization/optimize-bundle" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Bundle size optimization</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/optimization/build-performance" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Improve build performance</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/optimization/inline-assets" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Inline static assets</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Upgrade</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/upgrade/upgrade-rsbuild" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Upgrading Rsbuild</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/upgrade/v1-to-v2" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Upgrading from v1 to v2</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/upgrade/v0-to-v1" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Upgrading from 0.x to v1</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Migration</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/migration/webpack" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">webpack</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/migration/cra" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Create React App</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/migration/vue-cli" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Vue CLI</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/migration/vite" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Vite</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/migration/vite-plugin" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Vite plugin</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/migration/tanstack-start" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">TanStack Start</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>Debug</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/debug/debug-mode" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Debug mode</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/debug/build-profiling" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Build profiling</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/debug/rsdoctor" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Use Rsdoctor</span></div><div class="rp-sidebar-item__right"></div></a><div class="rp-sidebar-section-header"><div class="rp-sidebar-section-header__left"><span>FAQ</span></div><div class="rp-sidebar-section-header__right"></div></div><a href="/guide/faq/general" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">General FAQ</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/faq/features" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Features FAQ</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/faq/exceptions" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">Exceptions FAQ</span></div><div class="rp-sidebar-item__right"></div></a><a href="/guide/faq/hmr" class="rp-sidebar-item rp-link" style="padding-left:12px" data-depth="0"><div class="rp-sidebar-item__left"><span class="rp-doc">HMR FAQ</span></div><div class="rp-sidebar-item__right"></div></a></aside><div class="rp-doc-layout__doc"><main class="rp-doc-layout__doc-container"><div class="rp-doc rspress-doc"><!--$--><h1 class="rp-toc-include" id="introduction"><a href="#introduction" class="rp-header-anchor rp-link" aria-hidden="true">
42#</a>Introduction<!-- --> </h1> 43<p>Rsbuild is a modern build tool for web applications, powered by <a href="https://rspack.rs/" target="_blank" rel="noopener noreferrer" class="rp-link">Rspack</a>.</p> 44<p>It delivers fast builds and optimized production output, while keeping configuration simple, consistent, and extensible through plugins.</p> 45<h2 class="rp-toc-include" id="performance"><a href="#performance" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Performance</h2> 46<p>Powered by Rspack's Rust-based architecture, Rsbuild delivers blazing-fast performance to speed up your development workflow.</p> 47<p>Time to build a large web application:</p> 48<!-- --> 49<div class="root-Ollge_"><div class="item-sOpi_3"><p class="progressName-Ke8hc2">Rsbuild</p><div class="metricItem-YxRN9U"><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:4.839857651245551%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">1.36s</span> <!-- -->dev</div></div><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:11.92170818505338%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">3.35s</span> <!-- -->build</div></div><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:0.5693950177935942%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">160ms</span> <!-- -->hmr</div></div></div></div><div class="item-sOpi_3"><p class="progressName-Ke8hc2">Vite</p><div class="metricItem-YxRN9U"><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:23.131672597864767%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">6.50s</span> <!-- -->dev</div></div><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:7.046263345195729%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">1.98s</span> <!-- -->build</div></div><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:0.4626334519572953%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">130ms</span> <!-- -->hmr</div></div></div></div><div class="item-sOpi_3"><p class="progressName-Ke8hc2">webpack</p><div class="metricItem-YxRN9U"><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:76.15658362989322%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">21.40s</span> <!-- -->dev</div></div><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:100%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">28.10s</span> <!-- -->build</div></div><div class="container-FuNiZu"><div class="innerContainer-Fc0J9Z"><div class="bar-WHFMsk" style="width:9.893238434163699%"></div></div><div class="desc-lTD7cf"><span class="time-JXJR1M">2.78s</span> <!-- -->hmr</div></div></div></div></div> 50<blockquote> 51<p>ð Benchmark results from <a href="https://github.com/rstackjs/build-tools-performance" target="_blank" rel="noopener noreferrer" class="rp-link">build-tools-performance</a>.</p> 52</blockquote> 53<h2 class="rp-toc-include" id="comparisons"><a href="#comparisons" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Comparisons</h2> 54<p>Rsbuild is comparable to <a href="https://vitejs.dev/" target="_blank" rel="noopener noreferrer" class="rp-link">Vite</a>, <a href="https://github.com/facebook/create-react-app" target="_blank" rel="noopener noreferrer" class="rp-link">Create React App</a>, and <a href="https://github.com/vuejs/vue-cli" target="_blank" rel="noopener noreferrer" class="rp-link">Vue CLI</a>. Each of these tools includes a built-in dev server, command-line tools, and sensible defaults for an out-of-the-box experience.</p> 55<p><img src="https://assets.rspack.rs/rsbuild/assets/rsbuild-1-0-build-tools.png" alt=""/></p> 56<h3 class="rp-toc-include" id="cra--vue-cli"><a href="#cra--vue-cli" class="rp-header-anchor rp-link" aria-hidden="true">
56#</a>CRA / Vue CLI</h3> 57<p>You can think of Rsbuild as a modernized version of Create React App or Vue CLI, with these key differences:</p> 58<ul> 59<li>The underlying bundler has been switched from webpack to Rspack, delivering 5 to 10 times better build performance.</li> 60<li>It's decoupled from frontend UI frameworks and supports all frameworks via <a href="/plugins/list/" class="rp-link">plugins</a>, including React, Vue, Svelte, Solid, and more.</li> 61<li>It is more extensible. You can extend Rsbuild through <a href="/config/" class="rp-link">configurations</a>, the <a href="/plugins/dev/" class="rp-link">Plugin API</a>, and the <a href="/api/start/" class="rp-link">JavaScript API</a>.</li> 62</ul> 63<h3 class="rp-toc-include" id="vite"><a href="#vite" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Vite</h3> 64<p>Rsbuild has many similarities to Vite, as both aim to improve the frontend development experience. The main differences are:</p> 65<ul> 66<li><strong>Production consistency</strong>: Rsbuild uses Rspack for bundling in both development and production builds, ensuring high consistency between development and production outputs. Vite uses ESM during development for faster startup, but this approach can introduce inconsistencies between development and production outputs.</li> 67<li><strong>Ecosystem compatibility</strong>: Rsbuild is compatible with most webpack plugins and all Rspack plugins, while Vite is compatible with Rollup plugins. If you're using many plugins and loaders from the webpack ecosystem, migration to Rsbuild is more straightforward.</li> 68<li><strong>Module Federation</strong>: The Rsbuild team works closely with the <a href="/guide/advanced/module-federation" class="rp-link">Module Federation</a> development team, providing first-class support for Module Federation to help you develop large web applications with micro-frontend architecture.</li> 69</ul> 70<h2 class="rp-toc-include" id="features"><a href="#features" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Features</h2> 71<p>Rsbuild has the following features:</p> 72<ul> 73<li> 74<p><strong>Easy to configure</strong>: One of Rsbuild's goals is to give Rspack users out-of-the-box build capabilities so they can start web projects with zero configuration. Rsbuild also provides a semantic build configuration API to reduce the Rspack learning curve.</p> 75</li> 76<li> 77<p><strong>Performance-focused</strong>: Rsbuild integrates high-performance Rust-based tools from the community, including <a href="https://rspack.rs" target="_blank" rel="noopener noreferrer" class="rp-link">Rspack</a>, <a href="https://swc.rs/" target="_blank" rel="noopener noreferrer" class="rp-link">SWC</a>, and <a href="https://lightningcss.dev/" target="_blank" rel="noopener noreferrer" class="rp-link">Lightning CSS</a>, delivering first-class build speed and development experience.</p> 78</li> 79<li> 80<p><strong>Plugin ecosystem</strong>: Rsbuild has a lightweight plugin system and includes a range of high-quality official plugins. It is also compatible with most webpack plugins and all Rspack plugins, allowing you to use existing community or in-house plugins without rewriting code.</p> 81</li> 82<li> 83<p><strong>Stable artifacts</strong>: Rsbuild places a strong focus on build artifact stability. It ensures consistent artifacts in development and production builds, and automatically handles syntax downgrading and polyfill injection. Rsbuild also provides plugins for type checking and artifact syntax validation to prevent quality and compatibility issues from reaching production code.</p> 84</li> 85<li> 86<p><strong>Framework agnostic</strong>: Rsbuild is not coupled to any frontend UI framework. It supports frameworks like React, Vue, Svelte, Solid, and Preact through plugins, with plans to support more UI frameworks from the community in the future.</p> 87</li> 88</ul> 89<h2 class="rp-toc-include" id="rstack"><a href="#rstack" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Rstack</h2> 90<p>Rsbuild is part of Rstack, the fast, unified JavaScript toolchain for developers and agents.</p> 91<img src="https://assets.rspack.rs/rstack/rstack-overview.png" alt="Rstack" width="820"/> 92<p>Rstack includes the following tools:</p> 93<div class="rp-table-scroll-container rp-scrollbar"><table><thead><tr><th>
93Name</th><th>Description</th><th>Version</th></tr></thead><tbody><tr><td><a href="https://github.com/web-infra-dev/rspack" target="_blank" rel="noopener noreferrer" class="rp-link">Rspack</a></td><td>Bundler</td><td><a href="https://npmjs.com/package/@rspack/core"><img src="https://img.shields.io/npm/v/@rspack/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr><tr><td><a href="https://github.com/web-infra-dev/rsbuild" target="_blank" rel="noopener noreferrer" class="rp-link">Rsbuild</a></td><td>Build tool</td><td><a href="https://npmjs.com/package/@rsbuild/core"><img src="https://img.shields.io/npm/v/@rsbuild/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr><tr><td><a href="https://github.com/web-infra-dev/rslib" target="_blank" rel="noopener noreferrer" class="rp-link">Rslib</a></td><td>Library development tool</td><td><a href="https://npmjs.com/package/@rslib/core"><img src="https://img.shields.io/npm/v/@rslib/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr><tr><td><a href="https://github.com/web-infra-dev/rspress" target="_blank" rel="noopener noreferrer" class="rp-link">Rspress</a></td><td>Static site generator</td><td><a href="https://npmjs.com/package/@rspress/core"><img src="https://img.shields.io/npm/v/@rspress/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr><tr><td><a href="https://github.com/web-infra-dev/rsdoctor" target="_blank" rel="noopener noreferrer" class="rp-link">Rsdoctor</a></td><td>Build analyzer</td><td><a href="https://npmjs.com/package/@rsdoctor/core"><img src="https://img.shields.io/npm/v/@rsdoctor/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr><tr><td><a href="https://github.com/web-infra-dev/rstest" target="_blank" rel="noopener noreferrer" class="rp-link">Rstest</a></td><td>Testing framework</td><td><a href="https://npmjs.com/package/@rstest/core"><img src="https://img.shields.io/npm/v/@rstest/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr><tr><td><a href="https://github.com/web-infra-dev/rslint" target="_blank" rel="noopener noreferrer" class="rp-link">Rslint</a></td><td>Linter</td><td><a href="https://npmjs.com/package/@rslint/core"><img src="https://img.shields.io/npm/v/@rslint/core?style=flat-square&colorA=564341&colorB=EDED91" alt="npm version"/></a></td></tr></tbody></table></div> 94<h2 class="rp-toc-include" id="links"><a href="#links" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Links</h2> 95<ul> 96<li><a href="https://github.com/rstackjs/awesome-rstack" target="_blank" rel="noopener noreferrer" class="rp-link">awesome-rstack</a>: A curated list of awesome things related to Rstack.</li> 97<li><a href="https://github.com/rstackjs/agent-skills" target="_blank" rel="noopener noreferrer" class="rp-link">agent-skills</a>: A collection of Agent Skills for Rstack.</li> 98<li><a href="https://github.com/rstackjs/rstack-examples" target="_blank" rel="noopener noreferrer" class="rp-link">rstack-examples</a>: Examples showcasing Rstack tools.</li> 99<li><a href="https://github.com/rstackjs/storybook-rsbuild" target="_blank" rel="noopener noreferrer" class="rp-link">storybook-rsbuild</a>: Storybook builder powered by Rsbuild.</li> 100<li><a href="https://github.com/rstackjs/rsbuild-plugin-template" target="_blank" rel="noopener noreferrer" class="rp-link">rsbuild-plugin-template</a>: Use this template to create your own Rsbuild plugin.</li> 101<li><a href="https://github.com/rstackjs/rstack-design-resources" target="_blank" rel="noopener noreferrer" class="rp-link">rstack-design-resources</a>: Design resources for Rstack.</li> 102</ul> 103<h2 class="rp-toc-include" id="community"><a href="#community" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Community</h2> 104<p>Come and chat with us on <a href="https://discord.gg/XsaKEEk4mW" target="_blank" rel="noopener noreferrer" class="rp-link">Discord</a>! The Rstack team and users are active there, and we're always looking for contributions.</p> 105<h2 class="rp-toc-include" id="online-example"><a href="#online-example" class="rp-header-anchor rp-link" aria-hidden="true">
105#</a>Online example</h2> 106<p>Try Rsbuild online with the <a href="https://stackblitz.com/~/github.com/rstackjs/rsbuild-stackblitz-example" target="_blank" rel="noopener noreferrer" class="rp-link">StackBlitz example</a>.</p> 107<h2 class="rp-toc-include" id="next-step"><a href="#next-step" class="rp-header-anchor rp-link" aria-hidden="true">#</a>Next step</h2> 108<p>Next, you may want to:</p> 109<!-- --> 110<div class="next-steps-ox_kfz"><a href="/guide/start/quick-start" class="step-ZdacDG rp-link"><p class="title-yqulXf">Quick start</p><p class="description-JD1BgV">Learn how to use Rsbuild</p></a><a href="/guide/start/features" class="step-ZdacDG rp-link"><p class="title-yqulXf">All features</p><p class="description-JD1BgV">Learn all features of Rsbuild</p></a><a href="https://github.com/web-infra-dev/rsbuild" target="_blank" rel="noopener noreferrer" class="step-ZdacDG rp-link"><p class="title-yqulXf">Support Rsbuild</p><p class="description-JD1BgV">Support us with a star âï¸</p></a></div><!--/$--></div><footer class="rp-doc-footer"><div class="rp-doc-footer__edit"><a href="https://github.com/web-infra-dev/rsbuild/tree/main/website/docs/en/guide/start/index.mdx" target="_blank" rel="noopener noreferrer" class="rp-edit-link rp-link">Edit this page</a></div><div class="rp-doc-footer__divider"></div><div class="rp-prev-next-page"><div class="rp-prev-next-page__placeholder"></div><a href="/guide/start/quick-start" class="rp-prev-next-page__item rp-prev-next-page__next rp-link"><span class="rp-prev-next-page__item__desc">Next page</span><span class="rp-prev-next-page__item__title"><span>Quick start</span><svg width="1em" height="1em" viewBox="0 0 32 32" class="rp-prev-next-page__icon"><path fill="currentColor" d="M22 16 12 26l-1.4-1.4 8.6-8.6-8.6-8.6L12 6z"></path></svg></span></a></div></footer></main></div><aside class="rp-doc-layout__outline rp-scrollbar"><div class="rp-outline"><div class="rp-outline__title">ON THIS PAGE<svg width="14" height="14" class="rp-progress-circle"><circle cx="7" cy="7" r="6" stroke-linecap="round" fill="none" stroke="var(--rp-c-divider-light)" stroke-width="2"></circle><circle cx="7" cy="7" r="6" stroke-linecap="round" fill="none" stroke="var(--rp-c-brand)" stroke-width="2" stroke-dasharray="37.69911184307752" stroke-dashoffset="37.69911184307752" transform="rotate(-90 7 7)" style="transition:stroke-dashoffset 0.3s"></circle></svg></div><nav class="rp-outline__toc rp-scrollbar"><a href="#performance" class="rp-toc-item rp-link" title="Performance" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Performance</span></a><a href="#comparisons" class="rp-toc-item rp-link" title="Comparisons" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Comparisons</span></a><a href="#cra--vue-cli" class="rp-toc-item rp-link" title="CRA / Vue CLI" style="padding-left:12px" data-depth="1"><span class="rp-toc-item__text rp-doc">CRA / Vue CLI</span></a><a href="#vite" class="rp-toc-item rp-link" title="Vite" style="padding-left:12px" data-depth="1"><span class="rp-toc-item__text rp-doc">Vite</span></a><a href="#features" class="rp-toc-item rp-link" title="Features" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Features</span></a><a href="#rstack" class="rp-toc-item rp-link" title="Rstack" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Rstack</span></a><a href="#links" class="rp-toc-item rp-link" title="Links" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Links</span></a><a href="#community" class="rp-toc-item rp-link" title="Community" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Community</span></a><a href="#online-example" class="rp-toc-item rp-link" title="Online example" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Online example</span></a><a href="#next-step" class="rp-toc-item rp-link" title="Next step" style="padding-left:0" data-depth="0"><span class="rp-toc-item__text rp-doc">Next step</span></a></nav><div class="rp-outline__divider"></div><div class="rp-outline__bottom"><a href="https://github.com/web-infra-dev/rsbuild/tree/main/website/docs/en/guide/start/index.mdx" target="_blank" rel="noopener noreferrer" class="rp-outline__action-row rp-edit-link rp-link"><svg width="16" height="16" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24">
110<path d="M17 3a2.828 2.828 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5z"></path></svg><span>Edit this page</span></a><button class="rp-outline__action-row"><svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 24 24"><path fill="currentColor" d="M20 8v12H8V8zm0-2H8a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2"></path><path fill="currentColor" d="M4 16H2V4a2 2 0 0 1 2-2h12v2H4Z"></path></svg><span>Copy Markdown</span></button><div class="rp-outline__open-in-wrapper"><button class="rp-outline__action-row"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="none" viewBox="0 0 24 24"><path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6M15 3h6v6M10 14 21 3"></path></svg><span>Open in chat</span></button></div></div></div></aside></div></div> 111 <div id="__rspress_modal_container"></div> 112
112<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"7add10f7e6014d2c80b233432095b5f2","r":1,"spa":2}' crossorigin="anonymous"></script>
112 113</body> 114</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.