CSS精灵vs数据URI

前端之家收集整理的这篇文章主要介绍了CSS精灵vs数据URI前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我听到很多关于使用精灵的重要性,以便让您的请求倒数。但我的想法是,而不是使用精灵,您可以使用URI来完成相同的事情,并且更容易(不需要精灵创建)。

使用精灵或尿液好吗?

解决方法

Base64编码的数据大约比原始字节大1/3,因此在下载所有图像数据所需的时间超过要求的三倍以上的页面中,CSS精灵的性能优于其性能

此外,内联数据URI使文件本身需要与实际数据加上base64编码的图像一样长的时间。如果数据URI位于实际的HTML页面上,那意味着渲染停止并等待图像加载。如果数据URI在您的样式表中,那意味着在数据URI必须等待它们才能被处理之前的任何规则。另一方面,使用精灵文件,图像可以与您的其他资源并发加载。这可能值得一个额外的请求的费用,特别是当你考虑到base64的惩罚。

原文链接:https://www.f2er.com/css/218625.html

猜你在找的CSS相关文章