最小化SVG文件大小 [英] Minimizing SVG file size
问题描述
我将在Adobe Illustrator中创建的地图图像另存为.svg文档.有什么技巧和窍门，以使文件的大小尽可能小?
I am saving map images created in Adobe Illustrator as .svg documents. What are some tips and tricks for making the file size as small as possible?
推荐答案
-
关闭保留Illustrator编辑功能"，该功能在文件中包含巨大专有伪二进制Blob.
Turn off "Preserve Illustrator Editing Capabilities", which includes an enormous proprietary pseudo-binary blob in your file.
当您要查看工作的用户代理支持此内容时(通过显式或通过Web服务器设置)将内容压缩.
SVG是XML，因此是文本，因此也是可压缩的.
GZIP your content (either explicitly, or via your web server settings) when the user agents you intend to view your work support this.
SVG is XML, and hence text, and hence quite compressible.
降低不必要的数值精度. (从Illustrator保存时，可以使用小数位数"设置来执行此操作，也可以对文件进行后期处理以降低精度.)
例如，以下两个路径在视觉上是无法区分的:
Reduce unnecessary numeric precision. (You can do this either with the "Decimal Places" setting when saving from Illustrator, or by post-processing your file to reduce precision.)
For example, the following two paths are visually indistinguishable:
<path d="M102.6923828,391.6152344
c56.8027344,115.9394531-3.8457031-246.1542969,105.3847656-217.6923828
s218.4609375-53.0766602,243.8457031,40.7695313
S541.9228516,411.6152344,435,527s-166.1538086,58.4609375-213.8461914-50
C173.4614258,368.5385742,46.5385742,277,102.6923828,391.6152344z"
<path d="M102.7,391.6c56.8,115.9-3.8-246.2,105.4-217.7s218.5-53.1,243.8,40.8
s90,196.9-16.9,312.3s-166.2,58.5-213.8-50C173.5,368.5,46.5,277,102.7,391.6z"
将重复的基于属性的样式分解为常见的CSS或基于实体的样式.
例如，您可以替换
Factor out repeated attribute-based styles into common CSS- or entity-based styles.
For example, you might replace
<rect fill="red" stroke="black" stroke-width="10px" ... />
<circle fill="red" stroke="black" stroke-width="10px" ... />
with
.bold { fill:red; stroke:black; stroke-width:10px }
<!-- ... -->
<rect class="bold" ... />
<circle class="bold" ... />
找出重复转换成分组项目的因素.
例如，替换
Factor out repeated transformations into grouped items.
For example, replace
<rect transform="translate(102,-64) rotate(10.23)" ... />
<circle transform="translate(102,-64) rotate(10.23)" ... />
with
<g transform="translate(102,-64) rotate(10.23)">
<rect ... />
<circle ... />
</g>
这篇关于最小化SVG文件大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
