浅谈JavaScript性能
最近在JavaScript性能方面有所感悟，把我的经验分给大家：
说到JavaScript，就不得不说它的代码的运行速度——
在我初学JavaScript的时候，只是觉得它是一个很强大的脚本。渐渐的，在做一些大的网站的项目的时候，却发现，代码执行的却异常的慢（尽管JavaScript用的是V8引擎），任然不能满足我的需求。这时候，我才慢慢的关注性能这一名词。在以前，个人总是喜欢在网上搜一些好的插件，并把它用到网站的建设工作当中。那么问题来了，在大量的插件的使用当中，网页总是要运行很久，处于很长时间的空白，这时候我发现JavaScript执行代码的速度越来越慢。究其缘由，那就是网页在渲染的过程前，一直在执行JavaScript代码的编译，以至于让网页长时间处于空白状态。那么这种问题的来源是什么？怎么解决呢？
在引用<script>标签的时候，我们习惯性的把它放在<head>标签之内。这样的做法，只是在最初接触JavaScript，或者说小的项目的时候可以这样做。个人觉得，做网页就是要很好的实现与用户的交互，如果像上述过程一样，用户长时间看的是一片空白的页面，会导致什么样的后果可想而知。为了提高JavaScript代码编译的运行速度，提升JavaScript的性能，(1)我推荐把<script>标签写在</body>之前，如果有很多的js,我建议用把包工具（雅虎YUI）合并一下.(2)在IE4+ Firefox3.5 的版本下，用代有defer的属性，像这样：<script defer></script> ,这样做的原理是让<script>标签总在onload事件执行前调用，原因不用深究。(3)动态的创建JavaScript （有兴趣的可以试试，不推荐）。
下面说到一个很实用，又简单，提升JavaScript性能的方法：‘局部变量’
这里必须要说一下在JavaScript里面，有四种数据存取位置：1.直接量 2.变量 3.数组元素 4.对象成员。
通常来讲，我们可以通过把常用的对象成员、数组元素、跨域变量保存在局部变量中来改善JavaScript性能，因为局部变量访问的速度更快。为了便于理解，还是敲两段代码吧！
function myLoop1(){
for(var count=0;count<99999;count++){
$('#idName').innerHTML + = 'A';
}
}
说明一下这段代码：每一次循环访问id是idName的元素时，该元素一共被访问了两次，一次是读取他的innerHTML，另一次是重写idName的值。
那么怎么才算提升性能的做法呢？看如下代码
function myLoop2(){
var show='';
for(var count=0;count<99999;count++){
show+ = 'A';
}
$('#idName').innerHTML += show;
}
实验证明：在所有浏览器下，myLoop2的运行要比myLoop1，快几十倍，在IE6下，更是快155呗。
那么为什么这样做会快这么多呢。我简单解释一下：JavaScript实际上包括了ECMAScript、DOM、BOM,不要以为三者是和谐共处的，它们互相沟通可是要过“路费的”。所以，我们要尽可能的把运算留给ECMAScript这一端，减少访问DOM的次数。
以后还有性能方面的问题还会分享给大家，不喜勿喷哦！
浅谈JavaScript性能的更多相关文章
- 浅谈javascript性能-管理内存
上次说到,javascript脚本到底应该放在哪里?用什么用处? 以下2点: 在Html.Body部分中的JS会在页面加载的时候执行.即-用户触发一个事件的时候执行的脚本.eg:onload事件... ...
- 浅谈javascript函数节流
浅谈javascript函数节流 什么是函数节流? 函数节流简单的来说就是不想让该函数在很短的时间内连续被调用,比如我们最常见的是窗口缩放的时候,经常会执行一些其他的操作函数,比如发一个ajax请求等 ...
- 浅谈DOM性能考虑
浅谈DOM性能考虑 很多人都会忽视脚本对Web应用整体性能的影响.为保证应用的流畅运行,在为文档编写和应用脚本时,需要注意一些问题.一.尽量减少访问DOM和尽量减少标记 访问DOM的方式对脚本性 ...
- 浅谈javascript的原型及原型链
浅谈javascript的原型及原型链 这里,我们列出原型的几个概念,如下: prototype属性 [[prototype]] __proto__ prototype属性 只要创建了一个函数,就会为 ...
- 浅谈java性能分析
浅谈java性能分析,效能分析 在老师强烈的要求下做了效能分析,对上次写过的词频统计的程序进行分析以及改进. 对于效能分析:我个人很浅显的认为就是程序的运行效率,代码的执行效率等等. java做性能测 ...
- 浅谈JavaScript中的闭包
浅谈JavaScript中的闭包 在JavaScript中,闭包是指这样一个函数:它有权访问另一个函数作用域中的变量. 创建一个闭包的常用的方式:在一个函数内部创建另一个函数. 比如: functio ...
- 浅谈JavaScript浮点数及其运算
原文:浅谈JavaScript浮点数及其运算 JavaScript 只有一种数字类型 Number,而且在Javascript中所有的数字都是以IEEE-754标准格式表示的.浮点数的精度问题 ...
- 浅谈 JavaScript 编程语言的编码规范
对于熟悉 C/C++ 或 Java 语言的工程师来说,JavaScript 显得灵活,简单易懂,对代码的格式的要求也相对松散.很容易学习,并运用到自己的代码中.也正因为这样,JavaScript 的编 ...
- 浅谈JavaScript中的null和undefined
浅谈JavaScript中的null和undefined null null是JavaScript中的关键字,表示一个特殊值,常用来描述"空值". 对null进行typeof类型运 ...
随机推荐
- android L新控件RecyclerView具体解释DeMo
简介 在谷歌的官方网站上,我们可以看到,它是此演示文稿:RecyclerView is a more advanced and flexible version of ListView. This w ...
- Swing JDialog监听回车键
在做项目时,发现在JDialog中,直接通过addKeyListener来监听回车键不起作用,无法监听到回车键,后面在网上查了些资料,终于解决了.方法如下: KeyStroke stroke = Ke ...
- MariaDb数据库管理系统的学习（一）安装示意图
MariaDB数据库管理系统是MySQL的一个分支.主要由开源社区在维护,採用GPL授权许可.开发这个分支的原因之中的一个是:甲骨文公司收购了MySQL后,有将MySQL闭源的潜在风险,因此社区採用分 ...
- TFS：TF30042 数据库已满 处理方法
原文:TFS:TF30042 数据库已满 处理方法 今天早上,公司打来电话,说TFS(Team Foundation Server)微软源代码管理软件签入不了,报错:TF30042 数据库已满. 经过 ...
- 10624 - Super Number
题目链接 题意:给出n到m的范围,求出一个数在前i位数组成的数字能被i整除.假设存在输出这个数,假设不存在.输出-1. 思路:回溯,每次放第i位,然后推断是否符合题意.这题踩着时间过去的2.6s(看了 ...
- Java单链逆转
本文介绍两种方法单向链表反转.记录,如下面: 1. package com.leetcode; public class ListReverse { public static void main(S ...
- SVN目录对号图标（更新、冲突）不显示
长谈想知道,大约SVN这些冲突.变化.加入.不显示问题etc目录下的复选图标,退房的在线信息,多数说的更改icon的settings,后来,一点点仔细阅读SVN配有英文说明文档,我相信,改变是有点问题 ...
- BZOJ 1901 Zju 2112 Dynamic Rankings 与更改的树董事长
标题效果:给定一个序列,单点变化,询价区间k大. 思维:假设没有变化.然后划分树就可以解决,但树的分工仍然是一棵树,它不支持的变化. 主席舒变化实际上是在外带fenwick右护套层值段树,但正确的值线 ...
- Android开发系列（十九个）：至SimpleAdapter设置样式
Adapter任务:在数据adapter处理后做.展会上的观点 对于一般ArrayAdapter供.传递给ArrayAdapter之后就能够在视图上用一个列表显示出这个字符串数组. 比例如以下边的代码 ...
- 集成 NHibernate
ABP 基础设施层——集成 NHibernate 本文翻译自ABP的官方教程<NHibernate Integration>,地址为:http://aspnetboilerplate.co ...