欢迎回到我们关于构建更快网页的系列文章。本系列的第1部分和第2部分介绍了如何通过优化和替换图像来减少浏览器容量。这部分着眼于在CSS（层叠样式表）和字体中减少更多的脂肪。调整CSS首先，让我们看看问题的根源。CSS的出现是技术的重大进步。您可以使用一个集中式样式表装饰多个网页。如今，许多Web开发人员都使用Bootstrap等框架。这些框架当然方便，但是很多人会直接复制粘贴整个框架。Bootstrap相当大：Bootstrap4.0当前的“最低”版本是144.9KB。在这个TB级数据的时代，这可能并不多。但是就像说的那样，小牛可以引起大麻烦。让我们回到getfedora.org示例。正如我们在第1部分中提到的，第一个分析表明CSS文件占用的空间几乎是HTML本身的十倍。所有使用的样式表都显示在这里：那是九个不同的样式表。此页面中未使用其中许多样式。删除、合并和缩小/缩小Font-awesomeCSS代表了包含未使用样式的极端。此页面中仅使用了该字体的三个字形。在KB中，getfedora.org使用的font-awesomeCSS最初是25.2KB。清理掉所有未使用的样式后，它只有1.3KB。这只是其原始体积的4%左右！对于BootstrapCSS，原来是118.3KB，清理掉未使用的样式后只有13.2KB，这就是区别。接下来的问题是，我们一定要有这样的bootstrap.css和font-awesome.css吗？或者，它们可以合并吗？是的他们可以。这不会节省更多的文件空间，但浏览器需要更少的请求才能成功呈现页面。最后，合并CSS文件后，尝试剥离死样式并缩小它们。这样，它们的大小只有4.3KB，而您节省了10.1KB。不幸的是，Fedora存储库中没有打包压缩工具。但是，有数百种在线服务可以为您提供帮助。或者，您可以使用CSS-HTML-JSMinify，它是用Python编写的，因此安装起来很容易。没有一种工具可用于清理CSS，但我们有UnCSS等网络服务。字体改进CSS3带来了很多开发人员喜欢的东西。它可以定义一些用于呈现页面的字体，并让浏览器在后台下载它们。从那时起，许多网页设计师都很高兴，尤其是在他们发现图标字体在网页设计中的使用之后。如今，像FontAwesome这样的字体集非常流行并被广泛使用。以下是此字体集的大小：当前免费版本912个字形/图标，smallestsetttf30.9KB，woff14.7KB，woff212.2KB，svg107.2KB，eot31.2所以问题是，你需要所有的字形吗？很可能不会。您可以使用FontForge删除这些无用的字形，但这需要大量工作。您也可以使用Fontello。您可以使用公共示例或配置您自己的版本，因为它是免费软件并且可以在Github上获得。这种自定义字体集的缺点是您必须自己托管字体文件。您也不能使用其他在线服务来提供更新。但与更快的性能相比，这可能不是缺点。总结现在您已经完成了内容本身的所有工作，以最大限度地减少浏览器必须加载和解释的内容。从现在开始，只有服务器管理技能才能帮助您。许多人做错的一件简单的事情是使用一些智能缓存。例如，CSS或图像文件可以缓存一周。无论如何，如果您使用像Cloudflare这样的代理服务或构建自己的代理服务，您应该做的第一件事就是缩小页面。用户喜欢加载速度快的页面。他们会（默默地）感谢您，并且服务器上的负载会减少。
