一、装载

先装载静态页面的引用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及性能分析方法的更多相关文章

  1. Android APP性能分析方法及工具

    近期读到<Speed up your app>一文.这是一篇关于Android APP性能分析.优化的文章.在这篇文章中,作者介绍他的APP分析优化规则.使用的工具和方法.我觉得值得大家借 ...

  2. js 动画性能分析 transfrom

    1.动画实现代码 (1)使用定位实现: <!DOCTYPE html> <html> <head> <meta charset="utf-8&quo ...

  3. mysq常用l性能分析方法

    orzdba查看读写./orzdba.pl --mysql -S /data/mysql30001/mysql.sock 语句查看读写命令数量,以及数据库TPS,传输的大小 查看processlist ...

  4. php代码性能分析方法

    1.用到的函数 microtime() ,函数返回当前 Unix 时间戳和微秒数,本函数以 "msec sec" 的格式返回一个字符串,其中 sec 是自 Unix 纪元(0:00 ...

  5. Java性能分析方法

    Java调优经验 http://www.rowkey.me/blog/2016/11/02/java-profile/

  6. MiniProfiler性能分析工具— .Net Core中用法

    前言: 在日常开发中,应用程序的性能是我们需要关注的一个重点问题.当然我们有很多工具来分析程序性能:如:Zipkin等:但这些过于复杂,需要单独搭建. MiniProfiler就是一款简单,但功能强大 ...

  7. 多个JS文件性能优化

    页面中引入的JS文件是阻塞式加载的,这样会影响页面性能.以下是JS文件性能优化方法: 一:将所有的<script>标签放到页面底部,也就是</body>闭合标签之前,这能确保在 ...

  8. SQL2005性能分析一些细节功能你是否有用到?

    原文:SQL2005性能分析一些细节功能你是否有用到? 我相信很多朋友对现在越来越大的数据量而感到苦恼,可是总要面对现实啊,包括本人在内的数据库菜鸟们在开发B/S程序时,往往只会关心自己的数据是否正确 ...

  9. mongodb .explain('executionStats') 查询性能分析(转)

    mongodb性能分析方法:explain() 为了演示的效果,我们先来创建一个有200万个文档的记录.(我自己的电脑耗了15分钟左右插入完成.如果你想插更多的文档也没问题,只要有耐心等就可以了.) ...

随机推荐

  1. read/write函数与(非)阻塞I/O的概念

    一.read/write 函数 read函数从打开的设备或文件中读取数据. #include <unistd.h> ssize_t read(int fd, void *buf, size ...

  2. Linux内核(16) - 高效学习Linux内核

    世界悲结束了,章鱼哥也退役了,连非诚勿扰中的拜金女也突然的少了很多.这本<Linux内核修炼之道>在卓越.当当.china-pub上也已经开卖了,虽然是严肃文学,但为了保证流畅性,大部分文 ...

  3. 统一日志监控系统 springboot websocket 简单版 王代军-作品

    http://git.oschina.net/redArmy/springboot-websocket-logs 目的: 统一监控 开发测试环境日志 如果需要可以拓展线上环境的日志(自己视情况而定) ...

  4. python 例程的一个好例子

    用例程来写一个求平均值的算法 #!/usr/local/python/bin/python3 def FunCore(): total=0 counter=0 average=None tmp=yie ...

  5. 在CentOS 7上安装Node.js的4种方法(yum安装和源码安装)

    CentOS 7上的安装方法,其中涵盖了源码安装,已编译版本安装,EPEL(Extra Packages for Enterprise Linux)安装和通过NVM(Node version mana ...

  6. Creating the Help Page in ASP.NET Web API

    Introduction In this article we will define the process of creating the help page in the ASP .NET We ...

  7. linux安装rzsz(lrzsz)

    lrzsz是一个unix通信套件提供的,X,Y和ZModem文件传输协议,可以用在Windows与linux系统之间的文件传输,体积小速度快,可以与xshell工具配合使用. (1)在线安装 yum ...

  8. 【Android】6.1 Toast(信息提示框)

    分类:C#.Android.VS2015: 创建日期:2016-02-08 一.简介 Toast用于向用户显示一些帮助或者提示信息.前面我们已经多次用到它,这里只是系统地将其总结一下,并演示它的各种基 ...

  9. 【HBase】Rowkey设计【转】

    本章将深入介绍由HBase的存储架构在设计上带来的影响.如何设计表.row key.column等等,尽可能地使用到HBase存储上的优势. Key设计 HBase有两个基础的主键结构:row key ...

  10. Windows进程间各种通信方式浅谈

    1 Windows进程间通信的各种方法 进程是装入内存并准备执行的程序,每个进程都有私有的虚拟地址空间,由代码.数据以及它可利用的系统资源(如文件.管道等)组成. 多进程/多线程是Windows操作系 ...