更快的加载时间:背景图像还是浏览器属性？

Question

我在我的网站上有一个凌乱的背景，为了让它更容易阅读，我使用了这个背景属性：

p : background-color {rgba(250, 250, 250, 0.7)}

考虑到站点加载时间的目标，使用不透明的背景图像会更好吗？

你可以在这里看到这个问题：http://tinyurl.com/7ywoqpf

注意，我已经在努力减少背景PNG的大小，这个问题只是关于段落背景

我应该保留当前设置还是使用背景图像？

Answer 1

好的，这是页面加载瀑布的样子-- http://www.webpagetest.org/result/120505_MG_47R9V/1/details/

您已经知道需要减少图像，但您还可以做一些其他的事情。

删除重复的ga.js使用jquery.min.js而不是jquery.js打开gzip

如果您正在寻找图像压缩器，jpegmini.com可以很好地处理jpeg，并且有大量的PNGs可供选择。

Answer 2

图像必须从服务器下载，然后加载到浏览器，在浏览器中使用rgba等CSS属性来创建效果，它仅依赖于浏览器。所以毫无疑问，rgba比图片更好。

Answer 3

图像，不管压缩得多好，总是要下载的。多亏了ping，这方面总会有一些开销。更重要的是，因为许多浏览器坚持永远不会为每个主机名同时发出两个请求( HTTP规范中定义的行为)，所以任何图像都将总是延迟加载其他资源。

我不知道RGBA的实现，但如果这意味着下载另一个资源会更快，我会感到非常惊讶。