2

页面性能参数

W3C出了一些API,var time = performance.timing
在前端页面window.onload中console.log(time)后会得到一个数组,数组中包含了以下列表中的值.

clipboard.png

    **DNS查询耗时**
    domainLookupEnd - domainLookupStart
    **TCP链接耗时**
    connectEnd - connectStart request
    **request请求耗时**
    responseEnd - responseStart
    **解析dom树耗时**
    domComplete - domInteractive
    **白屏时间**
    responseStart - navigationStart
    **DOM ready时间**
    domContentLoadedEventEnd - navigationStart
    **onload时间**
    loadEventEnd - navigationStart

资源加载性能

Resource Timing浏览器获取网页时,会对网页中每一个静态资源(脚本文件、样式表、图片文件等等)发出一个HTTP请求。Resource Timing可以获取到单个静态资源从开始发出请求到获取响应之间各个阶段的Timing。用法如下:

var resourcesObj = performance.getEntries();

Resource Timing返回的是一个对象数组,数组的每一个项都是一个对象,这个对象中包含了当前静态资源的加载Timing,如下图:
clipboard.png

整个加载时间为duration参数.
以上所有值的参数都为毫秒.

此文章参考此链接


少年版
171 声望14 粉丝

希望自已给力一点,再多努力一点