esbuild
esbuild 用 Go 语言实现,编译速度远超传统工具,支持 JSX、TS、CSS 预处理等。适合需要高效构建的 CI/CD 环境和大型项目。
当你在开发Web应用时,需要将JavaScript、CSS、TypeScript、JSX等资源打包成一个或多个文件,同时追求毫秒级的构建速度——esbuild正是为此设计的Go语言编写的高性能打包器。
| 收费 | MIT开源免费 |
|---|---|
| 平台 | CLI / JavaScript API / Go API |
| 中文 | 有第三方中文文档站 |
| 用途 | Web应用打包与压缩 |
esbuild的官方基准测试显示,对10份three.js库副本进行包含压缩和源映射的生产构建,esbuild耗时0.39秒,而Parcel 2需14.91秒,Rollup 4 + terser需34.10秒,Webpack 5需41.21秒。这种10-100倍的速度差异源于三个技术选择:使用Go语言编译为原生代码,避免JavaScript VM每次运行时的解析开销;利用Go的共享内存线程模型实现高效并行,而JavaScript多线程因独立堆导致垃圾回收占用约一半CPU核心;内部算法从头为并行化设计。
esbuild默认支持JavaScript、CSS、TypeScript、JSX、JSON、文本、二进制、Base64、Data URL、外部文件、空文件共11种内容类型。JSX语法无需额外配置,仅凭.jsx扩展名即可自动转换;若需在.js文件中使用JSX,可通过--loader:.js=jsx标志开启。CSS模块、树摇(Tree Shaking)、压缩(Minification)、源映射(Source Maps)均为内置功能,无需插件。
esbuild提供CLI、JavaScript API和Go API三种使用方式。JavaScript API支持异步build()和同步buildSync(),但插件仅适用于异步API。插件系统基于四个回调钩子:on-resolve(解析路径)、on-load(加载内容)、on-start(构建开始)、on-end(构建结束)、on-dispose(插件卸载)。每个回调可访问构建选项和路径解析上下文。官方文档提供了示例插件,但插件API存在限制(如不支持自定义文件系统)。
推荐通过npm安装预构建的原生可执行文件:npm install --save-exact --save-dev esbuild。安装后运行./node_modules/.bin/esbuild --version验证。首个打包示例:安装react和react-dom,创建app.jsx文件(含JSX代码),执行esbuild app.jsx --bundle --outfile=out.js即可生成自包含的out.js文件。
Q1:esbuild为什么比Webpack快那么多?
A1:esbuild用Go编写并编译为原生代码,避免了JavaScript VM每次运行时的解析开销;Go的共享内存线程模型实现高效并行,而JavaScript多线程因独立堆导致垃圾回收占用约一半CPU核心;内部算法从头为并行化设计。官方基准测试中,对10份three.js库进行生产构建,esbuild仅需0.39秒,Webpack 5需41.21秒。
Q2:esbuild支持TypeScript和JSX吗?需要额外配置吗?
A2:支持。TypeScript和JSX均内置支持,无需额外配置。JSX语法仅需文件扩展名为.jsx即可自动转换;若想在.js文件中使用JSX,需添加--loader:.js=jsx标志。
Q3:esbuild的插件系统有哪些回调?
A3:插件系统提供5个回调:on-resolve(解析路径)、on-load(加载内容)、on-start(构建开始)、on-end(构建结束)、on-dispose(插件卸载)。每个回调可访问构建选项和路径解析上下文。注意插件仅适用于异步API(build()),同步API buildSync()不支持插件。
更多同类工具与网站,可在预编译工具分类继续挑选。
信息核实于 2026年7月,具体以官网为准。
评论
暂无评论