欢迎访问畅维网络官网,我们将为您提供专业的网站建设服务!
咨询电话:0531-88162305 QQ:点击这里给我发消息
当前位置:首页 > 网站学院 > 网站技术

在网站制作中高性能JavaScript编写注意五点

本文主要讲解进行高性能js开发时需要注意的几点。
使用事件代理

有时候我们会感觉到页面反应迟钝,这是因为DOM树元素中附加了过多的事件句柄并且些事件句病被频繁地触发。这就是为什么说使用事件代理是一种好方法了。如果你在一个div中有10个按钮,你只需要在div上附加一次事件句柄就可以了,而不用去为每一个按钮增加一个句柄。事件冒泡时你可以捕捉到事件并判断出是哪个事件发出的。

缓存选择器查询结果

选择器查询是开销很大的方法。所以,使用选择器的次数应该越少越好,并且尽可能缓存选中的结果,便于以后反复使用。比如,下面这样的写法就是糟糕的写法:jQuery('#top').find('p.classA');jQuery('#top').find('p.classB');


更好的写法是:var cached = jQuery('#top'); cached.find('p.classA'); cached.find('p.classB');

避免频繁的IO操作


使用JavaScript访问cookie或localStorage是比较慢,因此为了提升性能,应尽量少对cookie或localStorage进行操作。

避免频繁的DOM操作

使用JavaScript访问DOM元素是比较慢的,因此为了提升性能,应该做到:

  • 缓存已经查询过的元素;

  • 线下更新完节点之后再将它们添加到文档树中;

  • 避免使用JavaScript来修改页面布局;

使用微类库

通常开发者都会使用JavaScript类库,如jQuery、Mootools、YUI、Dojo等,但是开发者往往只是使用JavaScript类库中的部分功能。为了更大的提升性能,应尽量避免使用这类大而全的类库,而是按需使用微类库来辅助开发。

(编辑:济南网站建设、济南网站建设公司:畅维网络)

鲁公网安备 37010502000788号

  • 扫一扫,关注微信公众号