网站加载 Waiting (TTFB) 时间过长的原因和解决办法

关注网页前端性能的朋友，在优化网页性能的时候都会遇到网站加载 Waiting（TTFB）时间过长的问题。对于没有优化过的 WordPress 站点，TTFB 时间经常超过了页面内容的下载时间，为用户带来不必要的等待时间。这个问题的主要原因是在服务器端，不熟悉服务器运维的朋友优化起来可能会不知道从哪里下手，今天我们就从各方面分析一下网站加载 Waiting (TTFB) 时间过长的原因和解决办法。

什么是 Waiting (TTFB) 时间

TTFB 是 Time to First Byte 的缩写，指的是浏览器开始收到服务器响应数据的时间（后台处理时间+重定向时间），是反映服务端响应速度的重要指标。就像你问朋友了一个问题，你的朋友思考了一会儿才给你答案，你朋友思考的时间就相当于 TTFB。你朋友思考的时间越短，就说明你朋友越聪明或者对你的问题越熟悉。对服务器来说，TTFB 时间越短，就说明服务器响应越快。

TTFB 时间多长算长？

因为每个服务器的硬件和网络环境都不尽相同，每个服务器的 TTFB 时间也不相同。如果想知道你的服务器优化可以到什么程度，大家可以上传一些静态的 HTML 页面到服务器，然后打开这些静态页面，看一些这些页面的 TTFB 时间，大多数服务器的 TTFB 时间都在 50 ms 以下，这个时间就是我们优化时候可以追求的时间。下面两个图中的 TTFB 时间分别是本站所在服务器的静态和动态网页 TTFB 等待时间

1. 静态网页 Waiting （TTFB）时间
   
2. 动态网页 Waiting （TTFB）时间

根据我们的测试，TTFB 时间如果超过了 500 ms，用户在打开网页的时候就会感觉到明显的等待。我么可以把 500 ms 以上认为是 TTFB 时间过长。可见，WordPress 智库的服务器还不算差。

标题TTFB 过长的原因

对于动态网页来说，服务器收到用户打开一个页面的请求时，首先要从数据库中读取该页面需要的数据，然后把这些数据传入到模板中，模板渲染后，再返回给用户。由于查询数据和渲染模板需要需要一定的时间，在这个过程没有完成之前，浏览器就一致处于等待接收服务器响应的状态。有些服务的性能比较低，或者优化没做好，这个时间就会比较长。

当然，如果服务器到用户之间的网络不好，（比如，服务器在欧洲，用户在中国，用户打开网页的时候，请求需要跨越千山万水才能达到服务器），服务器接收到用户请求的时间过长，也是导致 TTFB 时间过长的原因。

有时候，页面在用户的浏览器中保存了过多的 Cookie，每次请求，这些 Cookie 都要发送到服务器，服务器都要处理这些 Cookie，这也是导致 TTFB 时间过长的原因之一。

Waiting (TTFB) 时间过长的解决办法

知道了原因，解决办法就显而易见了，那就是缩短服务器响应时间，最简单直接并且有效的办法就是使用缓存，把 PHP 和 MySQL 的执行时间最小化，一些缓存插件可以把 SQL 查询结果缓存起来，把几十次查询结果转换为几次；一些缓存插件可以直接把用户所请求的页面静态化，用户打开网页时，相当于直接从服务器上下载了静态页面。

如果是网络原因，换一个服务器是比较直接的解决办法。如果因为一些原因不能换服务器，可以使用一个 CDN，把页面同步到离用户比较近的 CDN 节点上，也是一个不错的解决办法。

如果是 Cookie 的原因，可以通过修改应用程序，删除一些不必要的 Cookie，或者精简 Cookie 内容，缩短 Cookie 的有效期等，都是解决办法。

本站使用的是 Cachify 插件 Memcached 缓存方式，直接把用户请求过的页面，缓存到了内存中，网站加载 Waiting (TTFB) 时间达到了 50 ms 左右，感兴趣的朋友可以用谷歌浏览器的调试工具查看一下。

