关于jquery性能最佳实践的讨论,与求教


Posted in Javascript onMarch 30, 2012

原因是我在测试的时候:带入了错误的变量。具体可以查看图片上的 $(parentID > childClass) 我直接比较两个字符换大小了!
感谢 html5中文网 QQ群中的 “不见丘比特”。

其中第三点提到父元素与子元素的关系中提到了 从父元素选择子元素的用例:

 $('.child', $parent) 
$parent.find('.child') 

$parent.children('.child') 

$('#parent > .child') 

$('#parent .child') 

$('.child', $('#parent'))

在其所给的测试用例中 确实是使用jquery的find方法最快,但是稍作修改却得到了另外的一个结果$('#parent > .child')完胜。

在作者的用例中只是直接缓存了对象 $('#parent');但是当我们把dom的id和class属性作为常量定义并传入测试用例中的时候就出现我说的另外一个结果。
作者原生测试页面:http://jsperf.com/bell-selector
结果截图:
关于jquery性能最佳实践的讨论,与求教
修改后的测试页面:http://jsperf.com/bell-selector/2
结果截图:
关于jquery性能最佳实践的讨论,与求教

同时给我我从真实环境中取出来的一块代码段所做的测试,同样也是$('#parent > .child')这样的写法最快。
测试页面:http://jsperf.com/findchildren
结果截图:
关于jquery性能最佳实践的讨论,与求教
从以上结果截图中可以看到,我给出的两个测试结果明显是使用了大于号选择符的那个性能做好。

请各位看到此文或者了解详情的能给一个说明。关于文章中的其它内容都是比较好的观点。
文章:https://3water.com/article/28056.htm

园子中那位有时间和条件的可以对以上各个操作做一次调试,给出详细的流程说明。我要等到手中的项目做完才有时间来调试这个过程。

Javascript 相关文章推荐
angularjs的一些优化小技巧
Dec 06 Javascript
直接拿来用的页面跳转进度条JS实现
Jan 06 Javascript
简单介绍jsonp 使用小结
Jan 27 Javascript
vue增删改查的简单操作
Jul 15 Javascript
jquery.uploadView 实现图片预览上传功能
Aug 10 jQuery
基于vue.js路由参数的实例讲解——简单易懂
Sep 07 Javascript
详解动画插件wow.js的使用方法
Sep 13 Javascript
基于vue-cli创建的项目的目录结构及说明介绍
Nov 23 Javascript
微信小程序:数据存储、传值、取值详解
May 07 Javascript
js动态获取时间的方法分析
Aug 02 Javascript
node 标准输入流和输出流代码实例
Sep 19 Javascript
vue实现移动端图片上传功能
Dec 23 Javascript
从面试题学习Javascript 面向对象(创建对象)
Mar 30 #Javascript
jQuery 自定义函数写法分享
Mar 30 #Javascript
一个JQuery操作Table的代码分享
Mar 30 #Javascript
javascript工具库代码
Mar 29 #Javascript
Web开发之JavaScript
Mar 29 #Javascript
CodeMirror2 IE7/IE8 下面未知运行时错误的解决方法
Mar 29 #Javascript
javascript对talbe进行动态添加、删除、验证实现代码
Mar 29 #Javascript
You might like
漫威DC即将合作联动,而双方早已经秘密开始
2020/04/09 欧美动漫
PHP最常用的2种设计模式工厂模式和单例模式介绍
2012/08/14 PHP
php5.2 Json不能正确处理中文、GB编码的解决方法
2014/03/28 PHP
PHP中file_get_contents高?用法实例
2014/09/24 PHP
详解php与ethereum客户端交互
2018/04/28 PHP
thinkPHP5框架中widget的功能与用法详解
2018/06/11 PHP
用正则获取指定路径文件的名称
2007/02/27 Javascript
js鼠标左右键 键盘值小结
2010/06/11 Javascript
js判断鼠标左、中、右键哪个被点击的方法
2015/01/27 Javascript
JavaScript数据类型之基本类型和引用类型的值
2015/04/01 Javascript
require.js配合插件text.js实现最简单的单页应用程序
2016/07/12 Javascript
JS+CSS实现下拉刷新/上拉加载插件
2017/03/31 Javascript
JS遍历DOM文档树的方法实例详解
2018/04/03 Javascript
通过图带你深入了解vue的响应式原理
2019/06/21 Javascript
通过实例了解JS执行上下文运行原理
2020/06/17 Javascript
vue npm install 安装某个指定的版本操作
2020/08/11 Javascript
Vue中关闭弹窗组件时销毁并隐藏操作
2020/09/01 Javascript
前端vue+elementUI如何实现记住密码功能
2020/09/20 Javascript
零基础写python爬虫之爬虫编写全记录
2014/11/06 Python
python数据结构之图深度优先和广度优先实例详解
2015/07/08 Python
如何在Python函数执行前后增加额外的行为
2016/10/20 Python
Python模糊查询本地文件夹去除文件后缀的实例(7行代码)
2017/11/09 Python
Python3.6笔记之将程序运行结果输出到文件的方法
2018/04/22 Python
学生信息管理系统Python面向对象版
2019/01/30 Python
Python中文编码知识点
2019/02/18 Python
详解Python流程控制语句
2020/10/28 Python
python反编译教程之2048小游戏实例
2021/03/03 Python
纯HTML5+CSS3制作生日蛋糕(代码易懂)
2016/11/16 HTML / CSS
什么是Rollback Segment
2013/04/22 面试题
10的分与合教学反思
2014/04/30 职场文书
承诺书格式
2014/06/03 职场文书
2015年度优秀员工自荐书
2015/03/06 职场文书
幼儿园六一儿童节主持词
2015/06/30 职场文书
2016应届毕业生实习评语
2015/12/01 职场文书
餐厅如何利用“营销策略”扭转亏本局面
2019/10/15 职场文书
nginx部署多前端项目的几种方法
2021/05/25 Servers