原文地址:http://www.cnblogs.com/zhenn/archive/2011/02/20/1959186.html
很多的web开发人员都使用Mozilla firefox并且绝大多数都使用firebug来测试、调试前端代码,firebug在调试html+css方面的能力是毋庸置疑的,但仅仅使用它来完成这样的任务并没有发挥firebug的巨大潜能。
JavaScript性能
随着web apps越来越庞大,JavaScript的性能也被推到风头浪尖,在此之前或许你已经知道哪些操作会减缓JavaScript程序运行速度,并且养成良好的编码习惯。
正如你所知道的,使用appendChild来增加Dom节点的效率要比innerHTML低下,那么为什么会这样呢?又如何验证这个观点的正确性?还有我最近发现的,在声明数组的时,应该使用数组直接量:
而不是:
但是我所说的,也未必是正确的吧!
console.profile()
这是firebug中一个很强大的方法,它可以提供给你测试代码片段执行的时间和一些性能分析数据,前提是测试的代码片段中要有function的执行,否则会提示“无任何可记录的活动”,如下图:
一个简单的测试例子:
01 |
function createArray1(){
|
02 |
for ( var i=0;i<100000;i++){
|
06 |
function createArray2(){
|
07 |
for ( var i=0;i<100000;i++){
|
13 |
console.profileEnd( 'a' );
|
17 |
console.profileEnd( 'b' );
|
直观的数据:
console.time()
由于createArray1和createArray2内部并没有执行其他的function,所以从上图中,我们仅仅能够得到测试代码片段执行所需的时间,如果基于仅满足这个需求,通过console.time()就完全可以实现了。
综合的数据分析
我们从不期盼某款浏览器,在运行自己编写程序的时候崩溃或者速度缓慢的让人抓狂,不过真的遇到了,还是应该先找到影响代码执行效率的问题所在,然后 才能针对某个算法做一些优化处理来减少JavaScript解释器的运算压力,加速程序运行。这正是profile的用武之地,透析firebug的数据 图,能让我们快速定位到测试代码执行全过程中,哪个function调用次数最多,耗时最多,从这个function的算法和各个细节入手,就可以迅速解 决问题。
最后附上一个例子:
2 |
var No = that.getBetNo();
|
3 |
console.profileEnd( 'a' );
|
更加丰满的数据:
完
分享到:
相关推荐
firebug.2.0.17.tar.gz是firefox调试插件,用于调试web的脚本
httpwatch与firebug.
Packtpub.Firebug.1.5.Editing.Debugging.and.Monitoring.Web.Pages.Apr.2010.rar
前端开发感觉F12调试模式不好用?不如试试firebug火狐浏览器插件,简单易用还好看
Monitor, edit, and remove cookies from Firebug. Approach Get to grips with a new technology, understand what it is and what it can do for you, and then get to work with the most important features ...
初识Firebug.pdf
火狐的debug,调试工具。操作步骤https://blog.csdn.net/super_DuoLa/article/details/84317556
不用安装,直接在需要调试的页面地址粘贴代码就能调用
WEB调试工具---Firebug.txt 前端必备技能,助你快速掌握
前端开发神奇firebug使用文档,console的各种用法大全
我开发调试浏览器时用到的集合。用来分析网页代码、脚本执行信息、调试脚本、分析浏览器下载获取网络资源的各种工具。很强大。
萤火虫.io 状态:开发 该项目包含操作所需的一切 ... # Add to ../firebug.io.profile.json` { "services": { "1-io.pinf": { "io.pinf.server.auth": { "config": { "passport": { "github": {
firebug从firebug-1.7.3到firebug-1.12.7-fx.xpi各个版本安装包,适用于火狐50以下各个版本
火狐网页调试必备, 火狐firebug-1.8.3.xpi.
Firefox_50.0.2.6177和firebug安装包
最新 火狐 调试工具 firebug 1.8.0 xpi 适用于火狐4.0版本以上的浏览器 现在火狐出了5.0,我没有试,不知道5.0能不能用
旧版火狐浏览器不能在里面自行添加组件,需要从文件或者,这个是特意为火狐48以下版本准备的firebug,下载后从浏览器组件页面选择从本地安装即可,方便实用
Firebug已经不被新版本Firefox支持了,对于熟悉Firefox+Firebug调试程序的码农来说,这是不好找到的资源。
7.0.1Firefox & FireBug
网页开发FireFox插件 Firebug ,Firebug是Firefox下的一款开发类插件,现属于Firefox的 五星级强力推荐插件之一。它...