课外学习部分:

什么是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);  }

什么是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,说明很快呀。不需要做优化。 谢谢使用阿里测!

HTTP 返回时间 概念 TTFB..的更多相关文章

  1. WebAPI返回时间数据不带T

    最近一段时间项目里面使用WebAPI比较多,但是在返回时间数据的时候回默认带上T,就像这样子 "2016-04-21T13:26:17.4701811+08:00", 这样的数据在 ...

  2. easyUi datagrid 返回时间格式化操作

    1.格式化返回的时间 { field : 'endTime', title : '轮播图片循环的结束时间', width : 50, align : 'center' //格式化时间操作 format ...

  3. C#返回时间格式转换成 js 字符串

    在.net 中,调用 post 或者 get和后台通信时,如果有时间返回信息,后台返回的时间信息一般是这样格式:Thu Jul 9 23:14:53 UTC+0800 2015,那么要在前台显示就会有 ...

  4. ASP.NET MVC处理JsonResult返回时间DateTime问题

    在开发ASP.NET MVC时,如果你有使用jQuery的Ajax去获取一些json数据时,其中数据返回有包含日期时间的话,也许会觉得有点小问题. 现针对此问题,写一个小例子来演示一下,创建一个控制器 ...

  5. 处理MVC中默认的Json方法返回时间的问题

    利用 Json方法返回 数据时,如果有时间格式,会变成 "\/Date(1369419656217)\/" 这个样子,问了同事找到个解决方法 using Newtonsoft.Js ...

  6. MYSQL 的 6 个返回时间日期函数

    方法1. curdate(),curtime(),now() 方法2. utc_date(),utc_time(),utc_datetime(); 可以看到utc时间相比东西八区要小8小时 注意. 返 ...

  7. python requests模块中返回时间elapsed解析

    一.问题: Python 中requests库在发送http请求时相当方便好用,但在使用时一直受一个问题困扰,怎么才能查看请求时长呢? 自己写时间函数再相减?NO,这个方法肯定不行. 二.解决: 好吧 ...

  8. python-Django框架url分发实现返回时间

    1.创建Django工程 再newproject中选择Django工程,在Location中输入建立的项目文件夹名称,Application name中输入要建立的app名称后电机Create. 2. ...

  9. 什么是首字节时间(TTFB)

    第一字节响应时间(TTFB)=从发送请求到WEB服务器的时间+WEB服务器处理请求并生成响应花费的时间+WEB服务器生成响应到浏览器花费的时间测量第一字节响应时间(TTFB)的工具:http://ww ...

随机推荐

  1. .NET生成静态页面例子

    主要做法如下: 1.创建网站,并创建一个模板页,template.htm 2.添加一个web窗体Default.aspx 3.在网站下新建文件夹htm,设置该文件夹的属性,确保该文件夹具有可写权限 详 ...

  2. vector 与 set区别

    注:本文内容摘自网络,准确性有待验证,现阶段仅供学习参考.尊重作品作者成果,原文链接 :http://blog.csdn.net/wxdcxp/article/details/5279618 首先,v ...

  3. 为SQL Server表中的列添加/修改/删除注释属性(sp_addextendedproperty、sp_updateextendedproperty、sp_dropextendedproperty)

    本篇基本完全参考:sql--sp_addextendedproperty和sp_updateextendedproperty (Transact-SQL) 三个存储过程用法一样,以sp_addexte ...

  4. chromium安装flash

    sudo apt-get install pepperflashplugin-nonfree sudo update-pepperflashplugin-nonfree --install Flash ...

  5. JQ插件ajaxFileUpload、php实现图片,数据同时上传

    代码结构如下: 1.HTML代码,没必要解释了. <!DOCTYPE html> <html> <head> <meta charset="UTF- ...

  6. Discuz论坛下载与安装

    Part1 Discuz下载 百度“discuz下载” 2. 找到下图这里 3. 选择你需要的版本,这里我选了X3.1版 4. 选择UTF-8简体下载 这是我下载好的文件 Part2 Discuz安装 ...

  7. Day22 JSONP、瀑布流

    一.JSONP JSONP a.Ajax $.ajax({ url:'/index/', dataType:'json', data:{}, type:'GET', success:function( ...

  8. Centos7 修改运行级别

    systemd使用比sysvinit的运行级别更为自由的target概念作为替代 第三运行级: multi-user.target 第五运行级: graphical.target   #前者是符号链接 ...

  9. ASP.NET MVC轻教程 Step By Step 7——改进Write动作方法

    在上一节我们使用强类型视图改进Write视图获得更好的智能感知和代码重构,现在可以进一步的改进动作方法. Step 1. 数据模型绑定 在Save方法中我们使用Request来获取表单传送的值,其实可 ...

  10. Quartz1.8.5例子(三)

    /* * Copyright 2005 - 2009 Terracotta, Inc. * * Licensed under the Apache License, Version 2.0 (the ...