页面装载js及性能分析方法
一、装载
先装载静态页面的引用js文件,然后查找引用文件中是否包含onload函数,比如main.js中包含onload函数,在main.js中查找是否有对其他js文件的引用,优先装载引用js文件,被引用中文件的装载顺序和main.js的顺序一致。
装载完毕后,开始执行onload函数。由于js执行顺序是顺序执行的,为提高页面相应速度,一般做法是在onload中只画页面,一些事件的绑定函数,ajax方法等可延后书写。
二、响应速度分析
1.借助工具进行分析
各大浏览器的开发者工具(最喜欢使用火狐)可以方便的查看各个js文件、html文件、css文件及图片的装载及执行时间。
2.硬编码分析
在第一步中我们基本能定位到瓶颈js文件了,在瓶颈js中,可以使用console.time('test')和console.Endtime('test')语句对js函数及代码块掐取执行时间。不过console语句只在非IE浏览器中执行有效,而在IE下会报错。如果你偏爱使用IE,那就使用时间戳吧。在掐取时,比较方便的方法是,直接掐住整个js文件,然后使用火狐浏览器,按F12可以在控制台中看到目标js中所有函数及代码块的耗时,即可定位到瓶颈代码处。
页面装载js及性能分析方法的更多相关文章
- Android APP性能分析方法及工具
近期读到<Speed up your app>一文.这是一篇关于Android APP性能分析.优化的文章.在这篇文章中,作者介绍他的APP分析优化规则.使用的工具和方法.我觉得值得大家借 ...
- js 动画性能分析 transfrom
1.动画实现代码 (1)使用定位实现: <!DOCTYPE html> <html> <head> <meta charset="utf-8&quo ...
- mysq常用l性能分析方法
orzdba查看读写./orzdba.pl --mysql -S /data/mysql30001/mysql.sock 语句查看读写命令数量,以及数据库TPS,传输的大小 查看processlist ...
- php代码性能分析方法
1.用到的函数 microtime() ,函数返回当前 Unix 时间戳和微秒数,本函数以 "msec sec" 的格式返回一个字符串,其中 sec 是自 Unix 纪元(0:00 ...
- Java性能分析方法
Java调优经验 http://www.rowkey.me/blog/2016/11/02/java-profile/
- MiniProfiler性能分析工具— .Net Core中用法
前言: 在日常开发中,应用程序的性能是我们需要关注的一个重点问题.当然我们有很多工具来分析程序性能:如:Zipkin等:但这些过于复杂,需要单独搭建. MiniProfiler就是一款简单,但功能强大 ...
- 多个JS文件性能优化
页面中引入的JS文件是阻塞式加载的,这样会影响页面性能.以下是JS文件性能优化方法: 一:将所有的<script>标签放到页面底部,也就是</body>闭合标签之前,这能确保在 ...
- SQL2005性能分析一些细节功能你是否有用到?
原文:SQL2005性能分析一些细节功能你是否有用到? 我相信很多朋友对现在越来越大的数据量而感到苦恼,可是总要面对现实啊,包括本人在内的数据库菜鸟们在开发B/S程序时,往往只会关心自己的数据是否正确 ...
- mongodb .explain('executionStats') 查询性能分析(转)
mongodb性能分析方法:explain() 为了演示的效果,我们先来创建一个有200万个文档的记录.(我自己的电脑耗了15分钟左右插入完成.如果你想插更多的文档也没问题,只要有耐心等就可以了.) ...
随机推荐
- bootstrap 多元素共用 popover
<div class="popover fade bottom in small" role="tooltip" id="gPopover&qu ...
- Python 列表 sort() 方法
描述 Python 列表 sort() 方法对列表进行排序. 语法 sort() 方法语法: L.sort([key=None][,reverse=False]) 参数 key-- 可选参数, 如果指 ...
- CTPN - 训练
源码地址:https://github.com/eragonruan/text-detection-ctpn 该地址提供了 CTPN 的 tf 版本的实现,代码文档写得很详细,issue 里面也帮助解 ...
- Spring的@Required注解
该@Required注解适用于bean属性setter方法,并表示受影响的bean属性必须在XML配置文件在配置时进行填充.否则,容器会抛出一个BeanInitializationException异 ...
- linux的fork()函数具体解释 子进程复制父进程什么
#include<stdio.h> #include<string.h> #include<stdlib.h> #include<unistd.h ...
- 解决Linux(ubuntu),windows双系统重装后恢复开机选单
1 重装ubuntu后恢复开机选单十分简单.直接更新grub就能够了: sudo update-grub 2 重装windows后显得麻烦一点.需用u盘写入ubuntu镜像重新启动使电脑从u盘启动, ...
- js获取当前页面url网址等信息
使用js获取当前页面的url网址信息. 1.设置或获取整个 URL 为字符串: window.location.href 2.设置或获取与 URL 关联的端口号码: window.location.p ...
- 【Android】16.3 带Intent过滤器的Services
分类:C#.Android.VS2015: 创建日期:2016-03-01 一.简介 这一节演示带Intent过滤器的Services的基本用法. 1.配置Intent Filter 不论是本地解决方 ...
- ARM中LDR伪指令与LDR加载指令
ARM指令集中,LDR通常都是作加载指令的,但是它也可以作伪指令. LDR伪指令的形式是“LDR Rn,=expr”.下面举一个例子来说明它的用法. COUNT EQU 0x4000310 ...
- 超烂的ELK之filebeat读取【已解决】
搞了无数次的filebeat-->logstash今天栽了跟头 filebeat在读取如下文件的时候,openchgw.log 软连接speechgw.log.20170703183729文件 ...