成为VIP
性能优化是一个复杂的话题，涉及的技能很多，如何通过优化网页性能提高用户体验？今天给大家介绍一些常见的方法。
1. 尽可能减少要传输的数据量
首先，删除所有未使用的部分，例如JavaScript中不可访问的函数、带有永远不匹配任何元素的选择器的样式，以及永远隐藏在CSS中的HTML标记。其次，删除所有重复项。然后，我建议设置一个自动缩小过程。例如，它应该删除后端服务的所有注释（但不是源代码）以及不包含其他信息的每个字符（例如JS中的空白字符）。完成后，我们剩下的可以是文本。这意味着我们可以安全地应用压缩算法，比如GZIP（大多数浏览器都能理解）。最后，还有缓存。当浏览器第一次呈现页面时，这不会有什么帮助，但会在以后的访问中节省很多。但关键是要记住两件事：
如果使用CDN，请确保支持缓存并在其中正确设置。
与其等待资源的过期日期，您可能希望有一种方法可以从您的角度更早地更新它。将文件的“指纹”嵌入到URL中，使本地缓存失效。
当然，应该为每个资源定义缓存策略。有些可能很少改变，或者根本不会改变。其他国家的变化更快。其中一些包含敏感信息，另一些可能被视为公开信息。使用“private”指令防止CDN缓存私有数据。也可以优化web图像，尽管图像请求不会阻止解析或呈现。
2. 减少关键资源的总数
“关键”仅指网页正确呈现所需的资源。因此，我们可以跳过流程中未直接涉及的所有样式，还有所有的脚本。
样式表
为了告诉浏览器不需要特定的CSS文件，我们应该为引用样式表的所有链接设置媒体属性。使用这种方法，浏览器将只视需要处理与当前媒体（设备类型、屏幕大小）匹配的资源，同时降低所有其他样式表的优先级（它们将被处理，但不会作为关键渲染路径的一部分）。例如，如果向引用打印页面样式的样式标记添加media=“print”属性，则当介质未打印时（即在浏览器中显示页面时），这些样式不会干扰关键呈现路径。
为了进一步改进该过程，还可以将一些样式内联。这为我们节省了至少一次到服务器的往返，否则获取样式表就需要这样做。
