`

IE JavaScript 最佳实践

 
阅读更多
1
使用 var 定义局部变量

2
尽可能缓存变量,查询结果,DOM元素

3
缓存函数值

4
避免使用 with

5
使用 Array 拼接字符串

6
节制eval的使用

7
转换较大的switch为查询

8
不要使用 setter/getter 方法,直接使用变量

9
尽量避免使用闭包

10
使用 document.createDocumentFragment() 创建 DOM

11
使用 cloneNode 代替 createElement

12
使用一次innerHTML赋值代替构建dom元素

13
使用firstChild和nextSibling代替childNodes遍历dom元素

14
顺序无关的遍历时,用while替代for

15
IE, switch分支选择的效率高于if,在IE下尤为明显。4分支的测试,IE下switch的执行时间约为if的一半。

16
setInterval 替换 setTimeout

17
eval、Function、execScript等语句会再次使用javascript解析引擎进行解析,需要消耗大量的执行时间

18
巧用||和&&布尔运算符
前:
function eventHandler (e) {
if(!e) e = window.event;
}
后:
function eventHandler (e) {
e = e || window.event;
}
前:
if (myobj) {
doSomething(myobj);
}
后:
myobj && doSomething(myobj);

19
使用数组的splice方法释放数组中不用的item

20
释放dom元素占用的内存
将dom元素的innerHTML设置为空字符串,可以释放其子元素占用的内存。

21
释放javascript对象
对象:obj = null
对象属性:delete obj.myproperty
数组item:使用数组的splice方法释放数组中不用的item

22
尽量减少样式

23
简化选择器  ID 选择器 > class

24
尽量减少页面重新布局

25
使用本地JSON对象

26
在整个拖动过程中,浏览器要不断重新宣染容器及其内部所有结点的相关属性,任务量大,触发又很频繁,CPU占用就会很高。改进这样的拖动效果,可以改成:按下鼠标时,是拖动一个独立的空DIV,松开鼠标时再把真正要移动的窗口重新定位到目标位置就行。这样在拖动过程中,浏览器只需要宣染一个div

27
页面DOM元素过多,会导致浏览器JS运行和DOM渲染效率降低

28
类型转换
把数字转换成字符串,应用”" + 1
浮点数转换成整型,这个更容易出错,很多人喜欢使用parseInt(),其实parseInt()是用于将字符串转换成数字,而不是浮点数和整型之间的转换,我们应该使用Math.floor()或者Math.round()。
对于自定义的对象,如果定义了toString()方法来进行类型转换的话,推荐显式调用toString(),因为内部的操作在尝试所有可能性之后,会尝试对象的toString()方法尝试能否转化为String,所以直接调用这个方法效率会更高

29
使用直接量

30
对字符串进行循环操作,譬如替换、查找,应使用正则表达式,因为本身JavaScript的循环速度就比较慢,而正则表达式的操作是用C写成的语言的API,性能很好

31
对象查询

使用[""]查询要比.items()更快

32
对动态生成的元素进行缓存,一方面可以减少与服务器的交互及负载,同时也能够提升页面执行效率,缓存当善用之。

33
用 class 替代 style

34
动态创建 script 标签

分享到:
评论

相关推荐

    高性能JavaScript代码最佳实践.pdf

    "高性能JavaScript代码最佳实践" 本文总结了编写高性能JavaScript代码的最佳实践,讨论了JavaScript代码性能问题的几种设计模式对性能的影响,并提供了一些技巧来提高JavaScript代码的性能。 在研究JavaScript代码...

    火狐和IE支持javaScript脚本的一些区别

    标题与描述均提到了“火狐和IE支持javaScript脚本的一些区别”,这明确指出了文章将探讨在Mozilla Firefox和Internet ...通过遵循最佳实践和使用跨浏览器兼容的代码,可以确保网站在各种浏览器环境下都能正常运行。

    IE8的JavaScript点击事件(onclick)不兼容的解决方法

    由于`eval`的使用并不是最佳实践,更好的替代方案是使用现代JavaScript的事件委托或者动态创建带有正确事件处理器的函数。例如,可以使用纯JavaScript实现类似jQuery的事件绑定功能: ```javascript function ...

    加载 Javascript 最佳实践

    本文将详细介绍如何根据Yahoo的最佳实践来优化JavaScript的加载,以及随着浏览器技术的发展,我们有哪些新的方法可以选择。 首先,我们回顾一下Yahoo在2008-2009年间提出的一些最佳实践,这些实践对于提高网站速度...

    IE插件 javascript 调试工具

    在安装和使用时,应确保来自可信任的源,并遵循安全最佳实践。 3. **学习曲线**:虽然调试工具能提升效率,但初次使用者可能需要花时间熟悉其工作原理和操作方式。 4. **更新维护**:及时更新插件以获取最新功能和...

    ajax设计模式与最佳实践

    **Ajax设计模式与最佳实践** Ajax(Asynchronous JavaScript and XML)是一种在无需刷新整个网页的情况下,能够更新部分网页的技术。自2005年被广泛采用以来,它极大地改变了Web应用的用户体验,使得页面交互更加...

    测试JavaScript在IE中的内存泄露

    6. **最佳实践**:遵循良好的编程习惯,比如及时解除不再使用的引用,避免使用全局变量,合理管理DOM操作,以及正确使用window.onload和window.onunload事件。 通过以上步骤,开发者可以有效地检测和修复JavaScript...

    JavaScript在IE和FF中的区别

    最佳实践是统一使用`getElementById(idName)`,并避免将HTML对象ID作为变量名,以防止冲突。 5. 变量名与HTML对象ID相同:在IE中,可以直接使用HTML对象ID作为`document`的下属对象变量名,但在Firefox中不行。相反...

    IE的js错误查找小工具

    2. 使用标准和最佳实践:编写符合ECMAScript规范的代码,避免使用已被废弃的API,以提高代码的跨浏览器兼容性。 3. 测试环境模拟:确保在不同的IE版本下进行测试,因为不同版本的IE可能存在不同的错误表现。 4. ...

    FF与IE对javascript和CSS的区别

    最佳实践是使用`getElementById("idName")`。 5. **变量名与HTML对象ID相同** - IE将HTML对象ID作为`document`的下属对象变量名,而FF不支持。为避免冲突,应使用`document.getElementById("idName")`代替`...

    jquery高级编程的最佳实践详解

    学习和实践jQuery高级编程的最佳实践,可以帮助开发者编写出更为高效、兼容和可维护的JavaScript代码。上述的实践方法是众多Web开发者在日常开发中积累的宝贵经验,运用好这些方法,可以让Web应用的性能和用户体验...

    ie不支持javascript的解决方案.docx

    JavaScript是一种广泛应用于网页和应用程序的脚本语言,它在客户端浏览器中执行,为用户提供动态交互体验。然而,由于不同浏览器的实现差异,JavaScript在不同...保持代码简洁且遵循标准最佳实践是减少这些问题的关键。

    JavaScript(3) IE插件管理专家(1) Web设计(1)

    在"7个可能改变你一生的PPT"中,可能包含了关于JavaScript编程技巧、IE插件管理的最佳实践以及Web设计趋势和原则的相关内容。这些PPT可能会深入讲解如何利用JavaScript实现动态效果,如何解决IE插件导致的问题,以及...

    谷歌浏览器js打开IE浏览器.rar

    然而,这种做法并不推荐长期使用,因为其依赖于特定的系统配置和浏览器特性,且不符合Web开发的最佳实践。在开发过程中,应当注重跨浏览器兼容性和现代化的Web技术,以确保应用的可持续性和用户体验。

    IE6, IE7, IE8 CSS 兼容速查表

    以上只是部分兼容性问题的概述,完整的速查表将包含更多细节,如每个CSS属性在不同IE版本中的表现、解决方法以及最佳实践。通过这份速查表,开发者可以快速查找并解决IE6、7、8中遇到的CSS兼容性问题,从而提高网站...

    javascript和css在IE和Firefox中的不同点

    要确保在 IE 和 Firefox 之间具有良好的兼容性,开发人员应使用条件注释、polyfills(如 `es5-shim` 和 `Modernizr`)、跨浏览器的 CSS3 前缀,以及遵循最佳实践,如使用 `<!DOCTYPE>` 来触发标准模式。同时,进行...

    IE多版本测试工具(最新版)

    **最佳实践与注意事项** 1. 在开始测试之前,确保你的代码遵循W3C标准,避免使用非标准的HTML、CSS或JavaScript特性。 2. 使用最新的测试工具版本,以获取更准确的模拟环境。 3. 对于可能出现的脚本冲突,尝试使用...

Global site tag (gtag.js) - Google Analytics