内联 SVG 与 SVG 文件性能 [英] Inline SVG vs SVG File Performance

问题描述

我目前正在构建一个面向现代浏览器和移动设备的网站.在性能方面，使用 直接在 HTML 内内联 SVG 更好还是使用 和/或背景图像更好反而.我在服务器上运行 gzip 以进一步压缩我的内容，并且不想依赖 Javascript.

I'm currently building a website aimed at modern browsers and mobile devices. In terms of performance, is it better to inline SVG's directly inside the HTML using <svg> or is it better to use <img> and/or background-image instead. I run gzip on the server to further compress my content and prefer not to rely on Javascript.

推荐答案

内联的优点:

• 更少的http请求；
• 您可以使用 css 填充属性并更改颜色；
• Svg 是内容的一部分，所以它是可点击的，你可以插入文本；

单独文件的优点:

• 可以缓存SVG文件；
• 您没有在文件中看到多行不相关的代码；
• 如果您以后需要更改它，那么您只需更改一个文件；

这篇关于内联 SVG 与 SVG 文件性能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！