removeViewBox: preserve viewBox for responsive scaling or reduce file size?

Answer first

Keep SVGs responsive by not removing viewBox when the SVG is used without fixed width and height. The safest configuration is to disable removeViewBox or set preserveViewBox to true for icons and inline graphics that must scale. Use preserveViewBox: auto only after you verify its heuristic on your exact SVGO version and SVG set.

Confirmed facts

• removeViewBox removes the root viewBox attribute to reduce size. Removal breaks intrinsic responsive scaling unless the root has explicit width and height.
• removeViewBox operates on the viewBox attribute only. cleanupIDs operates on id attributes and their references. Ordering does not change the viewBox preservation logic of removeViewBox.
• Plugin order can change overall output size, but viewBox preservation is determined by removeViewBox params, not by cleanupIDs ordering.

Likely but version-sensitive

• Recent SVGO releases expose a preserveViewBox option for removeViewBox with values false, true and auto. The exact default value and the auto heuristic are version-sensitive and not reliably confirmed from model knowledge alone.
• auto is intended as a heuristic to retain viewBox when width or height are missing or when removal would make the SVG non-responsive. It is not a strict guarantee and behavior varies by release.

Your three questions

1. Current default value of preserveViewBox in the latest stable SVGO release

Cannot be stated with certainty without checking your installed version. Defaults changed across SVGO 2 → 3 → 4 and differ between releases. Verify locally:

svgo --version
# inspect defaults
cat node_modules/svgo/lib/plugins/removeViewBox.js

Look for the plugin params definition and the default for preserveViewBox.

2. Does preserveViewBox: auto guarantee retention when width or height are omitted?

No. auto is a heuristic, not a guarantee. It may retain viewBox when width/height are absent, but the exact condition is implementation-defined per release and can change. Removing viewBox from an SVG without explicit width and height can cause rendering to collapse or scale incorrectly in browsers.

3. Ordering of removeViewBox relative to cleanupIDs

Ordering does not affect whether viewBox is preserved. removeViewBox decides viewBox presence based on its own params. cleanupIDs removes unused IDs and updates references. It does not read viewBox and viewBox does not reference IDs. The only interaction is that cleanupIDs can remove IDs that other elements reference independently of viewBox.

Minimal steps for this case

1. Confirm SVGO major version and the default params for removeViewBox in your project.
2. Audit a representative sample for production usage: do SVGs ship with width/height omitted and rely on viewBox for scaling?
3. Test the three settings on the sample set and compare viewBox presence in output:
   • preserveViewBox: false
   • preserveViewBox: true
   • preserveViewBox: auto
4. For responsive icons/inline use, set removeViewBox to false or preserveViewBox: true. For fixed-size assets with explicit width and height, removal is safe.

One missing diagnostic that changes the recommendation: what SVGO major version is installed in your build and whether your production SVGs are used inline without width/height. With that, the default can be confirmed and auto can be validated safely.