Web 页面性能分析笔记
网页慢的原因不一定只是前端,所以需要结合Network一起看
如何评价一个页面打开得快不快,可以用两个指标描述,一个是ready的时间,另一个是load的时间。
如下示例表示,read时间是2.72s,load时间是4.74s。
DOMContentLoaded: 2.72s |Load 4.74s
chrome devtools
- devtools练习网站
- 全新Chrome Devtool Performance使用指南
- 如何使用 Timeline 工具
- Chrome DevTools中文手册
- Effective前端7:加快页面打开速度
- Chrome开发者工具详解(2):Network面板
- segmentfault-Chrome DevTools — Timeline
- 我不知道的 Chrome Network 面板技巧
性能优化
GTmetrix工具
- gtmetrix:网站性能评测工具,在线
- 优化网站加载时间(GTmetrix)
其他工具
- caniuse:CSS兼容性检测
Web 页面性能分析笔记的更多相关文章
- web页面性能分析一些网址
https://developers.google.com/speed/pagespeed/insights/
- 转 WEB前端性能分析--工具篇
在线网站类: WebPageTest 说明: 在线的站点性能评测网站,地址http://www.webpagetest.org/ 补充: 其实这网站也是个开源项目,所以支持自己搭建一个内部的测试站点 ...
- 转 web前端性能分析--原理篇
转自http://blog.csdn.net/five3/article/details/7686715 web前端性能: 即是web用户在访问一个页面时所要花费的时间总和.即一个完全意义上的用户响应 ...
- Web页面性能优化(YSlow)
YSlow(解析为Why Slow)是雅虎基于网站优化规则推出的工具,帮助你分析并优化网站性能.旧版Yslow 有13条规则,新版Yslow有23项规则,YSlow会根据这些规则分析你的网站,并给出评 ...
- 隔壁老主精讲web页面性能优化。
首先说一下为什么要进行web页面性能优化,在同样的网络环境下,两个同样能满足你的需求的网站,一个“Biu”的一下就加载出来了,一个卡--卡--卡--卡--卡--才出来,你会选择哪个?研究表明:用户最满 ...
- 前端性能优化之利用 Chrome Dev Tools 进行页面性能分析
背景 我们经常使用 Chrome Dev Tools 来开发调试,但是很少知道怎么利用它来分析页面性能,这篇文章,我将详细说明怎样利用 Chrome Dev Tools 进行页面性能分析及性能报告数据 ...
- Web前端性能分析
Web前端性能通常上代表着一个完全意义上的用户响应时间,包含从开始解析HTML文件到最后渲染完成开始的整个过程,但不包括在输入url之后与服务器的交互阶段.下面是整个过程的各个步骤: 开始解析html ...
- 转 web前端性能分析--实践篇
当我们知道了web前端性能的关键点后,那么接下来要做的就是如何去具体实施并获取这些关键点的数据了.通过前面的学习知道了不少好的工具,经过对比后个人觉得dynatrace还是不错的. 不仅支持ie,ff ...
- 转 web前端性能分析--分析篇
通过具体实施后就可以获得第一手的web前端性能的数据了,然后每次新版本都跑,这就会获得大量的数据,为性能分析提供了基础的输入,同时应该还要综合使用多种工具去从不同的方向收集数据:比如showslow同 ...
随机推荐
- laravel 之jwt认证使用详解
转载 http://www.heibaiketang.com/blog/show/3.html https://packagist.org/packages/tymon/jwt-auth#1.0.0- ...
- java.lang.ClassNotFoundException: org.hibernate.engine.FilterDefinition的解决方案
今天在GitHub上面看到一个有意思的项目,下载下来,使用tomcat部署失败,出现异常,网上说JDK版本太高,改低,还是失败. 由于本人有个习惯,更喜欢把项目直接放入tomcat webapps 里 ...
- CNN那么多的网络有什么区别吗?如何对CNN网络进行修改?
https://www.zhihu.com/question/53727257/answer/136261195 http://blog.csdn.net/csmqq/article/details/ ...
- [转]LoadRunner 各个指标分析
转载:https://www.cnblogs.com/dvbbs2012/p/4073635.html 我们要监视CPU,内存.硬盘的资源情况.得到以下的参数提供分析的依据.%processor ti ...
- Eclipse创建maven工程后没有build path解决方案
1.修改maven工程下的.project文件为如下内容 <?xml version="1.0" encoding="UTF-8"?> <pr ...
- 根据IP获取所在的国家城市
根据IP获取所在的国家城市 新浪的IP地址查询接口:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js 新浪多地域测试方法:htt ...
- 如何避免Scrum敏捷开发团队反思会形式化,海星法介绍
如何避免Scrum敏捷开发团队反思会形式化? 迭代压力很大,根本没时间,而且,反思会上大家都在互相推脱责任,会议成了“批斗大会”,所以团队的人都觉得这个会很鸡肋. 很多团队在开反思会时是这么干的:产品 ...
- activiti 报 next dbid
记录一下吧. 今天将生产环境的几个服务节点改成集群模式,其中包含activiti审批服务节点,其中各个服务几点间数据通信采用MQ(与本文无关). 然后报出如题错误. 究其原因就是,在启动activit ...
- python shutil模块简单介绍
python shutil模块简单介绍 简介 shutil模块提供了大量的文件的高级操作.特别针对文件拷贝和删除,主要功能为目录和文件操作以及压缩操作. shutil 模块方法: copy(src, ...
- linux上限值网速、限值带宽
Linux操作系统中的流量控制器TC(Traffic Control)用于Linux内核的流量控制,主要是通过在输出端口处建立一个队列来实现流量控制. Linux流量控制的基本原理如下图所示. 接收包 ...