页面装载js及性能分析方法介绍


Posted in Javascript onMarch 21, 2014

一、装载

先装载静态页面的引用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中所有函数及代码块的耗时,即可定位到瓶颈代码处。

Javascript 相关文章推荐
extjs 为某个事件设置拦截器
Jan 15 Javascript
表格单元格交错着色实现思路及代码
Apr 01 Javascript
Ajax同步与异步传输的示例代码
Nov 21 Javascript
jquery prop的使用介绍及与attr的区别
Dec 19 Javascript
jquery ajax 局部无刷新更新数据的实现案例
Feb 08 Javascript
JQuery异步加载无限下拉框级联功能实现示例
Feb 19 Javascript
javascript引用赋值(地址传值)用法实例
Jan 13 Javascript
jQuery中ready事件用法实例
Jan 19 Javascript
Javascript实现一个简单的输入关键字添加标签效果实例
Jun 01 Javascript
Vue2 SSR渲染根据不同页面修改 meta
Nov 20 Javascript
node实现分片下载的示例代码
Oct 17 Javascript
jQuery实现的中英文切换功能示例
Jan 11 jQuery
Js冒泡事件详解及阻止示例
Mar 21 #Javascript
js调用浏览器打印模块实现点击按钮触发自定义函数
Mar 21 #Javascript
js中把JSON字符串转换成JSON对象最好的方法
Mar 21 #Javascript
jquery插件冲突(jquery.noconflict)解决方法分享
Mar 20 #Javascript
将中国标准时间转换成标准格式的代码
Mar 20 #Javascript
如何将php数组或者对象传递给javascript
Mar 20 #Javascript
js 触发select onchange事件代码
Mar 20 #Javascript
You might like
杏林同学录(七)
2006/10/09 PHP
PHP支持多种格式图片上传(支持jpg、png、gif)
2011/11/03 PHP
PHP __autoload()方法真的影响性能吗?
2012/03/30 PHP
解析ajax事件的调用顺序
2013/06/17 PHP
PHP防止post重复提交数据的简单例子
2014/06/07 PHP
html静态页面调用php文件的方法
2014/11/13 PHP
PHP异常处理浅析
2015/05/12 PHP
PHP实现获取某个月份周次信息的方法
2015/08/11 PHP
利用PHP自动生成印有用户信息的名片
2016/08/01 PHP
DEDE实现转跳属性文档在模板上调用出转跳地址
2016/11/04 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
PHP7.0连接DB操作实例分析【基于mysqli】
2019/09/26 PHP
javascript 特殊字符串
2009/02/25 Javascript
javascript forEach通用循环遍历方法
2010/10/11 Javascript
jquery 学习之二 属性相关
2010/11/23 Javascript
JS匀速运动演示示例代码
2013/11/26 Javascript
Jquery操作js数组及对象示例代码
2014/05/11 Javascript
jQuery实现的原图对比窗帘效果
2014/06/15 Javascript
javascript数组输出的两种方式
2015/01/13 Javascript
简单的jQuery banner图片轮播实例代码
2016/03/04 Javascript
jQuery基于ID调用指定iframe页面内的方法
2016/07/06 Javascript
js调用父框架函数与弹窗调用父页面函数的简单方法
2016/11/01 Javascript
Angular在模板驱动表单中自定义校验器的方法
2017/08/09 Javascript
[50:27]OG vs LGD 2018国际邀请赛淘汰赛BO3 第一场 8.26
2018/08/30 DOTA
简单谈谈python中的Queue与多进程
2016/08/25 Python
利用python爬取斗鱼app中照片方法实例
2017/12/03 Python
Python使用try except处理程序异常的三种常用方法分析
2018/09/05 Python
Python 一行代码能实现丧心病狂的功能
2020/01/18 Python
详解Python 重学requests发起请求的基本方式
2020/02/07 Python
《盲人摸象》教学反思
2014/02/16 职场文书
幼儿园大班开学教师寄语
2014/04/03 职场文书
管理建议书范文
2014/05/13 职场文书
中专生自荐信
2014/06/25 职场文书
学校工会工作总结2015
2015/05/19 职场文书
创业分两种人:那么哪些适合创业?,哪些适合不适合创业呢?
2019/08/23 职场文书
html中相对位置与绝对位置的具体使用
2022/05/15 HTML / CSS