我正在尝试确定包含我编写的脚本所需的图像的最佳方式。
我发现这个网站 http://www.jimbojw.com/wiki/index.php?title=Data_URIs_and_Inline_Images这让我考虑尝试这种方法将图像作为data URI https://developer.mozilla.org/en/data_URIs（被定义为RFC 2397 https://www.rfc-editor.org/rfc/rfc2397）因为它太小了 - 它是一个 1x1 像素 50% 不透明度的 png 文件（用于背景） - 它最终作为图像为 2,792 字节，而作为 CSS 中的文本为 3,746 字节。
那么这会被认为是好的做法，还是只会让 CSS 变得不必要的混乱？
使用数据 URI 而不是图像是有充分理由的。
数据 URI 采用 Base 64 编码，这意味着它比图像大大约 25%。不过，您的 CSS 文件可以被缓存，因此较小的大小增加可能不是一个大问题。
如果您有很多图像，则查找每个图像都会产生开销，无论是在名称解析还是将图像作为另一种资源获取方面。
所有这些意味着，如果图像很小，并且整个 CSS 文件仍然很小，并且 CSS 在经常点击的页面之间共享，那么如果切换到数据 URI，您将获得性能提升。
缺点是它们仅适用于 FX、Chrome 等。部分适用于 IE8，但仅适用于小图像。它们根本无法在 IE7 或更低版本中运行。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
