我在周末连续两天告诉您有关面向对象程序设计的主要特征“封装”和“继承”。如果您希望今天继续谈论“多态性”的功能，您可能会感到失望。今天没有“多态性”但要教您如何优化网页的加载速度，我只是打乱了牌，哈哈。

我周末呆在家里，并且浏览了许多网页。我发现许多网站并未优化其加载速度。有时加载网页需要10秒钟。尽管该网页的内容非常好，但它给了我第一印象。它的运行速度慢，难以忍受！

实际上，有许多简单，粗鲁和有效的优化方法。我认为有必要与所有产品经理分享，以便您可以监督兄弟优化的发展并改善网页的加载体验〜

首先，让我们看一下网页的加载过程。打开网页时，它将首先拉一个html页面，然后在浏览器解析html页面之后，它将根据页面的内容拉javascript，css和图像文件，最后根据这些文件呈现页面。

我们可以看到，影响网页显示速度的主要因素不是网页本身，而是取决于它的一些其他文件。如果优化了这些资源的加载速度，那么网页显示的速度也会提高。

一些简单粗鲁的方法是什么？让我一一列出：

1.优化图像资源的格式和大小

在网页中网站优化，图像资源的大小最大，并且单个文件的大小也相当大。因此，在图像质量保持不变的情况下，请尽可能使用压缩率高的图像格式。可以根据此优先级选择图像格式webp> jpeg> png> bmp。同时，根据图像显示的大小拉出最匹配大小的图像资源。不要只是下拉原始图像并使用它。我以前遇到过这种情况。在196 * 196区域中显示的图片文件大小为几兆字节。最终，我发现原始的1960 * 1960分辨率图像被拉下。

2.启用网络压缩

大多数浏览器在发出请求时都会带这个标签“ Accept-Encoding：gzip，deflate”，表示该浏览器可以接受gzip压缩来传输数据。如果您的Web服务器还支持gzip压缩，则当以gzip模式传输数据时，流量将减少70-80％。

3.使用浏览器缓存

同一站点下的不同页面经常重用一部分资源文件。如果将这些资源文件设置为可缓存，则在刷新或跳转到另一个页面“资源”时无需从网络中获取相关信息，从而大大加快了网页的加载速度。

4.减少重定向请求

某些网站为不同的终端创建了不同的页面。例如，当您使用手机访问微博时，您将从weibo.com重定向到weibo.cn。每次重定向都会导致浏览器重新发起请求并延长加载时间。在这种情况下，应尽可能使用响应式设计，一个weibo.com网站覆盖所有终端。

5.使用CDN存储静态资源

CDN是静态内容分发网络。它在每个省甚至每个城市都部署了自己的服务器，以分发这些静态内容。然后，当某个城市中的用户想要提取某种资源时，他将首先从本地CDN服务器中提取资源，以确保他能够最快地获得该资源。根据Bricks的统计，网络资源的70％是静态资源。这意味着70％的内容在生成后不会改变，因此将它们全部放入CDN可以提高这70％的资源的下载速度。

6.减少DNS查询数量

许多人喜欢将不同的图片放在不同的域名下。例如，图片A链接到a.pm-teacher.com，而图片B链接到b.pm-teacher.com。当网页同时使用图片A和图片B时，浏览器需要查询两个域名。您必须知道，每次解析域名都将浪费时间，因此请尽可能将所有图像放在一个域名下。

7.压缩CSS和JS内容

此处提到的压缩不重复第二点。上面提到的压缩是不更改文件内容的压缩。而且在CSS和JS中有很多空格和变量名（例如hello =“ hello word”;）。如果删除这些空格并用简单字母（例如a =“ hello word”;）替换变量名，则这些css和js原始文件的大小也将减小，这也有助于加快提取速度。

我不知道您是否注意到上述优化方案的核心是三点：减少请求数量，减少资源大小以及找到最快的服务器。如果您是网站的产品经理，请与开发人员联系，以确认您是否进行了类似的优化。