Web性能优化是在研究什么？

大多数的性能优化，无非是让页面能更快的展示在用户的手机或者电脑的桌面上，譬如，我在地址栏输入baidu.com，怎么样使百度的搜索框最快的呈现，就是Web性能优化要解决的问题。我们只需要知道从输入URL到页面展示经历了什么，优化中间的步骤，把每一个阶段都加快就可以了。

DNS服务优化

当我输入baidu.com的网址时，首先我需要通过电信服务商提供的DNS告诉我百度的服务器机房分配给我的IP是多少。有时候服务商的DNS会出现一些问题，我们就可以使用公共的DNS地址，DNS能加速吗？能，通过购买更多的DNS服务器，但一般没有人会去这么做，因为DNS已经很快了，作为个人可以去购买DNS的加速器或者配Host。

keep-alived 机制

我们向百度的服务器发送一个http请求，其本质一个tcp链接， 这个步骤没办法优化，但是使用几个tcp链接，却可以进行适当的优化，譬如我们访问一个网站，首先要请求一个html，html又会让我们去请求一个css和js，每次请求都需要发送一个tcp链接，如果三个用一个tcp链接，也就是keep-alived,在第一次tcp链接成功时，不要中断，在第二个请求时复用这个链接就好了。

SQL优化

我们发送一个请求去百度，可能百度会去查询数据库，对查询的过程所需时间进行优化。

提高服务器带宽

我们向服务器发送请求之后，服务器给客户端返回响应，时间=下载量/下载速度，所需的时间与下载量成正比，和下载的速度成反比，也就是说，我们可以提高的我们下载速度来缩短所需时间。提高下载速度的方法有两种，第一种提高客户端的带宽，显然这个方法不太现实，第二种就是提升服务器端的带宽，花钱就能解决。

压缩

这个压缩不是代码的压缩，是开启gzip的压缩算法，服务器返回给用户的时候，并不直接返回用户，而是通过gzip打个压缩包用户下载这个压缩包，浏览器自动解压缩。

优化CSS

重复的选择器尽量合并，重复的属性尽量合并。

先CSS后JS

当浏览器展示页面时，先加载CSS，使网页的外观展示在用户面前，再去加载JS，一是为了更好的用户体验，二是当用户浏览网页时，不会马上就点击操作，一般需要阅读网页，通过阅读的这个时间再去加载JS。

先不加载第二屏内容（懒加载）

用户在浏览网页时，不会立刻就去阅读第二屏的内容，所以可以通过懒加载，先不加载第二屏内容。

预加载

当我们需要频繁点击下一页时或者其他情况，我们可以预先加载下一页的内容，当用户点击下一页可以立刻跳转，预加载和懒加载需要按照具体情况去选择使用。

缓存

对css、js、png进行缓存，用户在第二次进入时就不会再次下载，本地直接就可以渲染。html不缓存，如果html缓存了，就真的不会更新css和js了，如果需要更新css，一般都是在style后面加一个版本号，浏览器运行html的时候，发现路径发生变化了，就会重新请求服务器更新css。cache-control

加域名

如果有多个需要加载的html、css、js文件，如果一次性请求，既浪费服务器的带宽，也消耗用户的带宽，而且浏览器对此也做了最大请求的限制，所以可以通过请求不同的域名下载html,css,js，打破最大并发请求数限制，这种加速的域名叫做CDN域名。增加域名，当浏览器向服务器请求时会携带cookie，但cookie并不会跨域，所以我们向另一个域名请求时并不会携带cookie,减少了cookie的数量，一般这个过程叫做cookie free.