怎样优化网站-(网站搜索引擎优化网站)

性能优化是一个复杂的话题怎样优化网站，涉及到很多技巧。 如何通过优化网页性能来提升用户体验？ 今天就给大家介绍一些常用的方法。

1. 尽量减少要传输的数据量

首先，删除所有未使用的部分，例如 中无法访问的功能、带有选择器的样式永远不会匹配任何元素以及永远隐藏在 CSS 中的 HTML 标记。 其次，删除所有重复项。 然后，我建议设置一个自动缩小过程。 例如，它应该删除所有后端服务的注释（但不包括源代码）和所有不包含其他信息的字符（如 JS 中的空白字符）。 一旦完成，我们剩下的就是文本。 这意味着我们可以安全地应用压缩算法，例如 GZIP（大多数浏览器都能理解）。 最后，还有缓存。 这在浏览器首次呈现页面时不会有太大帮助，但会在后续访问时节省很多。 但关键是要记住两件事：

如果使用 CDN，请确保缓存受支持并在其中正确设置。

与其等待资源的到期日期，不如从您的角度来看，您可能想要一种更早更新资源的方法。 将文件的“指纹”嵌入到 URL 中，使本地缓存失效。

当然怎样优化网站，应该为每个资源定义一个缓存策略。 有些可能变化很小，或者根本没有变化。 其他国家的变化更快。 其中一些包含敏感信息，而另一些则可能被视为公共信息。 使用 "" 指令防止 CDN 缓存私有数据。 Web 图像也可以优化，尽管图像请求不会阻止解析或渲染。

2.减少关键资源总数

“关键”只是指网页需要正确呈现的资源。 因此，我们可以跳过所有不直接参与流程的样式，也可以跳过所有脚本。

样式表

为了告诉浏览器不需要特定的 CSS 文件，我们应该为所有引用样式表的链接设置 media 属性。 使用这种方法，浏览器将只在必要时处理与当前媒体（设备类型、屏幕尺寸）匹配的资源，同时降低所有其他样式表的优先级（它们将被处理，但不作为关键渲染路径的一部分）。 例如，如果您将 media="print" 属性添加到引用打印页面样式的样式标签，那么当媒体未打印时（即当页面在浏览器中显示时），这些样式将不会干扰关键呈现路径。

为了进一步改进流程，还可以内联一些样式。 这至少为我们节省了一次到服务器的往返行程，否则就需要获取样式表。

脚本

如上所述，脚本会阻塞解析器，因为它们可以改变 DOM 和 CSSOM。 所以不改变它们的脚本不应该是块解析，节省我们的时间。 为了使其工作，所有脚本标签都必须标有 async 或 defer 属性。

标记为异步的脚本不会阻止 DOM 构造或 CSSOM，因为它们可以在构造 CSSOM 之前执行。 但请记住，内联脚本无论如何都会阻止 CSSOM，除非您将它们放在 CSS 之上。 相反，标记为“延迟”的脚本将在页面加载结束时进行评估。 因此，它们不应影响文档（否则会触发重新渲染）。

换句话说，使用 defer，脚本在页面加载事件触发之前不会执行，而 async 允许脚本在解析文档时在后台运行。

3.缩短关键渲染路径长度

最后，CRP 长度应尽可能缩短。 在某种程度上，上述方法可以做到这一点。

媒体查询作为样式标签的属性将减少必须下载的资源总数。 标签属性 defer 和 async 会阻止对应的脚本阻塞解析。 使用 GZIP 缩小、压缩和归档资源将减少传输数据的大小（从而减少数据传输时间）。 内联某些样式和脚本可以减少浏览器和服务器之间的往返次数。

我们还没有讨论的是在文件之间重新排列代码的选项。 根据最新的最佳性能哲学，一个网站应该做的最快的第一件事就是显示 ATF 内容，ATF 代表 above the fold，即无需滚动即可立即看到的区域。 因此，最好重新安排与渲染相关的所有内容，以便首先加载所需的样式和脚本，然后停止其他所有内容 - 既不解析也不渲染，并且始终记住在进行更改之前和之后进行测量。

简而言之，网站性能优化包括网站响应的方方面面，比如缓存、设置CDN、重构、资源优化等等，但是这些都是可以一步一步来的。 作为 Web 开发人员，您应该将本文作为参考，并始终记住在实验前后测量性能。