字节跳动-何云飞-Rspack - 基于 Rust 的高性能 Web 构建工具.pdf

1、Rspack何云-前端程师个简介 何云 字节跳动前端程师 Rspack 团队成员 GitHub: Why Rspack?Why not？性能优势 主要特性 落地情况 迭代模式 未来Rspack 是什么性能的 Web 构建具Why Rspack?Why Rspack?天时地利和Why Rspack?天时地利和天时 中规模的 Web 应的越来越常 开发/产构建时间越来越 社区渴望更好的开发/构建体验 Vite，Esbuild 产物性能不达标地利天时地利和地利“这个事情简单来说，就是前端应越来越复杂，Bundler 的瓶颈已经很明显了，但是社区论是 Webpack、ESBuild、SWC 等等，没有

2、个能独挡全，所以我们搞个。可以解决业务实际临的问题，增强与团队内各种业务基建之间的协同，同时旦做好了之后，可以在未来年引领前端社区的发展趋势。”Why Rspack?天时地利和Why Rspack?开发/产构建时间配置不灵活产物性能不达标 Why Rspack?开发/产构建时间配置不灵活产物性能不达标 配置不灵活 公司业务繁多，需要持各种开发场景 多数开发具法同时满“构建性能”与“优秀的配置灵活性”新代构建具态不够成熟，部分场景法开箱即Why Rspack?开发/产构建时间配置不灵活产物性能不达标 产物性能不达标多数开发具法同时满“构建性能”与“强的产环境优化能”Why Rspack?开发/产

3、构建时间配置不灵活产物性能不达标 开发/产构建时间开发：启动时间过，通常为 5-10 分钟，单次 HMR 10-20 秒产：构建时间过，通常为 10-20 分钟，降低持续部署的效率开发者的诉求对性能的诉求：冷启动要快，产构建也要快对灵活性的诉求：构建具的配置要够灵活，能应对各种使场景对产环境产物性能的诉求：Code Splitting 等能决定了产物性能Why not?Why not?EsbuildViteTurbopackWhy not?EsbuildViteTurbopackWhy not?EsbuildViteTurbopackWhy not?EsbuildViteTurbopackTu

4、rbopack结论抛弃 Webpack？更快的 Webpack！Rspack基于 Rust 的性能 Web 构建引擎性能优势语优势并计算性能优势语优势并计算结论抛弃 Webpack？更快的 Webpack！并计算并计算性能优势语优势并计算主要特性Webpack 兼容性增量 HMR开箱即主要特性Webpack 兼容性增量 HMR开箱即开箱即 TypeScript 持 React 持 动打包.png 等资源件 原 CSS/CSS module 持主要特性Webpack 兼容性增量 HMR开箱即BenchmarkBenchmark主要特性Webpack 兼容性增量 HMR开箱即已经兼容的 Loade

5、r vue-loader svelte-loader css-loader style-loader babel-loader node-loader postcss-loader babel-loader sass-loader less-loader raw-loader babel-loader svgr/webpack thread-loader 态兼容性-Vue态兼容性-Svelte落地落地案例 Webpack+Vite案例 Webpack 产环境构建，Vite 于开发模式 把 Webpack 的配置迁移到 Rspack 配置 协调业务侧，进回归测试 产物+内容对 分析收益案例落地R

6、spack&Modern.jsRspack 迭代模式Working group 模式未来懒编译Module Federation持久化缓存未来懒编译Module Federation持久化缓存未来懒编译Module Federation持久化缓存未来懒编译Module Federation持久化缓存未来赖编译Module Federation持久化缓存EndQ&A了解更多技术实践案例思博(msup)有限公司是家向技术型企业的培训咨询机构，携2000余位中外客座导师，服务于技术