传输和资源CSS文件大小

我开了两个网站

在苹果网站上，landingpage.css的传输大小为34.6KB，资源大小为411KB。 在联想网站上，core.css的传输大小为44.2KB，资源大小为289KB

联想的站点资源大小比苹果小122KB，但转移的大小比苹果大10KB左右

我在自己的网站和相同的环境中尝试了两个css，我注意到了相同的问题，我有： Css1大小：400KB，传输89KB Css2大小：780KB，已传输70KB 我对这两个文件都使用了brotli压缩

为什么会这样？

• 资源压缩

Web服务器使用gzip减少传输到客户端的数据总量。当支持gzip的浏览器发送请求时，它会将“gzip”添加到其接受编码头中。当Web服务器接收到请求时，它会正常生成响应，然后检查Accept Encoding标头以确定如何对响应进行编码。如果服务器支持gzip，它将使用gzip压缩每个资源

然后，它交付每个资源的压缩副本，并添加内容编码头，指定使用gzip对资源进行编码。然后，浏览器将内容解压缩为其原始未压缩版本，然后再将其呈现给用户

• 编码后的大小差异

传输大小的差异导致了这样一个事实，即一个资源可能由于其内容的性质而更可压缩，如果它更可压缩，这意味着它通常包含更多重复的字符，当考虑无损压缩时，就像我们的情况一样。这就是编码的工作原理

• 更多资源