缓存jQuery对象来提高性能
jQuery使元素的选择变得异常简单,这也是它快速流行起来的一大原因,如果你看刚刚开始使用jQuery朋友写的代码时,会发现很多数人写的代码都在滥用jQuery选择器。 如果你发现同一元素被查找多次时,你就应该将该jQuery对象缓存起来,不然每次查找都要遍历整个文档。这个话题可能显得有点老生常谈,因为这几天写的东西都和调试jQuery代码有关系,所以将这个问题再次说明一下。关于在控制台中打印程序执行时间大家可以参考下使用 console.time() 计算jQuery代码执行时间,我们使用下边的代码做个简单的测试:
console.time('noSaved');
for (var i = 0; i <; i++) {
$('.no').text(i + ' ');
}
console.timeEnd('noSaved');
console.time('saved');
var the = $('.yes');
for (var i = 0; i < 1000; i++) {
the.text(i + ' ');
}
console.timeEnd('saved');
在chrome下按F12打开控制台,下图是不保存jQuery对象和保存jQuery对象时执行时间的对比,相信通过此图你会开始重视代码的性能。

当我换用较新版本的jQuery测试时发现新版本的jQuery在选择器上性能并没有提高,反而有所下降,大家可以在自己电脑上试试!
作者:jQuery学习
除非注明,jQuery学习网文章均为原创,转载时必须以链接形式标明本文地址。
本文地址:http://www.jquery001.com/cache-jquery-object.html
缓存jQuery对象来提高性能的更多相关文章
- Memcache缓存用好了,性能有了很大的提高
web服务器1 web服务器2 web服务器3如果每台web服务器都向mysql服务器表插入信息并且要做出相应最新编号反馈出现这样的高并发时候怎么减少服务器压力,同时用户体验还要好 可以使用Memca ...
- 设计一个缓存器 ReadLock提高性能
/** * * @描述: 设计一个缓存器 ReadLock提高性能. * @作者: Wnj . * @创建时间: 2017年5月16日 . * @版本: 1.0 . */ public class C ...
- 动手实现 Redux(四):共享结构的对象提高性能
接下来两节某些地方可能会稍微有一点点抽象,但是我会尽可能用简单的方式进行讲解.如果你觉得理解起来有点困难,可以把这几节多读多理解几遍,其实我们一路走来都是符合“逻辑”的,都是发现问题.思考问题.优化代 ...
- jQuery对象数据缓存Cache原理及jQuery.data详解
网上有很多教你怎么使用jQuery.data(..)来实现数据缓存,但有两个用户经常使用的data([key],[value])和jQuery.data(element,[key],[value])几 ...
- jQuery.buildFragment源码分析以及在构造jQuery对象的作用
这个方法在jQuery源码中比较靠后的位置出现,主要用于两处.1是构造jQuery对象的时候使用 2.是为DOM操作提供底层支持,这也就是为什么先学习它的原因.之前的随笔已经分析过jQuery的构造函 ...
- JQuery常用功能的性能优化
使用最佳选择器 通常比较常用的选择器有以下几个: 1.ID选择器 $("#id") 2.标签选择器 $("td") 3.类选择器 $(".target ...
- ASP.NET MVC之如何看待内置配置来提高性能优化(四)
前言 前几篇我们比较基础的讲了下MVC中的知识,这一节我们穿插点知识,讲讲MVC中我们可以提高性能的办法. Razor视图引擎优化(优化一) 我们知道默认情况下配置MVC去解析一个视图会首先约定通过查 ...
- Java编程提高性能时需注意的地方
1.尽量在合适的场合使用单例 使用单例可以减轻加载的负担,缩短加载的时间,提高加载的效率,但并不是所有地方都适用于单例,简单来说,单例主要适用于以下三个方面 第一,控制资源的使用,通过线程同步来控制资 ...
- 读<jquery 权威指南>[7]-性能优化与最佳实践
一.优化选择器执行速度 1. 优先使用ID选择器和标记选择器 使用选择器时应该首选ID选择器($("#id")),其次是标记选择器($("div")),最后再选 ...
随机推荐
- angular4 监听input框输入值的改变
angular中一般控件会有change事件,但是如果某些控件没有这个事件 我们如何监听值的变化呢? 对于双向绑定的值,当值改变后监听事件有如下写法: 1. 如果是ngModel可以用ngModelC ...
- XV6操作系统代码阅读心得(二):进程
1. 进程的基本概念 从抽象的意义来说,进程是指一个正在运行的程序的实例,而线程是一个CPU指令执行流的最小单位.进程是操作系统资源分配的最小单位,线程是操作系统中调度的最小单位.从实现的角度上讲,X ...
- 对java前后端分离的理解
到目前为止,身为一个java后端开发人员的我, 在工作期间,无非就是ui设计页面,前端开发html,之后将做好的页面交给我,我负责后台逻辑一件html的页面渲染. 好好滴一个后台开发人员,莫名其妙的做 ...
- 使用webgl(three.js)创建3D机房,3D机房微模块详细介绍(升级版二)
序: 上节课已经详细描述了普通机房的实现过程,文章地址(https://www.cnblogs.com/yeyunfei/p/10473021.html) 紧接着上节课的内容 我们这节可来详细讲解机房 ...
- openstack多region配置
实验 A机器 10.64.8.171 RegionOne B机器 10.64.8.142 RegionTwo Keytson(这个组件随便放在哪台都可以) openst ...
- Ubuntu下查看软件版本及安装位置
查看软件版本: XXX --version 或 aptitude show xxx 也可用apt-show-versions (要先安装sudo apt-get install apt-show-ve ...
- Redis学习篇(五)之Set类型及其操作
SADD 作用:向集合中添加元素 语法:SADD key menber [, ...] 添加重复的元素会返回0,失败 SMEMBERS 作用:返回指定集合中的元素 语法: SMEMBERS key S ...
- [MVC4]Data Annotations Extensions:无法使用EmailAddress等验证特性的解决方法
本文地址:http://www.cnblogs.com/egger/p/3404159.html 欢迎转载 ,请保留此链接๑•́ ₃•̀๑! 数据注解(Data Annotations) Web应用 ...
- 注解@Aspect实现AOP功能
springboot中pom引入jar <!-- aop 切面 --> <dependency> <groupId>org.springframework.boot ...
- noip模拟 五子棋
递推+模拟.在读取数据时,我们建4个图,分别代表这个图中横.纵.左斜右斜的连续长度.例如heng[i][j]代表ij这个点所在的横着一条线的长度. 然后搜索,对于一个空点,如果他的上下都>=4那 ...