如何减少HTTP请求

每次访问者在浏览器中加载网页时，也会加载额外的资源文件，例如CSS文件、JavaScript文件、设计图片等。每次请求这样的文件时，都会为浏览器处理创建一个额外的请求。我们称这些请求为HTTP请求。知道大多数流行的浏览器每个域名允许大约6个并行连接，您就会明白当网站有六个或更多资源文件要加载时，它已经可以稍微减慢网站速度。这是因为浏览器必须等待未处理的文件加载，直到它完成加载之前的文件，从而创建加载延迟。

检查您的网页发出多少HTTP请求

您可以使用HTTP请求检查器或页面速度测试来检查您的网页发出多少请求。您还可以看到网页发出什么类型的请求（图像、CSS文件等）：

当网页发出太多HTTP请求时，您应该通过尽可能替换和移除资源文件来最小化页面加载的资源文件数量。在下面学习如何做到这一点：

合并和内联CSS脚本

大多数网站模板需要加载多个CSS文件（通常在页头和页脚）来支持模板。您应该将这些文件合并为一个大文件，以最小化HTTP请求的数量。这就像打开所有文件并将它们的内容复制粘贴到一个文件中一样简单。确保CSS脚本中的文件路径是正确的。一个更好的选项是根本不使用CSS文件，而是在HTML头部内联CSS脚本用于首屏内容，并延迟加载CSS的其余部分，在此处阅读更多相关信息。

内联小型JavaScript文件

当涉及到页面速度时，处理小型JavaScript文件的最佳方法是内联它们。请注意，这通常只建议对较小的JavaScript这样做，而不是对较大的文件。

合并所有JavaScript

当您不能内联JavaScript并且您的网站需要加载多个JavaScript文件时，您应该尝试将所有JavaScript文件复制粘贴到一个大的.js文件中，并从HTML头部调用这个更大的JavaScript文件。为了减少HTTP请求，最小化与页面一起加载的JavaScript文件数量通常是一个聪明的想法。网页加载的JavaScript越多，由于上述解释的原因，它通常变得越慢。只加载网页真正需要的那些脚本。

最小化设计和功能图片的使用

您应该致力于最小化用于设计或功能原因的图片数量，并且只加载您真正不能缺少的图片。许多旧的或编码不良的设计使用图片作为背景、按钮、边框、悬停效果或其他设计目的，而不是使用CSS。相同的视觉效果通常可以通过使用小的CSS脚本来实现，这将减少HTTP请求的数量。一个用于创建各种视觉CSS效果的好免费在线工具是CSS 3.0 Maker。

CSS图片精灵

当您真的不能避免使用图片进行设计时，您可以通过使用CSS精灵将所有这些单独的图片合并并保存为一个更大的文件。然后，您可以通过使用X和Y坐标从CSS脚本中调用单独的图片。这样，浏览器只需要为多个图片发出一个HTTP请求。您可以使用CSS Sprites Generator工具来创建这些CSS精灵。阅读有关如何在您的网站上使用精灵的文档。

将图片转换为Base64代码

您可以将功能图片（如徽标）编码为Base64字符串，这基本上意味着您将图片文件转换为脚本代码。一旦您有了代码，就可以用此代码替换原始图片标签来显示您的图片。这样，您的网页发出的HTTP请求更少。您可以为此使用Base64文件编码器工具。只需选择您选择的图片，您的Base64图片代码将自动生成。

最小化插件数量

插件对网站来说可能是一个很大的资产，但通常需要在网页上加载几个web文件才能运行。这就是为什么只在您认为绝对必要时才使用插件很重要。

限制社交按钮数量

社交按钮（Twitter、Facebook等）是用户与他人分享您网站的好方法。但社交按钮也可能减慢网站速度。按钮图片、JavaScript和CSS文件添加多个HTTP请求。当您不需要它们时，完全移除按钮。如果您确实需要它们，通过使用Base64文件编码器将图片替换为Base64代码。始终尝试将按钮数量限制为最重要的那些。

内容分发网络

内容分发网络（CDN）使从不同（子）域名提供web文件成为可能。这减少了您的服务器必须处理的HTTP请求数量。CDN服务通常还在世界各地不同位置提供服务器网络。这使得能够以尽可能最小的响应时间（首字节时间）向您的访问者交付文件。