优化 SVG 在 Data URLs 中的大小

Data URLs，即前缀为 data: 协议的 URL，其允许内容创建者向文档中嵌入小文件。

data:[<mediatype>][;base64],<data>

以下步骤可尽可能缩短 SVG 文件的 Data URLs 。

使用 Scour 优化 SVG 的源码。这里我使用 Inkscape 另存为 优化的 SVG。

使用 mini-svg-data-uri 工具生成 Data URLs 。这里我使用 RunKit 进行在线生成。

var miniSvgDataUri = require("mini-svg-data-uri")
var svg = `
[ SVG 源码 ]
`
var optimizedSVGDataURI = miniSvgDataUri(svg);

压缩某 SVG ，使用此方法得到的最终长度为 1421 字符。同一 SVG ，不进行 Scour 优化但经过 mini-svg-data-uri 生成得到的长度为 2924 字符。同一 SVG ，直接转换 Base64 得到的长度为 3855 字符。