{"id":13677591,"url":"https://github.com/webpack-contrib/compression-webpack-plugin","last_synced_at":"2025-05-08T23:35:34.394Z","repository":{"id":9890460,"uuid":"11895397","full_name":"webpack-contrib/compression-webpack-plugin","owner":"webpack-contrib","description":"Prepare compressed versions of assets to serve them with Content-Encoding","archived":false,"fork":false,"pushed_at":"2025-01-21T17:31:29.000Z","size":4154,"stargazers_count":1422,"open_issues_count":5,"forks_count":108,"subscribers_count":24,"default_branch":"master","last_synced_at":"2025-05-08T20:53:45.350Z","etag":null,"topics":["webpack-plugin"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":"dennishucd/FFmpeg4Android","license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/webpack-contrib.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":".github/CONTRIBUTING.md","funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":".github/CODEOWNERS","security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"open_collective":"webpack"}},"created_at":"2013-08-05T10:07:57.000Z","updated_at":"2025-05-08T04:26:23.000Z","dependencies_parsed_at":"2024-05-02T17:41:03.998Z","dependency_job_id":"c49d2995-0ef6-4bc1-927d-1410b36b898e","html_url":"https://github.com/webpack-contrib/compression-webpack-plugin","commit_stats":{"total_commits":272,"total_committers":39,"mean_commits":"6.9743589743589745","dds":0.7647058823529411,"last_synced_commit":"bcfd402d1655425e03443231f5ca9ff4fc100ce7"},"previous_names":[],"tags_count":55,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack-contrib%2Fcompression-webpack-plugin","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack-contrib%2Fcompression-webpack-plugin/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack-contrib%2Fcompression-webpack-plugin/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/webpack-contrib%2Fcompression-webpack-plugin/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/webpack-contrib","download_url":"https://codeload.github.com/webpack-contrib/compression-webpack-plugin/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":253155329,"owners_count":21862677,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["webpack-plugin"],"created_at":"2024-08-02T13:00:44.411Z","updated_at":"2025-05-08T23:35:34.373Z","avatar_url":"https://github.com/webpack-contrib.png","language":"JavaScript","readme":"\u003cdiv align=\"center\"\u003e\n  \u003ca href=\"https://github.com/webpack/webpack\"\u003e\n    \u003cimg width=\"200\" height=\"200\" src=\"https://webpack.js.org/assets/icon-square-big.svg\"\u003e\n  \u003c/a\u003e\n\u003c/div\u003e\n\n[![npm][npm]][npm-url]\n[![node][node]][node-url]\n[![tests][tests]][tests-url]\n[![cover][cover]][cover-url]\n[![discussion][discussion]][discussion-url]\n[![size][size]][size-url]\n\n# compression-webpack-plugin\n\nPrepare compressed versions of assets to serve them with Content-Encoding.\n\n## Getting Started\n\nTo begin, you'll need to install `compression-webpack-plugin`:\n\n```console\nnpm install compression-webpack-plugin --save-dev\n```\n\nor\n\n```console\nyarn add -D compression-webpack-plugin\n```\n\nor\n\n```console\npnpm add -D compression-webpack-plugin\n```\n\nThen add the plugin to your `webpack` config. For example:\n\n**webpack.config.js**\n\n```js\nconst CompressionPlugin = require(\"compression-webpack-plugin\");\n\nmodule.exports = {\n  plugins: [new CompressionPlugin()],\n};\n```\n\nAnd run `webpack` via your preferred method.\n\n## Options\n\n- **[`test`](#test)**\n- **[`include`](#include)**\n- **[`exclude`](#exclude)**\n- **[`algorithm`](#algorithm)**\n- **[`compressionOptions`](#compressionoptions)**\n- **[`threshold`](#threshold)**\n- **[`minRatio`](#minratio)**\n- **[`filename`](#filename)**\n- **[`deleteOriginalAssets`](#deleteoriginalassets)**\n\n### `test`\n\nType:\n\n```ts\ntype test = string | RegExp | Array\u003cstring | RegExp\u003e;\n```\n\nDefault: `undefined`\n\nInclude all assets that pass test assertion.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      test: /\\.js(\\?.*)?$/i,\n    }),\n  ],\n};\n```\n\n### `include`\n\nType:\n\n```ts\ntype include = string | RegExp | Array\u003cstring | RegExp\u003e;\n```\n\nDefault: `undefined`\n\nInclude all assets matching any of these conditions.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      include: /\\/includes/,\n    }),\n  ],\n};\n```\n\n### `exclude`\n\nType:\n\n```ts\ntype exclude = string | RegExp | Array\u003cstring | RegExp\u003e;\n```\n\nDefault: `undefined`\n\nExclude all assets matching any of these conditions.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      exclude: /\\/excludes/,\n    }),\n  ],\n};\n```\n\n### `algorithm`\n\nType:\n\n```ts\ntype algorithm =\n  | string\n  | ((\n      input: Buffer,\n      options: CompressionOptions,\n      callback: (\n        error: Error | null | undefined,\n        result:\n          | string\n          | ArrayBuffer\n          | SharedArrayBuffer\n          | Uint8Array\n          | readonly number[]\n          | {\n              valueOf(): ArrayBuffer | SharedArrayBuffer;\n            }\n          | {\n              valueOf(): string | Uint8Array | readonly number[];\n            }\n          | {\n              valueOf(): string;\n            }\n          | {\n              [Symbol.toPrimitive](hint: \"string\"): string;\n            },\n      ) =\u003e void,\n    ) =\u003e any);\n```\n\nDefault: `gzip`\n\nThe compression algorithm/function.\n\n\u003e [!NOTE]\n\u003e\n\u003e If you use custom function for the `algorithm` option, the default value of the `compressionOptions` option is `{}`.\n\n#### `string`\n\nThe algorithm is taken from [zlib](https://nodejs.org/api/zlib.html).\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      algorithm: \"gzip\",\n    }),\n  ],\n};\n```\n\n#### `function`\n\nAllow to specify a custom compression function.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      algorithm(input, compressionOptions, callback) {\n        return compressionFunction(input, compressionOptions, callback);\n      },\n    }),\n  ],\n};\n```\n\n### `compressionOptions`\n\nType:\n\n```ts\ntype compressionOptions = {\n  flush?: number;\n  finishFlush?: number;\n  chunkSize?: number;\n  windowBits?: number;\n  level?: number;\n  memLevel?: number;\n  strategy?: number;\n  dictionary?: Buffer | TypedArray | DataView | ArrayBuffer;\n  info?: boolean;\n  maxOutputLength?: number;\n};\n```\n\nDefault: `{ level: 9 }`\n\nCompression options for `algorithm`.\n\nYou can find all options here [zlib](https://nodejs.org/api/zlib.html#zlib_class_options).\n\n\u003e [!NOTE]\n\u003e\n\u003e If you use custom function for the `algorithm` option, the default value is `{}`.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      compressionOptions: { level: 1 },\n    }),\n  ],\n};\n```\n\n### `threshold`\n\nType:\n\n```ts\ntype threshold = number;\n```\n\nDefault: `0`\n\nOnly assets bigger than this size are processed. In bytes.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      threshold: 8192,\n    }),\n  ],\n};\n```\n\n### `minRatio`\n\nType:\n\n```ts\ntype minRatio = number;\n```\n\nDefault: `0.8`\n\nOnly assets that compress better than this ratio are processed (`minRatio = Compressed Size / Original Size`).\nExample: you have `image.png` file with 1024b size, compressed version of file has 768b size, so `minRatio` equal `0.75`.\nIn other words assets will be processed when the `Compressed Size / Original Size` value less `minRatio` value.\n\nYou can use `1` value to process assets that are smaller than the original.\n\nUse a value of `Infinity` to process all assets even if they are larger than the original size or their original size is `0` bytes (useful when you are pre-zipping all assets for AWS).\n\nUse a value of `Number.MAX_SAFE_INTEGER` to process all assets even if they are larger than the original size, excluding assets with their original size is `0` bytes.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      // Compress all assets, including files with `0` bytes size\n      // minRatio: Infinity\n\n      // Compress all assets, excluding files with `0` bytes size\n      // minRatio: Number.MAX_SAFE_INTEGER\n\n      minRatio: 0.8,\n    }),\n  ],\n};\n```\n\n### `filename`\n\nType:\n\n```ts\ntype filename = string | ((pathdata: PathData) =\u003e string);\n```\n\nDefault: `\"[path][base].gz\"`\n\nThe target asset filename.\n\n#### `string`\n\nFor example we have `assets/images/image.png?foo=bar#hash`:\n\n`[path]` is replaced with the directories to the original asset, included trailing `/` (`assets/images/`).\n\n`[file]` is replaced with the path of original asset (`assets/images/image.png`).\n\n`[base]` is replaced with the base (`[name]` + `[ext]`) of the original asset (`image.png`).\n\n`[name]` is replaced with the name of the original asset (`image`).\n\n`[ext]` is replaced with the extension of the original asset, included `.` (`.png`).\n\n`[query]` is replaced with the query of the original asset, included `?` (`?foo=bar`).\n\n`[fragment]` is replaced with the fragment (in the concept of URL it is called `hash`) of the original asset (`#hash`).\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      filename: \"[path][base].gz\",\n    }),\n  ],\n};\n```\n\n#### `function`\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      filename(pathData) {\n        // The `pathData` argument contains all placeholders - `path`/`name`/`ext`/etc\n        // Available properties described above, for the `String` notation\n        if (/\\.svg$/.test(pathData.filename)) {\n          return \"assets/svg/[path][base].gz\";\n        }\n\n        return \"assets/js/[path][base].gz\";\n      },\n    }),\n  ],\n};\n```\n\n### `deleteOriginalAssets`\n\nType:\n\n```ts\ntype deleteOriginalAssets =\n  | boolean\n  | \"keep-source-map\"\n  | ((name: string) =\u003e boolean);\n```\n\nDefault: `false`\n\nWhether to delete the original assets or not.\n\n**webpack.config.js**\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      deleteOriginalAssets: true,\n    }),\n  ],\n};\n```\n\nTo exclude sourcemaps from compression:\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      exclude: /.map$/,\n      deleteOriginalAssets: \"keep-source-map\",\n    }),\n  ],\n};\n```\n\nUsing a custom function:\n\n```js\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      exclude: /.map$/,\n      deleteOriginalAssets: (name) =\u003e {\n        if (/\\.js$/.test(name)) {\n          return false;\n        }\n\n        return true;\n      },\n    }),\n  ],\n};\n```\n\n## Examples\n\n### Using Zopfli\n\nPrepare compressed versions of assets using `zopfli` library.\n\n\u003e [!NOTE]\n\u003e\n\u003e `@gfx/zopfli` require minimum `8` version of `node`.\n\nTo begin, you'll need to install `@gfx/zopfli`:\n\n```console\n$ npm install @gfx/zopfli --save-dev\n```\n\n**webpack.config.js**\n\n```js\nconst zopfli = require(\"@gfx/zopfli\");\n\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      compressionOptions: {\n        numiterations: 15,\n      },\n      algorithm(input, compressionOptions, callback) {\n        return zopfli.gzip(input, compressionOptions, callback);\n      },\n    }),\n  ],\n};\n```\n\n### Using Brotli\n\n[Brotli](https://en.wikipedia.org/wiki/Brotli) is a compression algorithm originally developed by Google, and offers compression superior to gzip.\n\nNode 10.16.0 and later has [native support](https://nodejs.org/api/zlib.html#zlib_zlib_createbrotlicompress_options) for Brotli compression in its zlib module.\n\nWe can take advantage of this built-in support for Brotli in Node 10.16.0 and later by just passing in the appropriate `algorithm` to the CompressionPlugin:\n\n**webpack.config.js**\n\n```js\nconst zlib = require(\"zlib\");\n\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      filename: \"[path][base].br\",\n      algorithm: \"brotliCompress\",\n      test: /\\.(js|css|html|svg)$/,\n      compressionOptions: {\n        params: {\n          [zlib.constants.BROTLI_PARAM_QUALITY]: 11,\n        },\n      },\n      threshold: 10240,\n      minRatio: 0.8,\n      deleteOriginalAssets: false,\n    }),\n  ],\n};\n```\n\n[!NOTE] Brotli’s `BROTLI_PARAM_QUALITY` option is functionally equivalent to zlib’s `level` option.\nYou can find all Brotli’s options in [the relevant part of the zlib module documentation](https://nodejs.org/api/zlib.html#zlib_class_brotlioptions).\n\n### Multiple compressed versions of assets for different algorithm\n\n**webpack.config.js**\n\n```js\nconst zlib = require(\"zlib\");\n\nmodule.exports = {\n  plugins: [\n    new CompressionPlugin({\n      filename: \"[path][base].gz\",\n      algorithm: \"gzip\",\n      test: /\\.js$|\\.css$|\\.html$/,\n      threshold: 10240,\n      minRatio: 0.8,\n    }),\n    new CompressionPlugin({\n      filename: \"[path][base].br\",\n      algorithm: \"brotliCompress\",\n      test: /\\.(js|css|html|svg)$/,\n      compressionOptions: {\n        params: {\n          [zlib.constants.BROTLI_PARAM_QUALITY]: 11,\n        },\n      },\n      threshold: 10240,\n      minRatio: 0.8,\n    }),\n  ],\n};\n```\n\n## Contributing\n\nPlease take a moment to read our contributing guidelines if you haven't yet done so.\n\n[CONTRIBUTING](./.github/CONTRIBUTING.md)\n\n## License\n\n[MIT](./LICENSE)\n\n[npm]: https://img.shields.io/npm/v/compression-webpack-plugin.svg\n[npm-url]: https://npmjs.com/package/compression-webpack-plugin\n[node]: https://img.shields.io/node/v/compression-webpack-plugin.svg\n[node-url]: https://nodejs.org\n[tests]: https://github.com/webpack-contrib/compression-webpack-plugin/workflows/compression-webpack-plugin/badge.svg\n[tests-url]: https://github.com/webpack-contrib/compression-webpack-plugin/actions\n[cover]: https://codecov.io/gh/webpack-contrib/compression-webpack-plugin/branch/master/graph/badge.svg\n[cover-url]: https://codecov.io/gh/webpack-contrib/compression-webpack-plugin\n[discussion]: https://img.shields.io/github/discussions/webpack/webpack\n[discussion-url]: https://github.com/webpack/webpack/discussions\n[size]: https://packagephobia.now.sh/badge?p=compression-webpack-plugin\n[size-url]: https://packagephobia.now.sh/result?p=compression-webpack-plugin\n","funding_links":["https://opencollective.com/webpack"],"categories":["Plugins","JavaScript","Bundle Analyzer"],"sub_categories":["Rspack Plugins","Meetups"],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebpack-contrib%2Fcompression-webpack-plugin","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fwebpack-contrib%2Fcompression-webpack-plugin","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fwebpack-contrib%2Fcompression-webpack-plugin/lists"}