hysryt / wiki

https://hysryt.github.io/wiki/
0 stars 0 forks source link

esbuild #162

Open hysryt opened 3 years ago

hysryt commented 3 years ago

https://github.com/evanw/esbuild JavaScriptのバンドラー。 同様の機能を持つ webpack や rollup よりも高速らしい。

hysryt commented 3 years ago

速い理由

https://esbuild.github.io/faq/#why-is-esbuild-fast

Goで書かれている

Goで記述され、ネイティブコードにコンパイルされている。 webpack も rollup も percel も JavaScript製。

並列処理を多用している

Goは並列処理が得意とのこと。 コアを可能な限り有効活用することで速度を上げている。

一からスクラッチで書いている

ライブラリも使わず全て一から書いている。 依存関係がないのでインストールも速い。

TypeScriptのコンパイラも公式のものではなく一から作っている。 → 構文レベルの新機能が出てもすぐには使えない?

メモリを効率的に使用している

メモリのデータをあまり触らない(CPUキャッシュで済むように)ように組んでいるとのこと。 Goは省メモリらしい。

hysryt commented 3 years ago
% npx esbuild -h

Usage:
  esbuild [options] [entry points]

Documentation:
  https://esbuild.github.io/

Repository:
  https://github.com/evanw/esbuild

Simple options:
  --bundle              Bundle all dependencies into the output files
  --define:K=V          Substitute K with V while parsing
  --external:M          Exclude module M from the bundle (can use * wildcards)
  --format=...          Output format (iife | cjs | esm, no default when not
                        bundling, otherwise default is iife when platform
                        is browser and cjs when platform is node)
  --loader:X=L          Use loader L to load file extension X, where L is
                        one of: js | jsx | ts | tsx | json | text | base64 |
                        file | dataurl | binary
  --minify              Minify the output (sets all --minify-* flags)
  --outdir=...          The output directory (for multiple entry points)
  --outfile=...         The output file (for one entry point)
  --platform=...        Platform target (browser | node | neutral,
                        default browser)
  --serve=...           Start a local HTTP server on this host:port for outputs
  --sourcemap           Emit a source map
  --splitting           Enable code splitting (currently only for esm)
  --target=...          Environment target (e.g. es2017, chrome58, firefox57,
                        safari11, edge16, node10, default esnext)
  --watch               Watch mode: rebuild on file system changes

Advanced options:
  --banner:T=...            Text to be prepended to each output file of type T
                            where T is one of: css | js
  --charset=utf8            Do not escape UTF-8 code points
  --color=...               Force use of color terminal escapes (true | false)
  --log-limit=...           Maximum message count or 0 to disable (default 10)
  --footer:T=...            Text to be appended to each output file of type T
                            where T is one of: css | js
  --global-name=...         The name of the global for the IIFE format
  --inject:F                Import the file F into all input files and
                            automatically replace matching globals with imports
  --jsx-factory=...         What to use for JSX instead of React.createElement
  --jsx-fragment=...        What to use for JSX instead of React.Fragment
  --keep-names              Preserve "name" on functions and classes
  --log-level=...           Disable logging (info | warning | error | silent,
                            default info)
  --main-fields=...         Override the main file order in package.json
                            (default "browser,module,main" when platform is
                            browser and "main,module" when platform is node)
  --metafile=...            Write metadata about the build to a JSON file
  --minify-whitespace       Remove whitespace in output files
  --minify-identifiers      Shorten identifiers in output files
  --minify-syntax           Use equivalent but shorter syntax in output files
  --out-extension:.js=.mjs  Use a custom output extension instead of ".js"
  --outbase=...             The base path used to determine entry point output
                            paths (for multiple entry points)
  --preserve-symlinks       Disable symlink resolution for module lookup
  --public-path=...         Set the base URL for the "file" loader
  --pure:N                  Mark the name N as a pure function for tree shaking
  --resolve-extensions=...  A comma-separated list of implicit extensions
                            (default ".tsx,.ts,.jsx,.js,.css,.json")
  --servedir=...            What to serve in addition to generated output files
  --sourcefile=...          Set the source file for the source map (for stdin)
  --sourcemap=external      Do not link to the source map with a comment
  --sourcemap=inline        Emit the source map with an inline data URL
  --sources-content=false   Omit "sourcesContent" in generated source maps
  --tree-shaking=...        Set to "ignore-annotations" to work with packages
                            that have incorrect tree-shaking annotations
  --tsconfig=...            Use this tsconfig.json file instead of other ones
  --version                 Print the current version (0.9.2) and exit

Examples:
  # Produces dist/entry_point.js and dist/entry_point.js.map
  esbuild --bundle entry_point.js --outdir=dist --minify --sourcemap

  # Allow JSX syntax in .js files
  esbuild --bundle entry_point.js --outfile=out.js --loader:.js=jsx

  # Substitute the identifier RELEASE for the literal true
  esbuild example.js --outfile=out.js --define:RELEASE=true

  # Provide input via stdin, get output via stdout
  esbuild --minify --loader=ts < input.ts > output.js

  # Automatically rebuild when input files are changed
  esbuild app.ts --bundle --watch

  # Start a local HTTP server for everything in "www"
  esbuild app.ts --bundle --servedir=www --outdir=www/js