JavaScript基础教程

JavaScript 对象

JavaScript 函数

JS HTML DOM

JS 浏览器BOM

AJAX 基础教程

JavaScript 参考手册

JavaScript 性能

Web性能是客观的衡量指标,也是加载时间和运行时用户的感知和体验。

Web性能是网站加载,交互和响应所需的时间,以及用户交互过程中内容的平滑程度。

许多功能会影响性能,包括延迟,应用程序大小,DOM节点数,发出的资源请求数,JavaScript性能,CPU负载等。

如何提升Web性能?

减少循环活动

可以放在循环外部的语句 或 赋值将使循环运行更快。

在下面的示例中,每次循环时,我们都访问数组的length属性:

for (let i = 0; i < arr.length; i++) {
测试看看‹/›

在下面的示例中,我们在循环外部访问length属性,并使循环运行更快:

let size = arr.length;
for (let i = 0; i < size; i++) {
测试看看‹/›

提高DOM访问效率

与其他JavaScript语句相比,访问HTML DOM的速度非常慢。

如果需要多次访问DOM元素,请访问一次,并将其用作局部变量。

将JavaScript放在页面底部

将脚本放在页面正文的底部,使浏览器可以首先加载页面。

在下载脚本时,浏览器将不会启动任何其他下载,并且所有解析和渲染活动都可能被阻止。

一种代替方法是在脚本标记中使用defer="true"。该延迟该脚本应的页面后执行属性指定已完成解析,但它仅适用于外部脚本。

不要使用“with”关键字

with关键字被认为是“鸡肋”,因为它存在一些非常令人沮丧的缺陷。

尽管 with简化了处理本地属性的过程,但是使用with会增加在其他作用域中查找变量的开销。

with严格模式下不允许使用关键字。

最少的HTTP请求

通过组合外部文件并将JavaScript直接包含在HTML页面中,从而最小化呈现页面的HTTP请求。

每次唯一的HTTP访问服务器时,都会导致大量延迟。

不要两次使用相同的脚本

重复的脚本将对性能产生重大影响。重复的脚本将在HTTP上创建不必要的请求,尤其是在IE浏览器中。

不要使用eval()

尽管该eval()函数是运行任意代码的好方法,但是传递给eval函数的每个字符串都必须即时进行解析和执行。每次执行到达eval函数调用时,都产生开销。