30个提高Web程序执行效率的好经验分享

  1. 尽量避免使用DOM。当需要反复使用DOM时，先把对DOM的引用存到JavaScript本地变量里再使用。使用设置innerHTML的方法来替换document.createElement/appendChild()方 法。
  2. eval()有问题，new Fuction()构造函数也是，尽量避免使用它们。
  3. 拒绝使用with语句。 它会导致当你引用这个变量时去额外的搜索这样的一个命名空间，with里的代码在编译时期是完全未知的。
  4. 使用for()循环替代for…in循 环。因为for…in循环在开始循环之前需要Script引擎创建一个含有所有可循环属性的 List，需要多检查一次。
  5. 把try-catch语句放在循环外面，不要放在循环里面，因为异常是很少发生的，放在外面避免每次都要执行 它们。
  6. 甚至圣经里都提到过这个 – 不要全局的。全局变量的生命周期贯穿整个脚本的生命周期，而本地变量的存在范围随着本地命名空间的销毁而消失。当在函数或其它地方引用一个全局变量时，脚 本引擎需要搜索整个全局命名空间。
  7. fullName += 'John'; fullName += 'Holdings';执行速度快于fullName += 'John' + 'Holdings';
  8. 如果你需要把多个字符串连接起来，最好是把他们做成一个数组，然后调用join()方法实现这个操作。这种方式在生成HTML片段时尤其 有效。
  9. 对于简单的任务，最好使用基本操作方式来实现，而不是使用函数调用实现。例如val1 < val2 ? val1 : val2;执行速度快于Math.min(val1, val2);，类似的，myArr.push(newEle);慢于myArr[myArr.length] = newEle;
  10. 将函数的引用作为参数传递到setTimeout()和setInterval()里优于将函数名作为字符串参数传递（硬编码）。例如，setTimeout(“someFunc()”, 1000)执行效率慢于setTimeout(someFunc, 1000)
  11. 当进行遍历操作时避免使用DOM操作。通过像getElementsByTagName()这 种方法得到的DOM元素队列都是动态的；有可能在你还没有对它遍历完成时，它已经被改变。这有可能导致死循环。
  12. 当你对对象的成员（属性或方法）进行反复操作时，先存储对它们的引用。例如var getTags = document.getElementsByTagName; getTags(‘div');
  13. 在任何的代码段里，在局部变量范围外存放一个这个局部变量的引用。例如
    function foo(arr) {
    var a = ‘something';

    //变量 ‘a' 对于下面的一段就是范围外变量,这个变量的引用在很多情况下会有用处。
    for (var i = 0, j = a, loopLen = arr.length; i < loopLen; i++) {
    //do something
    }
    }

  14. for(var i=0; i < someArray.length; i++) {…}的执行效率慢于for (var i=0, loopLen=someArray.length; i<loopLen; i++) {…}。
  15. 在HTTP头信息里加入缓存控制过期和最大存活时间标记。
  16. 优化CSS。要使用<link>方式，而不要使用@import方式。请参考这个优秀的文档http://www.slideshare.net/stubbornella/object-oriented-css
  17. 使用CSS技术来优化图片资源
  18. 用GZip方式压缩 .js 和 .css 文件。如果你使用的是Apache，在 .htaccess 里设置压缩方式，你的HTML, XML 和 JSON 也同时会被压缩。
    AddOutputFilterByType DEFLATE text/html text/css text/plain text/xml application/x-javascript application/json
  19. 使用JavaScript压缩工具。除了使用YUI和JSMin外，你还可以试一试Google Closure http://closure-compiler.appspot.com/home (感谢: James Westgate, 一位读者)
  20. 优化每个页面上的各种资源，把它们拆分到各个子域上，这么它们就能够并行下载。请参考http://yuiblog.com/blog/2007/04/11/performance-research-part-4/
  21. 将CSS样式表放在页面的最顶端，这样能方便包括IE在内的浏览器进行解析。
  22. 尽量将DOM结构保持的越简单越好。DOM的体积会影响相关的操作效率，像查找， 遍历，DOM改动都有影响。document.getElementsByTagName(‘*').length这 个值越小越好。
  23. 注意你使用的选择器。例如，如果你想获取一个ul下的直接子元素，使用jQuery(“ul > li”)而不要使用jQuery(“ul li”)
  24. 当切换元素的可见性时(display),请记住：element.css({display:none})的 速度快于element.hide() 和 element.addClass(‘myHiddenClass')。 除非在一个循环里，我选择element.addClass(‘myHiddenClass')， 这样会使代码更简洁 – 不要使用 inline CSS 和 JavaScript。
  25. 当你使用完对DOM的引用变量后，要把它置为NULL。
  26. 使用AJAX时，GET的执行效率高于POST。所以要尽量使用 GET 方式。只是要注意一点，IE只允许你用GET传送2K的数据。
  27. 小心使用脚本动画。没有硬件的支持，动画会执行的很慢。尽量避免使用那些没有实际价值的动画效果。
  28. 如果你的background-image对于这个图片的容器太小的话，请避免使 用background-repeat。如果你的背景图片需要来回填充很多次才能充满背景，那么将background-repeat属性设置成background-image 和repeat-x 或 repeat-y来 达到填充背景的效果的做法是不明智的，这种填充方式的效率特别的低。你应该尝试使用一个足够大的图片来做background-image并 且使用background-repeat: no-repeat。
  29. 布局时不要使用<table>。 <table>在浏览器完全把它画出来之前需要反复绘制好几次。因为DOM中<table>是很少见的一种之后输出的会影响之前输出的显示效果的元素。对于表格数据来说，你可 以使用table-layout:fixed; 这是一种更有效的现实算法，根据CSS 2.1技术说明，这种写法可以让表格一行一行的输出。
  30. 尽可能的使用原始JavaScript。限制JavaScript框架的使用。

赞 (0)

相关推荐

  • 30个提高Web程序执行效率的好经验分享

    尽量避免使用DOM.当需要反复使用DOM时,先把对DOM的引用存到JavaScript本地变量里再使用.使用设置innerHTML的方法来替换document.createElement/appendChild()方 法. eval()有问题,new Fuction()构造函数也是,尽量避免使用它们. 拒绝使用with语句. 它会导致当你引用这个变量时去额外的搜索这样的一个命名空间,with里的代码在编译时期是完全未知的. 使用for()循环替代for-in循 环.因为for-in循环在开始循环

  • 提高ASP页面执行效率的方法分析

    这些大都是与硬件相关.其实在软件上,好的程序设计的方法和正确的参数配置也可以提高程序的性能,有时 在同等情况下只要改变一个参数,程序执行效率就能大大提高.本文就试着在这方面做些探索. 一.影响性能的因素 ASP程序运行的性能主要决定于以下2个大方面: 1.HTML页面的执行效率 2.反应时间,其中反应时间主要受制于下面要素: (1).ASP页面的执行效率 (2).数据库因素 下面我们就来详细讨论一下. 二.详细讨论 1.影响HTML的因素 HTML页面的执行效率是一个纯客户端的问题.影响这个问题

  • 教你用Type Hint提高Python程序开发效率

    简介 Type Hint(或者叫做PEP-484)提供了一种针对Python程序的类型标注标准. 为什么使用Type Hint?对于动态语言而言,常常出现的情况是当你写了一段代码后,隔段时间你可能忘记这个方法的原型是什么样子的了,你也不清楚具体应该传入什么类型的参数,这样往往需要你去阅读代码才能定义每个类型具体是什么.或者当你使用一个文档并不是特别完全的第三方库,你不知道这个库应该如何使用,这都会很痛苦. 现在,借助Type Hint,你可以实现: 1.实现类型检查,防止运行时出现的类型不符合情

  • 提高SQL的执行效率的ASP的五种做法

    [b]方法一.尽量使用复杂的SQL来代替简单的一堆SQL[/b] 同样的事务,一个复杂的SQL完成的效率高于一堆简单SQL完成的效率,有多个查询时,要善于使用JOIN. oRs=oConn.Execute("Select * FROM Books")  while not ors.Eof      strSQL = "Select * FROM Authors Where AuthorID="&oRs("AuthorID") ors2=o

  • 利用函数的惰性载入提高javascript代码执行效率

    在 javascript 代码中,因为各浏览器之间的行为的差异,我们经常会在函数中包含了大量的 if 语句,以检查浏览器特性,解决不同浏览器的兼容问题. 例如,我们最常见的为 dom 节点添加事件的函数: 复制代码 代码如下: function addEvent (type, element, fun) { if (element.addEventListener) { element.addEventListener(type, fun, false); } else if(element.a

  • 提高JavaScript执行效率的23个实用技巧

    本文向大家分享23种JavaScript提高执行效率的小技巧.最佳实践等非常实用的内容.当然JavaScript的实用技巧不止这些,还有很多即好玩又能提高程序运行效率的技巧,以后我们会继续分享给大家. 文中所提供的代码片段都已经过最新版的Chrome 30测试,该浏览器使用V8 JavaScript引擎(V8 3.20.17.15). 1.使用逻辑符号&&或者||进行条件判断 var foo = 10; foo == 10 && doSomething(); // 如果 f

  • 有效提高JavaScript执行效率的几点知识

    有效提高JavaScript执行效率的几点知识

    为了提供新鲜.别致的用户体验,很多网站都会使用 JavaScript 来改善设计.验证表单.检查浏览器,以及Ajax请求,cookie操作等等,实现无刷新动态效果 .但是,要将大量内容在浏览器呈现,如果处理不好,网站性能将会急剧下降.所以我们有必要了解下,如何提高JavaScript的执行效率. JavaScript 函数 在JavaScript 中,函数在使用前会预编译.尽管有些时候下可以使用字符串代替函数,但是每次执行这段JavaScript 代码时都会重新解析,影响性能. 1.eval例子

  • SQL Server并行操作优化避免并行操作被抑制而影响SQL的执行效率

    SQL Server并行操作优化避免并行操作被抑制而影响SQL的执行效率

    为什么我也要说SQL Server的并行: 这几天园子里写关于SQL Server并行的文章很多,不管怎么样,都让人对并行操作有了更深刻的认识. 我想说的是:尽管并行操作可能(并不是一定)存在这样或者那样的问题,但是我们不能否认并行,仍然要利用好并行. 但是,实际开发中,某些SQL语句的写法会导致用不到并行,从而影响到SQL的执行效率 所以,本文要表达的是:我们要利用好并行,不要让一些SQL的写法问题"抑制"了并行,让我们享受不了并行带来的快感 关于SQL Server的并行: 所谓的

  • 分享50个提高PHP执行效率的技巧

    1.用单引号代替双引号来包含字符串,这样做会更快一些.因为PHP会在双引号包围的字符串中搜寻变量, 单引号则不会,注意:只有echo能这么做,它是一种可以把多个字符串当作参数的"函数"(译注:PHP手册中说echo是语言结构,不是真正的函数,故 把函数加上了双引号). 2.如果能将类的方法定义成static,就尽量定义成static,它的速度会提升将近4倍. 3.$row['id'] 的速度是$row[id]的7倍. 4.echo 比 print 快,并且使用echo的多重参数(译注:

  • 使用php数据缓存技术提高执行效率

    目录 PHP 缓存介绍 什么是缓存 缓存作用 常用缓存类型 PHP 常用内存缓存介绍 php opcode缓存 php文件缓存 为什么要使用php缓存技术?理由很简单:提高效率.在程序开发中,获取信息的方式主要是查询数据库,除此以外,也可能是通过Web Services或者别的某种方法,无论哪种方法,在大量的并发访问面前,它们都可能成为效率的瓶颈,为了解决这些问题,人们提出了很多解决方案,其中一些是利用优化软件(如:APC,Eaccelerator,Zend Optimizer等等)来提高程序的

随机推荐