带有http请求的大样式表或较小版本

Question

我最近做了更改，在我的css中包含base64数据uri字符串，而不是对外部图像文件的图像请求。

这导致的问题是样式表的大小从没有7KB的数据uri增加到200KB +。但是我的http请求明显少了。

这没关系 - 大样式表的方法比具有多个图像请求的方法更好吗？

Answer 1

将样式表的大小与您基础图像的总大小进行比较。如果它相同或更小，使用base64 URI会占用更少的空间（和下载时间）。通常，如果检索的数据相同且所述请求不是并发的，则一个大请求优于多个较小请求。

Answer 2

200Kb对于样式表来说非常大。如果你还没有压缩，请确保你正在压缩它。如果大多数页面上没有使用某些/大多数数据字符串图像，那么最好将它们拆分为单独的样式表，并将其仅包含在需要的页面上。

Answer 3

如何将一个样式表保存在文档的顶部（在头部），其中包含除base64数据之外的所有内容。这将加载很快，并让文档的主体开始加载/显示这些初始样式。

然后，在文档底部（关闭/正文标记之前）创建第二个样式表，其中包含图像作为base64数据。这样，当这开始加载时，至少内容是可见的，并且大部分按您希望的方式构建。

双赢??

祝你好运！

Answer 4

请求越少越好。 但是，托管限制了特定下载流的连接速度。因此，如果您的200KB文件可以在2秒内下载，可能 2个100KB的文件可以在1秒内下载。 剩下的就在你身上。

<强> ADDED ： 使用压缩无法减小任何尺寸。您的图像数据无法压缩。