什么是首字节时间|天津网站建设|天津网站制作|天津网站设计|天津文率科技有限公司

什么是首字节时间

时间：2014-06-19 来源：天津文率科技有限公司

前面的我写的《【技术贴】如何提高网页打开速度|优化网站》的文章里在优化方面里提到了什么是首字节。

下面我就来告诉大家什么是首字节吧，首字节到底有什么用。

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滤镜

前端TTSR测试脚本：
<head>
<script>
(function(){
var timeStart = + new Date,
limit = 1,
timer = setInterval(function(){
if((document.body&&document.body.scrollHeight > 0) || (limit++ == 500)){
clearInterval(timer);
console.info('TTSR:',+ new Date - timeStart,';duration:',limit);
}
},10);
})()
</script>
</head>
在页面端无法简单测试出具体的TTSR，不过可以通过模拟脚本得到大概的时间，Firefox提供了一个MozAfterPaint事件，经测试，用于TTSR并不准确，如果有MozBeforePaint事件该有多好。

什么是TTDC呢？
3.TTDC(Time to Document Complete)

TTDC-文档完成时间，指页面结束加载，可供用户进行操作的时间，等价于浏览器的onload事件触发点。TTDC是比较重要的性能优化对象，TTDC越低，页面加载速度越快，用户等待时间越短。
注意
TTDC的优化方法有：

1.优化TTFB

2.优化TTSR

3.优化首屏时间，将不必要的页面加载放到onload事件之后

TTDC前端测试：
常见性能测试平台大多使用IE浏览器的DocumentComplete事件来度量TTDC，DocumentComplete事件触发时，页面的状态应是READYSTATE_COMPLETE，所以在页面中我们可以用JS脚本判断：
var win = window,doc = document;
if(win.attachEvent || doc.hasOwnProperty('onreadystatechange')){
doc.onreadystatechange = function(){
if(doc.readyState == 'complete'){
/**
* test
do something...
*/
}
}
}else{
win.addEventListener('load',function(){
/**
* test
do something...
*/
},false);
}