摘自网页2
导致TTFB的时间过长过长的因素主要是网络、软件、硬件三大块导致的，网络这块就是带宽、线路和网络配置；软件这块也能影响TTFB值，但是一般情况，软件的可能性不大，也就检查一下Nginx、Apache、IIS等等这些环境软件，还有我们本身布置的程序；还有硬件问题，就是配置过低处理起来非常慢。

解决TTFB的方法有哪些：
1、修改DNS，国内的修改为114.114.114.114，国外的修改为8.8.8.8、8.8.4.4或1.1.1.1。
2、服务器升级带宽
3、选择线路好的服务器
4、升级服务器配置（一般是那些512内存的，最好升级一下）
5、数据库使用本地数据库
6、数据库连接时使用IP，舍弃localhost习惯，改用127.0.0.1
7、缓存动态网页
8、还有可能是服务器被攻击导致缓慢，更换高防服务器吧

摘自网页3
TTFB-首字节时间，是指从客户端开始和服务端交互到服务端开始向客户端浏览器传输数据的时间（包括DNS、socket连接和请求响应时间），是能够反映服务端响应速度的重要指标，获取在接收到响应的首字节前花费的毫秒数。
lTime = Response.TTFB
返回值 lTime As Long：首字节响应时间（以毫秒为单位）。
TTFB:httpwatch的timechart中的一列参数。

补充学习：
什么是TTFB呢？
1.TTFB (Time To First Byte)，是最初的网络请求被发起到从服务器接收到第一个字节这段时间，它包含了 TCP连接时间，发送HTTP请求时间和获得响应消息第一个字节的时间。
注意：网页重定向越多，TTFB越高，所以要减少重定向

TTFB优化的方法有：
1.减少DNS查询
2.使用CDN
3.提早Flush
4.添加周期头

什么是TTSR呢？
2.TTSR(Time to Start Render)
TTSR-开始渲染时间，指某些非空元素开始在浏览器显示时的时间，这也是一项重要指标，即TTSR越短，用户越早浏览器中的内容，心理上的等待时间会越短。过多的CPU消耗会拖慢TTSR，所以网站中有大量图片和脚本往往会造成不良用户体验。

注意
TTSR优化：
1.优化TTFB
2.降低客户端CPU消耗，即页面加载初期不要有大脚本运行，把JS脚本放到页面下方
3.使用效率较高的CSS选择器，避免使用CSS表达式
4.避免使用CSS滤镜

什么是TTDC呢？
3.TTDC(Time to Document Complete)
TTDC-文档完成时间，指页面结束加载，可供用户进行操作的时间，等价于浏览器的onload事件触发点。TTDC是比较重要的性能优化对象，TTDC越低，页面加载速度越快，用户等待时间越短。

注意
TTDC的优化方法有：
1.优化TTFB
2.优化TTSR
3.优化首屏时间，将不必要的页面加载放到onload事件之后

什么是TTFL呢？
4.TTFL(Time to Fully Loaded)
TTFL-完全加载时间，指页面在onload之前和onload事件之后额外加载的内容所花费的时间的总和，即页面完完全全加载完毕消耗的总时间。
注意
TTFL的优化方法：
1.优化TTFB
2.优化TTSR
3.优化TTDC
4.延迟加载
5.异步加载
6.按需加载

如何优化网页首字节时间
1:
看一下详情分析页面。
DNS解析：如果是 DNS 解析时间太长，那是你的域名解析服务器不好，请更换靠谱的 NS 服务器。
初始化连接：如果是初始化连接的时间太长，那是你机房的网络不好，请更换更好的机房
如果上面两个都不是。那就是你的代码性能不好，代码执行消耗的时间太长。请优化代码，或者更换更好的机器。
2:
客户端t1时刻发起对于某个url的请求,经过DNS解析获取相应的IP地址后,发起对该IP地址的socket连接，在完成三次握手建立tcp连接后，客户端发送http请求信息，服务端收到请求后返回响应的内容，当客户端在t2时刻收到服务端返回内容的第一个字节，则第一字节时间=t2-t1。 第一字节的时间= DNS解析的时间+socket三次握手时间+http请求时间+第一字节返回的时间。 首字节的时间是0，说明很快呀。不需要做优化。