博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
jquery优化引发的思考
阅读量:5039 次
发布时间:2019-06-12

本文共 673 字,大约阅读时间需要 2 分钟。

无意间看到jquery优化的一个细节让我觉得不可思议记录一下。仅仅只是换个地方代码就能提高数倍的效率,带给我的不是个仅是个小技巧,而是一总编程思想,技术大牛往往是在细节上体现。

通过缓存最小化选择操作

jQuery的选择器棒极了。它们可以在页面上以极其简单的方法找到任何元素,但是在内部它们必须通过大量的步骤才可以实现选择操作,如果你错误的使用它们,那么你可能发现一切都变得相当慢。

如果你一次又一次的选择相同元素(例如在一个循环中),那么你可以一次选择出它并放入内存中,同时你可以在核心内容里操作它。看下面的例子,这里我们利用循环往UL里添加条目:

for (i = 0; i < 1000; i++) {       var myList = $('.myList');       myList.append('This is list item ' + i);   }

这在我的PC上Firefox 3花费了1066毫秒时间(可以设想一下在IE6中的情况!),对JavaScript而言这个操作相当慢。现在让我们来看看下面的代码,这里我们仅使用了一次选择操作:

var myList = $('.myList');     for (i = 0; i < 1000; i++) {       myList.append('This is list item ' + i);   }

仅仅用了224毫秒,通过移动一行代码就快了将近4倍。

转载于:https://www.cnblogs.com/cjl2013/p/3590430.html

你可能感兴趣的文章
关于React中props与state的一知半解
查看>>
java中Hashtable和HashMap的区别(转)
查看>>
关闭数据库
查看>>
webStrom智能提示忽略首字母大小写问题
查看>>
层叠加的五条叠加法则(一)
查看>>
设计模式六大原则(5):迪米特法则
查看>>
对Feature的操作插入添加删除
查看>>
javascript String
查看>>
ecshop 系统信息在哪个页面
查看>>
【转】码云source tree 提交超过100m 为什么大文件推不上去
查看>>
Oracle数据库的增、删、改、查
查看>>
MySql执行分析
查看>>
git使用中的问题
查看>>
yaml文件 .yml
查看>>
linux字符集修改
查看>>
phpcms 添加自定义表单 留言
查看>>
mysql 优化
查看>>
读书笔记 ~ Nmap渗透测试指南
查看>>
WCF 配置文件
查看>>
动态调用WCF服务
查看>>