svg 性能优化_SVG优化：基础

svg 性能优化

While the SVG format is extremely efficient in storing illustrations, vector files can become just as bloated as their bitmap kin. SVG code is often riddled with unnecessary elements, attributes, and spaces, while editors such as Adobe Illustrator and Inkscape add even more to the file with custom namespaced tags.

尽管SVG格式在存储插图方面非常有效，但矢量文件可能变得与它们的位图文件一样膨胀 。 SVG代码通常到处都是不必要的元素，属性和空格，而诸如Adobe Illustrator和Inkscape之类的编辑器甚至使用自定义命名空间标签向文件中添加了更多内容。

There are an increasing number of automated processes for optimizing SVG files, but those tools can sometimes go too far (or not far enough) in optimising the file, and in some cases – especially simple illustrations – it may be quicker to edit the file by hand. It’s also a best practice to approach the creation of a vector illustration in a tool like Illustrator or Inkscape with the goal of achieving optimization in SVG. Finally, it’s good to know just what’s going on and why in an SVG optimization tool, and where an automated process might go wrong.

越来越多的自动化过程用于优化SVG文件 ，但是有时这些工具在优化文件时可能会走得太远(或不够远)，在某些情况下(尤其是简单的插图)，通过以下方式编辑文件可能会更快手。 在Illustrator或Inkscape之类的工具中进行矢量插图的创建也是一种最佳实践， 目的是在SVG中实现优化 。 最后， 最好了解SVG优化工具中发生的事情以及原因 ，以及自动化过程可能会出错的地方。

Because of the many ways SVG files may be generated, I’ll use several articles to discuss the SVG optimization process:

由于可以通过多种方式生成SVG文件，因此我将使用几篇文章来讨论SVG优化过程：

• This article, which introduces the concepts and discusses hand-editing SVG code for optimization;
  本文介绍了这些概念，并讨论了手动编辑SVG代码以进行优化；

• Optimizing SVG files server-side

  在服务器端优化SVG文件

• The