无意间看到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倍。

http://www.cnblogs.com/huyh/archive/2009/03/30/1422976.html#tip1

jquery优化引发的思考的更多相关文章

  1. 解决一道leetcode算法题的曲折过程及引发的思考

    写在前面 本题实际解题过程是 从 40秒 --> 24秒 -->1.5秒 --> 715ms --> 320ms --> 48ms --> 36ms --> ...

  2. 新手必看的jQuery优化笔记十则

    jQuery优化 1.简介 jQuery正在成为Web开发人员首选的JavaScript库,作为Web开发者,除了要了解语言和框架的应用技巧外,如何提升语言本身的性能也是开发人员应该思考的问题.文章就 ...

  3. 曲演杂坛--一条DELETE引发的思考

    原文:曲演杂坛--一条DELETE引发的思考 场景介绍: 我们有一张表,专门用来生成自增ID供业务使用,表结构如下: CREATE TABLE TB001 ( ID ,) PRIMARY KEY, D ...

  4. Spring之LoadTimeWeaver——一个需求引发的思考---转

    原文地址:http://www.myexception.cn/software-architecture-design/602651.html Spring之LoadTimeWeaver——一个需求引 ...

  5. 由SecureCRT引发的思考和学习

    由SecureCRT引发的思考和学习 http://mp.weixin.qq.com/s?__biz=MzAxOTAzMDEwMA==&mid=2652500597&idx=1& ...

  6. 【思考】由安装zabbix至排障php一系列引发的思考

    [思考]由安装zabbix至排障php一系列引发的思考 linux的知识点林立众多,很有可能你在排查一个故障的时候就得用到另一门技术的知识: 由于linux本身的应用依赖的库和其它环境环环相扣,但又没 ...

  7. 由<a href = "#" > 引发的思考

    原文:由<a href = "#" > 引发的思考 前阵子在一个移动项目中,通过 <a href = "#" >  的方式 绑定clic ...

  8. class_copyIvarList方法获取实例变量问题引发的思考

    在runtime.h中,你可以通过其中的一个方法来获取实例变量,那就是class_copyIvarList方法,具体的实现如下: - (NSArray *)ivarArray:(Class)cls { ...

  9. 由一个emoji引发的思考

    由一个emoji引发的思考 从毕业以来,基本就一直在做移动端,但是一直就关于移动端的开发,各种适配问题的解决,在日常搬砖中处理了就过了,也没有把东西都沉淀下来,觉得甚是寒颜.现就一个小bug,让我们来 ...

随机推荐

  1. hadoop之mapreduse 在Eclipse下的调试环境篇

    搭建完毕环境后,開始调试mapreduse程序. 可是遇到不停的报错.本人非常讨厌在自己的操作系统环境变量里设置来设置去,包含linux也是. 通常喜欢把设置环境变量在启动程序的脚本中.让脚本自己执行 ...

  2. 微信jssdk获取当前位置,以及打开微信地图

    $(function() { var url = window.location.href; var userId = $("#userId").val(); // var ope ...

  3. C#实现在线更新系统

    先来看一下程序完成后长什么样. 这个是程序的组成部分. 主要功能是在InitializationUpdate这个类中完成的,From1主要起到调用的作用,所以重心还是在InitializationUp ...

  4. 跨平台渲染框架尝试 - constant buffer的管理

    1. Preface Constant buffer是我们在编写shader的时候,打交道最多的一种buffer resource了.constant表明了constant buffer中的数据,在一 ...

  5. (转) 学习C++ -> 指针初步

    学习C++ -> 指针初步 一.指针    1. 什么是指针?        我们知道, 计算机的内存是由一个个独立的存储单元组成, 并且系统会对每一个存储单元分配一个唯一的号码, 称为这个存储 ...

  6. Windows I/O模型之一:Select模型

    1.概念理解 在进行网络编程时,我们常常见到同步(Sync)/异步(Async),阻塞(Block)/非阻塞(Unblock) 四种调用模式: 同步:所谓同步,就是在发出一个功能调用时,在没有得到结果 ...

  7. js 函数声明与函数表达式

      1,变量包括全局变量和局部变量,局部变量只能在函数内部访问.如果函数传参和全局变量一样的话,即使是给全局变量赋值,这里会把全局变量当成局部变量的. 如: 1: var x='x'; 2:   3: ...

  8. QT中的OpcDa 客户端 实现

    前段时间开发Windows下的设备端软件接触到了OPC DA,虽然现在有了更强大的OPC UA,但是为了兼容一些老的设备,不得不硬着头皮去啃这个老掉牙的已经过时了的技术.本来只是想粗略了解一下,简单写 ...

  9. NAS4Free 配置BT下载

    NAS4Free 9.3.0.2 开启BT下载功能 Services|BitTorrent 选中右上角的复选框 Peer port 是监听端口,用于接受外部连接,需要在路由器配置该端口到服务器,才能提 ...

  10. 傻瓜式硬盘重装win7系统图文加视频教程

    标准适用环境: win7系统还能用,但是想重装win7系统.[当然win7进不去也可以在PE进行] 其它 需要工具: win7 ISO镜像                          | [ w ...