kamsar/Dianoga

Switch from SVGOP Back to SVGO

Closed this issue · 4 comments

Version of Dianoga

5.4.1

Environment description:

Sitecore 9

What configs you have enabled

Standard. Only Dianoga.Svg.config is enabled

Reproducible steps (1... 2... 3...) that cause the issue

  1. Try to pass --disable=removeViewBox argument to AdditionalToolArguments
			<dianogaOptimizeSvg>
				<!-- Optimize the SVG with SVGO https://github.com/svg/svgo -->
				<processor type="Dianoga.Optimizers.Pipelines.DianogaSvg.SvgoOptimizer, Dianoga">
					<ExePath>/App_Data/Dianoga Tools/SVGO/svgop.exe</ExePath>
					<AdditionalToolArguments>--disable=removeViewBox</AdditionalToolArguments>
				</processor>
			</dianogaOptimizeSvg>

This is configured based on examples in SvgOptimizerTests.cs.

What you expected to see, versus what you actually saw

Expected result:
viewBox property inside SVG file should not be touched.

Actual result:
viewBox property is removed.
If we look on https://github.com/twardoch/svgop/blob/master/src/app/svgop-pkg.js we understand why it doesn't work. Configs are baked in to .exe.

Relevant logs

No logs.

Test should fail

There is a test

		[Fact]
		public void ShouldSquishSmallSvgWithArgs()
		{
			Test(@"TestImages\small.svg",
				@"..\..\..\..\Dianoga\Dianoga Tools\SVGO\svgop.exe",
				"--disable=removeViewBox", out var args, out var startingSize);
			args.Stream.Length.Should().BeLessThan(startingSize).And.BeGreaterThan(0);
			args.IsOptimized.Should().BeTrue();
		}

that run svgop.exe with --disable=removeViewBox args. But if we check new StreamReader(args.Stream).ReadToEnd() we will see that viewBox was removed from test image.

My thoughts

  1. SVGOP is not supported. The latest release was on Apr 13, 2020. Latest release of SVGO was on Nov 02, 2021.
  2. SVGOP has no flexibility to pass parameters twardoch/svgop#7

I think that we need to revert back to SVGO from SVGOP.

SVGO 2 has to be installed via NPM , it's not feasible to embed it into a nuget package anymore.
The only way I can think of doing it is to include installation instructions and tips for running it on a build server for package and deployment.

Ok, I got you.

How about packaging svgo to executable. Nowadays, it is very easy to do using https://github.com/vercel/pkg ?

Nowadays it is very easy:
https://github.com/Antonytm/svgo-executable
You can review GitHub actions.

Basically, there are just 2 lines of code:

npm install //package.json contains 2 package: pkg and svgo
npx pkg node_modules/svgo //build svgo > exe

I have created PR that is using svgo-win.exe that I got using the approach described above.
#105

Great find thanks mate, released in 6.0.0-beta.2