首页 web前端 js教程 页面装载js及性能分析方法介绍_javascript技巧

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

May 16, 2016 pm 04:54 PM
性能分析

一、装载

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

本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

热AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover

AI Clothes Remover

用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool

Undress AI Tool

免费脱衣服图片

Clothoff.io

Clothoff.io

AI脱衣机

AI Hentai Generator

AI Hentai Generator

免费生成ai无尽的。

热门文章

R.E.P.O.能量晶体解释及其做什么(黄色晶体)
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O.最佳图形设置
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌
威尔R.E.P.O.有交叉游戏吗?
1 个月前 By 尊渡假赌尊渡假赌尊渡假赌

热工具

记事本++7.3.1

记事本++7.3.1

好用且免费的代码编辑器

SublimeText3汉化版

SublimeText3汉化版

中文版,非常好用

禅工作室 13.0.1

禅工作室 13.0.1

功能强大的PHP集成开发环境

Dreamweaver CS6

Dreamweaver CS6

视觉化网页开发工具

SublimeText3 Mac版

SublimeText3 Mac版

神级代码编辑软件(SublimeText3)

麒麟8000与骁龙处理器性能分析:细数强弱对比 麒麟8000与骁龙处理器性能分析:细数强弱对比 Mar 24, 2024 pm 06:09 PM

麒麟8000与骁龙处理器性能分析:细数强弱对比随着智能手机的普及和功能不断增强,处理器作为手机的核心组件也备受关注。目前市场上最为常见且性能出色的处理器品牌之一就是华为的麒麟系列和高通的骁龙系列。本文将围绕麒麟8000和骁龙处理器展开性能分析,探讨两者在各方面的强弱对比。首先,让我们来了解一下麒麟8000处理器。作为华为公司最新推出的旗舰处理器,麒麟8000

性能对比:Go语言与C语言的速度和效率 性能对比:Go语言与C语言的速度和效率 Mar 10, 2024 pm 02:30 PM

性能对比:Go语言与C语言的速度和效率在计算机编程领域,性能一直是开发者们关注的重要指标。在选择编程语言时,开发者通常会关注其速度和效率。Go语言和C语言作为两种流行的编程语言,被广泛用于系统级编程和高性能应用。本文将对比Go语言和C语言在速度和效率方面的表现,并通过具体的代码示例来展示它们之间的差异。首先,我们来看一下Go语言和C语言的概况。Go语言是由G

如何使用php扩展XDebug进行强大的调试和性能分析 如何使用php扩展XDebug进行强大的调试和性能分析 Jul 28, 2023 pm 07:45 PM

如何使用PHP扩展Xdebug进行强大的调试和性能分析引言:在开发PHP应用程序的过程中,调试和性能分析是必不可少的环节。而Xdebug是PHP开发者常用的一款强大的调试工具,它提供了一系列高级功能,如断点调试、变量跟踪、性能分析等。本文将介绍如何使用Xdebug进行强大的调试和性能分析,以及一些实用的技巧和注意事项。一、安装Xdebug在开始使用Xdebu

如何进行C++代码的性能分析? 如何进行C++代码的性能分析? Nov 02, 2023 pm 02:36 PM

如何进行C++代码的性能分析?在开发C++程序时,性能是一个重要的考量因素。优化代码的性能可以提高程序的运行速度和效率。然而,想要优化代码,首先需要了解它的性能瓶颈在哪里。而要找到性能瓶颈,首先需要进行代码的性能分析。本文将介绍一些常用的C++代码性能分析工具和技术,帮助开发者找到代码中的性能瓶颈,以便进行优化。使用Profiling工具Profiling工

对Java Queue队列性能的分析和优化策略 对Java Queue队列性能的分析和优化策略 Jan 09, 2024 pm 05:02 PM

JavaQueue队列的性能分析与优化策略摘要:队列(Queue)是在Java中常用的数据结构之一,广泛应用于各种场景中。本文将从性能分析和优化策略两个方面来探讨JavaQueue队列的性能问题,并给出具体的代码示例。引言队列是一种先进先出(FIFO)的数据结构,可用于实现生产者-消费者模式、线程池任务队列等场景。Java提供了多种队列的实现,例如Arr

C++开发建议:如何进行C++代码的性能分析 C++开发建议:如何进行C++代码的性能分析 Nov 22, 2023 pm 08:25 PM

作为一名C++开发人员,性能优化是我们不可避免的任务之一。为了提高代码的执行效率和响应速度,我们需要了解C++代码的性能分析方法,以便更好地调试和优化代码。在本文中,我们将为您介绍一些常用的C++代码性能分析工具和技术。编译选项C++编译器提供了一些编译选项,可以用于优化代码的执行效率。其中,最常用的选项为-O,它可以告诉编译器进行代码优化。通常,我们会设置

JavaScript中的代码优化和性能分析的工具和技巧 JavaScript中的代码优化和性能分析的工具和技巧 Jun 16, 2023 pm 12:34 PM

随着互联网技术的飞速发展,JavaScript作为一门广泛使用的前端语言,也越来越受到重视。然而,在处理大量数据或是复杂逻辑的时候,JavaScript的性能就会受到影响。为了解决这个问题,我们需要掌握一些代码优化和性能分析的工具和技巧。本文将为大家介绍一些常用的JavaScript代码优化和性能分析工具以及技巧。一、代码优化避免全局变量:全局变量会占用更多

如何使用性能分析工具对 Java 函数进行分析和优化? 如何使用性能分析工具对 Java 函数进行分析和优化? Apr 29, 2024 pm 03:15 PM

Java性能分析工具可用于分析和优化Java函数的性能。选择性能分析工具:JVisualVM、VisualVM、JavaFlightRecorder(JFR)等。配置性能分析工具:设置采样率、启用事件。执行函数并收集数据:在启用分析工具后执行函数。分析性能数据:识别CPU使用率、内存使用率、执行时间、热点等瓶颈指标。优化函数:使用优化算法、重构代码、使用缓存等技术提高效率。

See all articles