SVG 优化与 Data URI 工作流

内联 SVG 图标与小 UI 资产常带有空白、编辑器元数据或风险标记。你可以在浏览器里按文本优化 SVG，并复制 Data URI 片段，无需上传文件。

何时优化 SVG

适合在以下场景优化：

• 提交前缩小 sprite 或图标文件
• 为 CSS background-image 生成 data:image/svg+xml URI
• 清理文档或组件示例中的 SVG 片段

若仍需人工可读格式继续编辑，优先使用 Safe 模式。

本地工作流

1. 从设计导出、组件或 sprite 表复制 SVG。
2. 打开 SVG 优化器。
3. 粘贴标记或上传 .svg 文件。
4. 查看安全预检中的 <script>、事件属性或外部 URL。
5. 默认运行 Safe 优化。
6. 复制优化后的 SVG、URL-encoded Data URI 或 CSS background-image 片段。

Safe 与 Aggressive

• Safe：尽可能保留 viewBox、title、desc、role、aria-*。
• Aggressive：更强压缩，可能移除可访问性相关元数据。

安全说明

把粘贴的 SVG 当作代码而非纯文本。本工具不在页面中渲染 SVG，但上线前仍应审查高风险模式。

相关工具

• Base64 — 处理其他编码载荷。
• CSS 单位转换器 — 配合 Data URI 背景做布局计算。
• 图片压缩 — 位图压缩场景。