跳到主内容
UniKit

SVG 优化

SVG 矢量图在线压缩优化减小体积:自研子集优化(去注释、去冗余属性、折叠空白、数值化简、去空组),实时对比优化前后体积。

浏览器本地运行所有计算都在你的浏览器里完成,数据不会离开本机。

粘贴 SVG

只做文本级安全优化,不合并 path、不改写坐标系。

优化选项

优化结果

粘贴 SVG 后点击「开始优化」。

这个工具能做什么

  • 从 Figma / Illustrator 导出的 SVG 里塞满了注释、缩进和冗余属性,压一遍能省下 20%–60% 的体积,页面首屏少传几十 KB。
  • 把 SVG 直接内联进 HTML 之前做一次瘦身,尤其是图标雪碧图这种要重复几十次的文件。
  • 检查第三方 SVG 里有没有 <metadata> 或注释泄露作者信息,顺手清掉再上线。
  • 把「数值化简」关掉对比一下,确认优化没有影响渲染效果,再决定要不要保留这一步。

示例

输入

<svg version="1.1" width="100.00">
  <!-- icon -->
  <g></g>
  <path d="M0.5000 1.0L10.00,20.00Z"/>
</svg>

输出

<svg width="100"><path d="M.5 1L10 20Z"/></svg>

注释、空 <g>、version="1.1"、多余空白被去掉,数值 0.5000 化简为 .5、1.0 化简为 1。

常见问题

优化会不会改变渲染效果?

默认的七项都只做「渲染等价」的替换:删掉注释/XML 声明/DOCTYPE/空分组、折叠标签之间的空白、去掉 version 这类可推导的属性、把 0.5000 写成 .5。只有「去掉默认 fill / stroke」是启发式的(fill 默认 black、stroke 默认 none),所以它默认关闭,需要你自己确认后再打开。

会合并 path 或者改写坐标系吗?

不会。合并 path、转成相对命令、重算坐标需要完整解析路径语义,一旦出错图形就变了,风险远大于收益。这里只做文本级的安全替换,任何一步都能人工核对。

为什么我的文件几乎没变小?

说明这个 SVG 本来就已经是压缩过的(很多工具默认导出紧凑格式)。可以看「改动统计」:如果每项都是 0,那就是没有可优化的内容;想进一步减小体积只能精简图形本身,或者改用 gzip / brotli 传输。

标签之间的空白删掉会不会影响文字?

不会。工具只折叠「> 和 < 之间」的空白,也就是标签之间的缩进换行;<text> 里的内容不受影响。不过如果你的 SVG 依赖 xml:space="preserve" 的空格排版,建议把「折叠空白」关掉。

文件会上传吗?

不会。优化完全在浏览器里跑,没有任何网络请求,粘贴的内容只存在于当前页面内存中。

关键词:svg 优化svg 压缩svg optimizerminify svg去除注释路径数值简化矢量图瘦身svg 体积去冗余属性svg 美化

同类工具