Babel là JavaScript compiler với 3-phase pipeline: Parse (source code → AST via @babel/parser), Transform (plugins traverse và modify AST — ví dụ arrow function plugin chuyển () => {} thành function() {}), Generate (AST → output code via @babel/generator).
- Polyfills vs transforms: transforms là syntax changes (const → var, class → prototype); polyfills là runtime additions cho missing APIs (Promise, Array.from, fetch) — Babel transforms syntax nhưng không tự polyfill APIs. core-js là polyfill library chuẩn — @babel/preset-env với useBuiltIns: 'usage' tự động import chỉ polyfills cần thiết dựa trên browserslist config. browserslist config (trong package.json hoặc .browserslistrc): target browsers list như '> 0.5%, last 2 versions, not dead' — preset-env compile chỉ những features không được target browsers hỗ trợ natively, giảm output size.
- Plugin order: plugins chạy trước presets, plugins first-to-last, presets last-to-first (legacy behavior).
- Babel vs SWC vs esbuild: Babel chậm nhất (JS) nhưng most customizable plugin ecosystem; SWC nhanh hơn 20-70x (Rust), ít plugins hơn; esbuild nhanh nhất nhưng không hỗ trợ custom transforms.
Babel is a JavaScript compiler with a 3-phase pipeline: Parse (source code → AST via @babel/parser), Transform (plugins traverse and modify the AST — for example, the arrow function plugin converts () => {} to function() {}), Generate (AST → output code via @babel/generator).
- Polyfills vs transforms: transforms are syntax changes (const → var, class → prototype); polyfills are runtime additions for missing APIs (Promise, Array.from, fetch) — Babel transforms syntax but does not polyfill APIs automatically. core-js is the standard polyfill library — @babel/preset-env with useBuiltIns: 'usage' automatically imports only the polyfills needed based on the browserslist config. browserslist config (in package.json or .browserslistrc): target browser list such as '> 0.5%, last 2 versions, not dead' — preset-env compiles only features not natively supported by target browsers, reducing output size.
- Plugin order: plugins run before presets, plugins first-to-last, presets last-to-first (legacy behavior).
- Babel vs SWC vs esbuild: Babel is the slowest (JS) but has the most customizable plugin ecosystem; SWC is 20-70x faster (Rust) with fewer plugins; esbuild is the fastest but does not support custom transforms.