Skip to content

Commit

Permalink
docs: improve introduction and fix links in README (#2259)
Browse files Browse the repository at this point in the history
  • Loading branch information
chenjiahan authored May 3, 2024
1 parent 2efbf41 commit 3397f5b
Show file tree
Hide file tree
Showing 6 changed files with 25 additions and 13 deletions.
9 changes: 6 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@ English | [简体中文](./README.zh-CN.md)

Rsbuild is a high-performance build tool powered by Rspack. It provides a set of thoughtfully designed default build configs, offering an out-of-the-box development experience and can fully unleash the performance advantages of Rspack.

Rsbuild provides [rich build features](https://rsbuild.dev/guide/start/features), including the compilation of TypeScript, JSX, Sass, Less, CSS modules, Wasm, and others. It also supports Module Federation, image compression, type checking, PostCSS, Lighting CSS, and more.

## 💡 Comparisons

Rsbuild is a build tool that is on par with [Vite](https://vitejs.dev/), [Create React App](https://github.com/facebook/create-react-app), or [Vue CLI](https://github.com/vuejs/vue-cli). They all come with builtin dev servers, command line tools, and sensible build configurations to provide the out-of-the-box experience.
Expand All @@ -35,15 +37,16 @@ Rsbuild is a build tool that is on par with [Vite](https://vitejs.dev/), [Create
You can think of Rsbuild as a modernized version of Create React App or Vue CLI, with these main differences:

- The underlying bundler is switched from Webpack to Rspack, providing 5 to 10 times the build performance.
- It is decoupled from frontend UI frameworks and supports all UI frameworks via [plugins](/plugins/list/index), including React, Vue, Svelte, Solid, etc.
- It offers better extensibility. You can extend Rsbuild flexibly via [Configurations](/config/index), [Plugin API](/plugins/dev/index), and [JavaScript API](/api/start/index).
- It is decoupled from frontend UI frameworks and supports all UI frameworks via [plugins](https://rsbuild.dev/plugins/list/), including React, Vue, Svelte, Solid, etc.
- It offers better extensibility. You can extend Rsbuild flexibly via [Configurations](https://rsbuild.dev/config/), [Plugin API](https://rsbuild.dev/plugins/dev/), and [JavaScript API](https://rsbuild.dev/api/start/).

### Vite

Rsbuild shares many similarities with Vite, as they are both aim to improve the frontend development experience. The main differences are:

- **Ecosystem compatibility**: Rsbuild is compatible with most webpack plugins and all Rspack plugins, while Vite is compatible with Rollup plugins. If you're currently using more plugins and loaders from the webpack ecosystem, migrating to Rsbuild would be relatively easy.
- **Production consistency**: Rsbuild uses Rspack for bundling during both the development and production builds, thus ensuring a high level of consistency between the development and production outputs. This is also one of the goals Vite aims to achieve with [Rolldown](https://rolldown.rs/).
- **Module Federation**: The Rsbuild team works closely with the [Module Federation](https://rsbuild.dev/guide/advanced/module-federation) development team, providing first-class support for Module Federation to help you develop large web applications with micro frontend architecture.

## 🚀 Performance

Expand All @@ -59,7 +62,7 @@ Rsbuild has the following features:

- **Easy to Configure**: One of the goals of Rsbuild is to provide out-of-the-box build capabilities for Rspack users, allowing developers to start a web project with zero configuration. In addition, Rsbuild provides semantic build configuration to reduce the learning curve for Rspack configuration.

- **Performance Oriented**: Rsbuild integrates high-performance Rust-based tools from the community, including [Rspack](https://github.com/web-infra-dev/rspack), [SWC](https://swc.rs/) and [Lightning CSS](https://lightningcss.dev/), to deliver top-notch build speed and development experience. Compared to webpack-based tools like Create React App and Vue CLI, Rsbuild provides 5 to 10 times faster build performance and lighter dependencies.
- **Performance Oriented**: Rsbuild integrates high-performance Rust-based tools from the community, including [Rspack](https://rspack.dev), [SWC](https://swc.rs/) and [Lightning CSS](https://lightningcss.dev/), to deliver first-class build speed and development experience.

- **Plugin Ecosystem**: Rsbuild has a lightweight plugin system and includes a range of high-quality official plugins. Furthermore, Rsbuild is compatible with most webpack plugins and all Rspack plugins, allowing users to leverage existing community or in-house plugins in Rsbuild without the need for rewriting code.

Expand Down
13 changes: 8 additions & 5 deletions README.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,8 @@

Rsbuild 是由 [Rspack](https://rspack.dev/) 驱动的高性能构建工具,它默认包含了一套精心设计的构建配置,提供开箱即用的开发体验,并能够充分发挥出 Rspack 的性能优势。

Rsbuild 提供 [丰富的构建功能](https://rsbuild.dev/zh/guide/start/features),包括编译 TypeScript,JSX,Sass,Less,CSS Modules,Wasm,以及其他资源,也支持模块联邦、图片压缩、类型检查、PostCSS,Lighting CSS 等功能。

## 💡 对比其他工具

Rsbuild 是与 [Vite](https://vitejs.dev/)[Create React App](https://github.com/facebook/create-react-app)[Vue CLI](https://github.com/vuejs/vue-cli) 处于同一层级的构建工具,它们都默认包含了开发服务器、命令行工具和合理的构建配置,以此来提供开箱即用的体验。
Expand All @@ -35,15 +37,16 @@ Rsbuild 是与 [Vite](https://vitejs.dev/)、[Create React App](https://github.c
你可以将 Rsbuild 理解为一个现代化的 Create React App 或 Vue CLI,它与这些工具的主要区别在于:

- 底层的打包工具由 Webpack 替换为 Rspack,提供 5 ~ 10 倍的构建性能。
- 与前端 UI 框架解耦,并通过 [插件](/plugins/list/index) 来支持所有 UI 框架,包括 React、Vue、Svelte、Solid 等。
- 提供更好的扩展性,你可以通过 [配置](/config/index)[插件 API](/plugins/dev/index)[JavaScript API](/api/start/index) 来灵活地扩展 Rsbuild。
- 与前端 UI 框架解耦,并通过 [插件](https://rsbuild.dev/zh/plugins/list/) 来支持所有 UI 框架,包括 React、Vue、Svelte、Solid 等。
- 提供更好的扩展性,你可以通过 [配置](https://rsbuild.dev/zh/config/)[插件 API](https://rsbuild.dev/zh/plugins/dev/)[JavaScript API](https://rsbuild.dev/zh/api/start/) 来灵活地扩展 Rsbuild。

### Vite

Rsbuild 与 Vite 有许多相似之处,它们皆致力于提升前端的开发体验。其主要区别在于:

- **生态兼容性**:Rsbuild 兼容大部分的 webpack 插件和所有 Rspack 插件,而 Vite 则是兼容 Rollup 插件。如果你目前更多地使用了 webpack 生态的插件和 loaders,那么迁移到 Rsbuild 是相对容易的。
- **生产一致性**:Rsbuild 在开发阶段和生产构建均使用 Rspack 进行打包,因此开发和生产构建的产物具备较强的一致性,这也是 Vite 通过 [Rolldown](https://rolldown.rs/) 想要实现的目标之一。
- **模块联邦**:Rsbuild 团队与 [Module Federation](https://rsbuild.dev/zh/guide/advanced/module-federation) 的开发团队密切合作,并为 Module Federation 提供一流的支持,帮助你开发微前端架构的大型 Web 应用。

## 🚀 性能

Expand All @@ -59,11 +62,11 @@ Rsbuild 具备以下特性:

- **易于配置**:Rsbuild 的目标之一,是为 Rspack 用户提供开箱即用的构建能力,使开发者能够在零配置的情况下开发 web 项目。同时,Rsbuild 提供一套语义化的构建配置,以降低 Rspack 配置的学习成本。

- **性能优先**:Rsbuild 集成了社区中基于 Rust 的高性能工具,包括 [Rspack](https://github.com/web-infra-dev/rspack)[SWC](https://swc.rs/)[Lightning CSS](https://lightningcss.dev/),以提供一流的构建速度和开发体验。与基于 Webpack 的 Create React App 和 Vue CLI 等工具相比,Rsbuild 提供了 5 ~ 10 倍的构建性能,以及更轻量的依赖体积
- **性能优先**:Rsbuild 集成了社区中基于 Rust 的高性能工具,包括 [Rspack](https://rspack.dev)[SWC](https://swc.rs/)[Lightning CSS](https://lightningcss.dev/),以提供一流的构建速度和开发体验。

- **插件生态**:Rsbuild 内置一个轻量级的插件系统,提供一系列高质量的官方插件。此外,Rsbuild 兼容大部分的 webpack 插件和所有的 Rspack 插件,这意味着你可以在 Rsbuild 中使用社区或公司内沉淀的现有插件,而不需要重写相关代码
- **插件生态**:Rsbuild 内置一个轻量级的插件系统,提供一系列高质量的官方插件。此外,Rsbuild 兼容大部分的 webpack 插件和所有的 Rspack 插件,这意味着你可以在 Rsbuild 中使用社区或公司内沉淀的现有插件,而无须重写相关代码

- **产物稳定**:Rsbuild 设计时充分考虑了构建产物的稳定性,它的开发环境产物和生产构建产物具备较高的一致性,并自动完成语法降级和 polyfill 注入。Rsbuild 也提供插件来进行 TypeScript 类型检查和产物语法检查,以避免线上代码的质量问题和兼容性问题。
- **产物稳定**:Rsbuild 设计时充分考虑了构建产物的稳定性,它的开发和生产构建产物具备较强的一致性,并自动完成语法降级和 polyfill 注入。Rsbuild 也提供插件来进行 TypeScript 类型检查和产物语法检查,以避免线上代码的质量问题和兼容性问题。

- **框架无关**:Rsbuild 不与前端 UI 框架耦合,并通过插件来支持 React、Vue 3、Vue 2、Svelte、Solid、Lit 等框架,未来也计划支持社区中更多的 UI 框架。

Expand Down
2 changes: 1 addition & 1 deletion website/docs/en/guide/advanced/module-federation.mdx
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# Module Federation

Rsbuild has worked closely with the authors and development team of the Module Federation, and provides first-class support for the Module Federation.
The Rsbuild team worked closely with the Module Federation development team, and provides first-class support for the Module Federation.

## What is Module Federation

Expand Down
5 changes: 4 additions & 1 deletion website/docs/en/guide/start/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

Rsbuild is a high-performance build tool powered by Rspack. It provides a set of thoughtfully designed default build configs, offering an out-of-the-box development experience and can fully unleash the performance advantages of Rspack.

Rsbuild provides [rich build features](/guide/start/features), including the compilation of TypeScript, JSX, Sass, Less, CSS modules, Wasm, and others. It also supports Module Federation, image compression, type checking, PostCSS, Lighting CSS, and more.

## 💡 Comparisons

Rsbuild is a build tool that is on par with [Vite](https://vitejs.dev/), [Create React App](https://github.com/facebook/create-react-app), or [Vue CLI](https://github.com/vuejs/vue-cli). They all come with builtin dev servers, command line tools, and sensible build configurations to provide the out-of-the-box experience.
Expand All @@ -20,6 +22,7 @@ Rsbuild shares many similarities with Vite, as they are both aim to improve the

- **Ecosystem compatibility**: Rsbuild is compatible with most webpack plugins and all Rspack plugins, while Vite is compatible with Rollup plugins. If you're currently using more plugins and loaders from the webpack ecosystem, migrating to Rsbuild would be relatively easy.
- **Production consistency**: Rsbuild uses Rspack for bundling during both the development and production builds, thus ensuring a high level of consistency between the development and production outputs. This is also one of the goals Vite aims to achieve with [Rolldown](https://rolldown.rs/).
- **Module Federation**: The Rsbuild team works closely with the [Module Federation](/guide/advanced/module-federation) development team, providing first-class support for Module Federation to help you develop large web applications with micro frontend architecture.

## 🚀 Performance

Expand All @@ -35,7 +38,7 @@ Rsbuild has the following features:

- **Easy to Configure**: One of the goals of Rsbuild is to provide out-of-the-box build capabilities for Rspack users, allowing developers to start a web project with zero configuration. In addition, Rsbuild provides semantic build configuration to reduce the learning curve for Rspack configuration.

- **Performance Oriented**: Rsbuild integrates high-performance Rust-based tools from the community, including [Rspack](https://github.com/web-infra-dev/rspack), [SWC](https://swc.rs/) and [Lightning CSS](https://lightningcss.dev/), to deliver top-notch build speed and development experience. Compared to webpack-based tools like Create React App and Vue CLI, Rsbuild provides 5 to 10 times faster build performance and lighter dependencies.
- **Performance Oriented**: Rsbuild integrates high-performance Rust-based tools from the community, including [Rspack](https://rspack.dev), [SWC](https://swc.rs/) and [Lightning CSS](https://lightningcss.dev/), to deliver first-class build speed and development experience.

- **Plugin Ecosystem**: Rsbuild has a lightweight plugin system and includes a range of high-quality official plugins. Furthermore, Rsbuild is compatible with most webpack plugins and all Rspack plugins, allowing users to leverage existing community or in-house plugins in Rsbuild without the need for rewriting code.

Expand Down
4 changes: 2 additions & 2 deletions website/docs/zh/community/releases/v0-1.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -30,9 +30,9 @@ Rsbuild 具备以下特性:

- **性能优先**:Rsbuild 集成了社区中基于 Rust 的高性能工具,包括 [Rspack](https://github.com/web-infra-dev/rspack)[SWC](https://swc.rs/)[Lightning CSS](https://lightningcss.dev/),以提供一流的构建速度和开发体验。与基于 Webpack 的 Create React App 和 Vue CLI 等工具相比,Rsbuild 提供了 5 ~ 10 倍的构建性能,以及更轻量的依赖体积。

- **插件生态**:Rsbuild 内置一个轻量级的插件系统,提供一系列高质量的官方插件。此外,Rsbuild 兼容大部分的 webpack 插件和所有的 Rspack 插件,这意味着你可以在 Rsbuild 中使用社区或公司内沉淀的现有插件,而不需要重写相关代码
- **插件生态**:Rsbuild 内置一个轻量级的插件系统,提供一系列高质量的官方插件。此外,Rsbuild 兼容大部分的 webpack 插件和所有的 Rspack 插件,这意味着你可以在 Rsbuild 中使用社区或公司内沉淀的现有插件,而无须重写相关代码

- **产物稳定**:Rsbuild 设计时充分考虑了构建产物的稳定性,它的开发环境产物和生产构建产物具备较高的一致性,并自动完成语法降级和 polyfill 注入。Rsbuild 也提供插件来进行 TypeScript 类型检查和产物语法检查,以避免线上代码的质量问题和兼容性问题。
- **产物稳定**:Rsbuild 设计时充分考虑了构建产物的稳定性,它的开发和生产构建产物具备较强的一致性,并自动完成语法降级和 polyfill 注入。Rsbuild 也提供插件来进行 TypeScript 类型检查和产物语法检查,以避免线上代码的质量问题和兼容性问题。

- **框架无关**:Rsbuild 不与前端 UI 框架耦合,并通过插件来支持 React、Vue 3、Vue 2、Svelte、Solid、Lit 等框架,未来也计划支持社区中更多的 UI 框架。

Expand Down
5 changes: 4 additions & 1 deletion website/docs/zh/guide/start/index.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,8 @@

Rsbuild 是由 [Rspack](https://rspack.dev/) 驱动的高性能构建工具,它默认包含了一套精心设计的构建配置,提供开箱即用的开发体验,并能够充分发挥出 Rspack 的性能优势。

Rsbuild 提供 [丰富的构建功能](/guide/start/features),包括编译 TypeScript,JSX,Sass,Less,CSS Modules,Wasm,以及其他资源,也支持模块联邦、图片压缩、类型检查、PostCSS,Lighting CSS 等功能。

## 💡 对比其他工具

Rsbuild 是与 [Vite](https://vitejs.dev/)[Create React App](https://github.com/facebook/create-react-app)[Vue CLI](https://github.com/vuejs/vue-cli) 处于同一层级的构建工具,它们都默认包含了开发服务器、命令行工具和合理的构建配置,以此来提供开箱即用的体验。
Expand All @@ -20,6 +22,7 @@ Rsbuild 与 Vite 有许多相似之处,它们皆致力于提升前端的开发

- **生态兼容性**:Rsbuild 兼容大部分的 webpack 插件和所有 Rspack 插件,而 Vite 则是兼容 Rollup 插件。如果你目前更多地使用了 webpack 生态的插件和 loaders,那么迁移到 Rsbuild 是相对容易的。
- **生产一致性**:Rsbuild 在开发阶段和生产构建均使用 Rspack 进行打包,因此开发和生产构建的产物具备较强的一致性,这也是 Vite 通过 [Rolldown](https://rolldown.rs/) 想要实现的目标之一。
- **模块联邦**:Rsbuild 团队与 [Module Federation](/guide/advanced/module-federation) 的开发团队密切合作,并为 Module Federation 提供一流的支持,帮助你开发微前端架构的大型 Web 应用。

## 🚀 性能

Expand All @@ -35,7 +38,7 @@ Rsbuild 具备以下特性:

- **易于配置**:Rsbuild 的目标之一,是为 Rspack 用户提供开箱即用的构建能力,使开发者能够在零配置的情况下开发 web 项目。同时,Rsbuild 提供一套语义化的构建配置,以降低 Rspack 配置的学习成本。

- **性能优先**:Rsbuild 集成了社区中基于 Rust 的高性能工具,包括 [Rspack](https://github.com/web-infra-dev/rspack)[SWC](https://swc.rs/)[Lightning CSS](https://lightningcss.dev/),以提供一流的构建速度和开发体验。与基于 Webpack 的 Create React App 和 Vue CLI 等工具相比,Rsbuild 提供了 5 ~ 10 倍的构建性能,以及更轻量的依赖体积
- **性能优先**:Rsbuild 集成了社区中基于 Rust 的高性能工具,包括 [Rspack](https://rspack.dev)[SWC](https://swc.rs/)[Lightning CSS](https://lightningcss.dev/),以提供一流的构建速度和开发体验。

- **插件生态**:Rsbuild 内置一个轻量级的插件系统,提供一系列高质量的官方插件。此外,Rsbuild 兼容大部分的 webpack 插件和所有的 Rspack 插件,这意味着你可以在 Rsbuild 中使用社区或公司内现有的插件,而无须重写相关代码。

Expand Down

0 comments on commit 3397f5b

Please sign in to comment.