我有一组约10个单调图标25x25或更少。哪个有更好的表现：
1）将它们嵌入带有数据URI的CSS
2）将它们加载为字体（IcoMoon等）
加载为字体似乎可能不太有用，因为它会进行http：调用，除非我... 2b）自己嵌入字体文件。
我这个项目上个月一直在使用IcoMoon，但如果我需要对SVG进行更改并重新上传到应用程序，这有点单调乏味。处理字体与图像时，CSS也相当混乱。似乎我可以用base64编码SVG来节省头痛并完成它。
那你觉得最好的方式是什么？或者替代那些？我正在优化Webkit，Mozilla和IE8 +。
答案 0 :(得分：4)
取决于。
似乎数据URI在移动设备上较慢，但是嵌入时，小于1KB的图标可以具有更好的性能。它还取决于每页使用图像的频率 - 数据URI显然必须在每次使用时解压缩，因此如果您多次使用它们可能会影响性能。
不幸的是，似乎没有人比较数据URI和@ font-face图标字体的移动性能。理想情况下，做一些真实的RUM测试并发布您的发现^ _ ^如果您这样做，请同时检查在CSS中嵌入图标字体作为Base64编码的数据URI：D
最后，有一些Grunt plugins可以为您自动化工作流程，并且使用[data-icon]样式嵌入图标字体可以减少CSS混乱（IE8 +中支持attr（））。< / p>
PS对不起，我也想要这个信息......