Evgeny Bobkin ibqn

How to optimize SVG

Editors like Illustrator can save out some really dumb SVG code sometimes. Properly optimized SVG files can be as much as 80% smaller. Bunches of empty groups, pointless attributes and many other inefficiencies decrease readability and reliability.

Every SVG file should be manually optimized in 3 passes using:

Your vector graphic editor.
The SVGO command-line optimization tool.
Your text editor.

scph5500.bin 26-Aug-2018 20:47 512.0K

scph5501.bin 26-Aug-2018 20:47 512.0K

scph5502.bin 26-Aug-2018 20:47 512.0K

	/* FOR THE BROWSER
	Utility function to read a ND-JSON HTTP stream.
	`processLine` is a function taking a JSON object. It will be called with each element of the stream.
	`response` is the result of a `fetch` request.
	See usage example in the next file.
	*/

	const readStream = processLine => response => {
	const stream = response.body.getReader();
	const matcher = /\r?\n/;

	<div id="container" data-stuff="my variable">
	<!-- This element's contents will be replaced with your component. -->
	</div>
	<script>
	window.test = "my react test";
	window.dumbname = "martin"
	// notice that `stuff` is not passed directly, it is passed using `data-stuff="my variable"` through `container.dataset`
	</script>