diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml index b890a377..21da688e 100644 --- a/.github/workflows/main.yml +++ b/.github/workflows/main.yml @@ -2,7 +2,7 @@ name: CI env: FORCE_COLOR: 2 - NODE: 20 + NODE: 22 on: pull_request: @@ -31,9 +31,9 @@ jobs: fail-fast: false matrix: node-version: + - 24 - 22 - 20 - - 18 os: - ubuntu-latest - windows-latest diff --git a/README.md b/README.md index 7e6c85c3..e7659afd 100644 --- a/README.md +++ b/README.md @@ -1,6 +1,6 @@ # svgo-ll [![npm](https://img.shields.io/npm/v/svgo-ll)](https://npmjs.org/package/svgo-ll) -**svgo-ll** is a Node.js library and command-line application for optimizing SVG files, evolved from the [SVGO](https://www.npmjs.com/package/svgo) package. **svgo-ll** is focused on lossless optimization and compression. +**svgo-ll** is a Node.js library and command-line application for optimizing SVG files, evolved from the [SVGO](https://www.npmjs.com/package/svgo) package. **svgo-ll** is focused on lossless optimization and compression. See the [summary of differences between **svgo-ll** and SVGO](https://github.com/svg-utils/svgo-ll/blob/main/docs/diffs-from-svgo.md) for more details. ## Why? diff --git a/docs/01-index.mdx b/docs/01-index.mdx deleted file mode 100644 index cacacf83..00000000 --- a/docs/01-index.mdx +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: Introduction -slug: 'introduction' ---- - -SVGO (short for SVG Optimizer) is a Node.js library and command-line application for optimizing SVG files. - -SVG files, especially those exported from vector editors, usually contain a lot of redundant information. This includes editor metadata, comments, hidden elements, default or suboptimal values, and other stuff that can be safely removed or converted without affecting the rendering result. - -## Installation - -### System Requirements - -- [Node.js 16](https://nodejs.org/) or later - - - - -```sh -npm install -g svgo -``` - - - - -```sh -yarn global add svgo -``` - - - - -```sh -pnpm add -g svgo -``` - - - diff --git a/docs/04-plugins/index.mdx b/docs/04-plugins/index.mdx deleted file mode 100644 index d8a2fc1b..00000000 --- a/docs/04-plugins/index.mdx +++ /dev/null @@ -1,17 +0,0 @@ ---- -title: Plugins ---- - -All optimizations performed by SVGO are through the various plugins that are either built-in, or provided in your SVGO config. - -Built-in plugins are focused around either optimizations or compatibility. However, the plugin architecture is very flexible, so plugins can be made to do effectively anything. - -## Presets - -Presets are generalized SVGO plugin pipelines, though there is only one built-in to SVGO called [preset-default](/docs/preset-default/). - -The preset-default pipeline can be used by either: - -- Not defining a `plugins` property in the config. -- Omitting the config altogether. -- Specifying the `preset-default` plugin. diff --git a/docs/04-plugins/removeEmptyContainers.mdx b/docs/04-plugins/removeEmptyContainers.mdx deleted file mode 100644 index 6edd6bd0..00000000 --- a/docs/04-plugins/removeEmptyContainers.mdx +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: removeEmptyContainers -svgo: - pluginId: removeEmptyContainers - defaultPlugin: true ---- - -Remove container elements in the document that have no children or meaningful attributes, excluding the `` element which is ignored. - -A container, as defined in the [SVG specifications](https://www.w3.org/TR/SVG11/intro.html#TermContainerElement), is an SVG element that can have graphical child elements. Container elements include: - -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/a) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/defs) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/glyph) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/g) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/marker) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/mask) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/missing-glyph) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/pattern) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/svg) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/switch) -- [``](https://developer.mozilla.org/docs/Web/SVG/Element/symbol) diff --git a/docs/command-line-options.md b/docs/command-line-options.md index f1b7603c..52b0ab94 100644 --- a/docs/command-line-options.md +++ b/docs/command-line-options.md @@ -19,8 +19,11 @@ If `--folder` is specified, process files in all sub-folders recursively. `--exclude ` If `--folder` is specified, exclude files matching any of the specified regular expression patterns. + + ## Plugin and Compression Options + `--preset ` Specify which set of predefined plugins to use. If this option is not used, and no plugins are define by the `--config` option, [preset-default](./preset-default.md) is used. @@ -33,6 +36,7 @@ Specify one or more builtin plugins to run in addition to those specified by `-- ` --options ` Path to a [JSON file](https://www.json.org) containing configuration parameters for enabled plugins. The JSON file should contain an object whose keys are the names of plugins, and whose values are the parameters to pass to that plugin. This option cannot be used if the [`--config` option](#config) is specified. + `--disable ` Specify one or more plugins specified by `--preset` or `--config` which should not be run. @@ -40,6 +44,8 @@ Specify one or more plugins specified by `--preset` or `--config` which should n `--config ` Specifies a [custom configuration file](./custom-config-file.md). + + `--max-passes ` Maximum number of iterations over the plugins. Must be an integer between 1 and 10. Default is 10. diff --git a/docs/diffs-from-svgo.md b/docs/diffs-from-svgo.md new file mode 100644 index 00000000..f06f269d --- /dev/null +++ b/docs/diffs-from-svgo.md @@ -0,0 +1,60 @@ +# Differences Between **svgo-ll** and SVGO version 4 + +**svgo-ll** originated as a clone of an [SVGO](https://github.com/svg/svgo) version 4 release candidate. Since then, numerous changes have been made to prioritize lossless compression, fix bugs, and improve performance. Some of these changes are discussed below. + +## Rounding and Precision + +In SVGO, rounding of decimal values is enabled by default and integrated into many plugins in ways that are not possible to disable. In **svgo-ll**, default plugins do not do any rounding. Rounding is opt-in and handled by a [separate plugin](./plugins/round.md). + +## Plugins + +The following SVGO default plugins have been removed from **svgo-ll**: + +- **cleanupAttrs** +- **cleanupEnableBackground** +- **cleanupNumericValues** +- **convertColors** - similar functionality is in the new **[minifyColors](./plugins/minifyColors.md)** plugin +- **convertPathData** - most of the lossless functionality of this plugin has been preserved in the new **[minifyPathData](./plugins/minifyPathData.md)** plugin +- **convertTransform** - some of the benefits of this plugin are achieved with the new **[minifyTransforms](./plugins/minifyTransforms.md)** plugin +- **mergePaths** - some of the benefits of **mergePaths** are achieved with the new **[createGroups](./plugins/createGroups.md)** plugin +- **mergeStyles** +- **moveElemsAttrsToGroup** +- **moveGroupAttrsToElems** +- **removeDeprecatedAttrs** +- **removeEmptyAttrs** +- **removeEmptyText** - now handled by [removeEmptyContainers](./plugins/removeEmptyContainers.md) +- **sortAttrs** +- **sortDefsChildren** + +The following new default plugins have been added to **svgo-ll**: + +- **[cleanupStyleAttributes](./plugins/cleanupStyleAttributes.md)** +- **[cleanupTextElements](./plugins/cleanupTextElements.md)** +- **[cleanupXlink](./plugins/cleanupXlink.md)** +- **combineStyleElements** +- **[createGroups](./plugins/createGroups.md)** +- **[mergeGradients](./plugins/mergeGradients.md)** +- **[minifyColors](./plugins/minifyColors.md)** +- **[minifyGradients](./plugins/minifyGradients.md)** +- **[minifyPathData](./plugins/minifyPathData.md)** +- **[minifyTransforms](./plugins/minifyTransforms.md)** +- **moveElemsStylesToGroup** + +## CSS + +In SVGO, many plugins do not account for the impact of CSS. Many transformations are not safe when styles are used; when `