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方式。
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。
20.优化每个页面上的各种资源,把它们拆分到各个子域上,这么它们就能够并行下载。
21.将CSS样式表放在页面的最顶端,这样能方便包括IE在内的浏览器进行解析。
22.尽量将DOM结构保持的越简单越好。DOM的体积会影响相关的操作效率,像查找, 遍历,DOM改动都有影响。document.getElementsByTagName(’*').length这 个值越小越好。
23.注意你使用的选择器。例如,如果你想获取一个ul下的直接子元素,使用jQuery(”ul > li”)而不要使用jQuery(”ul li”)
24.当切换元素的可见性时(display),请记住:element.css()的 速度快于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框架的使用。
分享到:
相关推荐
尽量避免使用DOM。当需要反复使用DOM时,先把对DOM的引用存到JAVAScript本地变量里再使用。
30个提高Web程序执行效率的好经验分享,需要的朋友可以参考下。
jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序 jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序jsp web程序 jsp web程序jsp web程序...
j2ee web应用程序提高效率文档 非常有用的一个文档 需要的同学可以下载
web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题面试题汇总+前端优化总结 web前端笔试题...
web 网站SEO优化程序,增加网页收录,有的朋友的站放了两天就已经有收录和排名了,值得庆贺。 使用方法:很多人不会操作,这里给大家讲讲怎么使用 根目录下面建一个seo目录,然后吧文件放在seo目录, 然后设置好伪...
普通Web设计师提高SEO技巧 如今,Web设计师在设计Web外观与风格的同时,往往还负责了前端代码的编写。换句话说,SEO的相当一部分责任是落在他们肩上的。然而,大量的Web设计师对SEO的熟悉程度仍不足以让他们写出一...
这篇文章讲述可以帮助 改善优化前端的技术,非常有用。主要内容有清理代码、压缩图片、压缩外部资源、使用CDN,以及一些其它方法。这些方法会为你的网站带显著的速度提升和整体性能提升。 一. 清理 HTML 文档 HTML,...
AJAX异步提高Web应用效率.pdf
Java Web程序设计教程 Java Web程序设计教程
web项目:第一个Servlet程序 Servlet的生命周期:init--service--destroy、执行流程:构造器--init方法--循环[ service方法 ]--destory方法(正常关闭Tomcat)、启动tomcat测试
Java Web程序设计-1期 《Java Web程序设计》_经验技巧.doc 学习资料 复习资料 教学资源
移动Web前端性能优化方案的应用,申冬,陈萍,随着信息化技术快速发展,移动互联网得到迅猛普及,但是移动设备性能参差不齐,移动互联网速度普遍低下,所以移动Web前端性能优化
一个有效实现ASP.NET web applications运行效率更高的程序源代码,采用C#进行开发,提供一个有效提高效率的类库代码,供大家学习!
Web程序设计--ASP.NET实用网站开发课后填空题,是非题,选择题答案
前端优化是Web应用开发的重点之一,通过减小页面请求量、压缩和合并JS和CSS文件、优化图片大小和清晰度等方式来减少页面加载时间和提高用户体验。同时,可以使用浏览器缓存技术来减少页面请求次数,从而提高页面响应...
描述了如何进行基于web的系统优化的方法,主要从系统效率方面着手。
改程序通过web的设计技巧设计出了网上书店的例子,适合学习机使用!
WEB程序设计大作业 实现多个网页的互联功能 界面漂亮 实用
Web客户端端调用带参数的exe可执行程序,js调用的方法