javaScript——优化  
2013-10-18 09:44
417 查看
转载:http://wangxinghaoaccp.blog.163.com/blog/static/115810236201161961741264/
javaScript是一门解释性的语言、它不像java、C#等程序设计语言、由编译器先进行编译再运行、而是直接下载到用户的客户端进行执行。因此代码本身的优劣就直接决定了代码下载的速度以及执行的效率。
1、减缓代码下载时间:
Web浏览器下载的是javaScript的源码、其中包含的长变量名、注释、空格和换行等多余字符大大减缓了代码下载的时间。这些字符对于团队编写时十分有效、但在最后工程完成上传到服务器时、应当将它们全部删除。例如:
view plainprint?
function showMeTheMoney(){
if(!money){
return false;
}else{
...
}
}
可优化成:
view plainprint?
function showMeTheMoney(){if(!money){return false;}else{...}}
这样、优化后就节约了25个字节、倘若是一个大的javaScript工程、将节省出非常大的空间、不但提高了用户的下载速度、也减轻了服务器的压力。相信这样的代码大家见过不少、很多优秀的js插件源码都这么干!
另外、对于布尔型的值true和false、true都可以用1来代替,而false可以用0来代替。对于true节省了3个字节、而false则节省了4个字节、例如:
view plainprint?
var bSearch
= false;
for(var i=0;i
if(aChoices[i]
== vValue)
bSearch = true ;
}
替换成:
view plainprint?
var bSearch
= 0;
for(var i=0;i
if(aChoices[i]
== vValue)
bSearch = 1 ;
}
替换了布尔值之后、代码的执行效率、结果都相同、但节省了7个字节。
代码中常常会出现检测某个值是否为有效值的语句、而很多条件非的判断就判断某个变量是否为"undefined"、"null"、或者"false"、例如:
view plainprint?
if(myValue
!= undefined){
//...
}
if(myValue
!=null){
//...
}
if(myValue
!= false){
//...
}
这些虽然都正确、但采用逻辑非操作符"!"也可以有同样的效果、代码如下:
view plainprint?
if(!myValue){
//...
}
这样的替换也可以节省一部分字节、而且不太影响代码的可读性。类型的代码优化还有将数组定义时的 new
Array()直接用"[]"代替、对象定义时的 new Object()用"{}"代替等、例如:
view plainprint?
var myArray
= new Array();
var myArray
= [];
var myObject
= new Object();
var myObject
= {};
显然、第二行和第四行的代码较为精简、而且也很容易理解。
另外、在编写代码时往往为了提高可读性、函数名称、变量名称使用了很长的英文单词、同时也大大增加了代码的长度、例如:
view plainprint?
function AddThreeVarsTogether(firstVar,secondVar,thirdVar){
return (firstVar+secondVar+thirdVar);
}
可优化成:
view plainprint?
function A(a,b,c){return (a+b+c);}
注意:在进行变量名称替换时、必须十分小心、尤其不推荐使用文本编辑器的"查找"、"替换"功能、因为编辑器不能很好地区分变量名称或者其他代码。例如、希望将变量"tion"全部替换成"io"、很可能导致关键字"function"也被破坏。
对于上面说的这些减少代码体积的方法、有一些很实用的小工具可以自动完成类似的工作、例如ECMAScript
Cruncher、JSMin、Online JavaScript Compressor等。
2、合理声明变量
减少代码的体积仅仅只能使得用户下载的速度变快、但执行程序的速度并没有改变。要提高代码执行的效果、还得在各方面做调整。
在浏览器中、JavaScript默认的变量范围是window对象、也就是全局变量。全局变量只有在浏览器关闭才释放。而JavaScript也有局部变量、通常在function中执行完毕就会立即被释放。因此在函数体中要尽可能使用var关键字来声明变量:
view plainprint?
function First(){
a = "" ; //直接使用变量
}
function Second(){
alert(a);
}
First();
Second();
这样、变量"a"就成为了全局变量、直到页面关闭时才会被销毁、浪费了不必要的资源、如果在"a"的前面加上"var"、这样"a"就成为了当前function的局部变量。在执行完First()便立即被销毁。因此、在函数体中、如果不是特别需要的全局变量、都应当使用"var"进行声明、从而节省系统资源。
3、使用内置函数缩短编译时间
只要可能、应当尽量使用JavaScript的内置函数。因为这些内置的属性、方法都是用类似C、C++之类的言语编译过的、运行起来比实时编译的JavaScript快很多。例如计算指数函数、可以自己编写:
view plainprint?
<</SPAN>html>
<</SPAN>head>
<</SPAN>base href="
javaScript是一门解释性的语言、它不像java、C#等程序设计语言、由编译器先进行编译再运行、而是直接下载到用户的客户端进行执行。因此代码本身的优劣就直接决定了代码下载的速度以及执行的效率。
1、减缓代码下载时间:
Web浏览器下载的是javaScript的源码、其中包含的长变量名、注释、空格和换行等多余字符大大减缓了代码下载的时间。这些字符对于团队编写时十分有效、但在最后工程完成上传到服务器时、应当将它们全部删除。例如:
view plainprint?
function showMeTheMoney(){
if(!money){
return false;
}else{
...
}
}
可优化成:
view plainprint?
function showMeTheMoney(){if(!money){return false;}else{...}}
这样、优化后就节约了25个字节、倘若是一个大的javaScript工程、将节省出非常大的空间、不但提高了用户的下载速度、也减轻了服务器的压力。相信这样的代码大家见过不少、很多优秀的js插件源码都这么干!
另外、对于布尔型的值true和false、true都可以用1来代替,而false可以用0来代替。对于true节省了3个字节、而false则节省了4个字节、例如:
view plainprint?
var bSearch
= false;
for(var i=0;i
if(aChoices[i]
== vValue)
bSearch = true ;
}
替换成:
view plainprint?
var bSearch
= 0;
for(var i=0;i
if(aChoices[i]
== vValue)
bSearch = 1 ;
}
替换了布尔值之后、代码的执行效率、结果都相同、但节省了7个字节。
代码中常常会出现检测某个值是否为有效值的语句、而很多条件非的判断就判断某个变量是否为"undefined"、"null"、或者"false"、例如:
view plainprint?
if(myValue
!= undefined){
//...
}
if(myValue
!=null){
//...
}
if(myValue
!= false){
//...
}
这些虽然都正确、但采用逻辑非操作符"!"也可以有同样的效果、代码如下:
view plainprint?
if(!myValue){
//...
}
这样的替换也可以节省一部分字节、而且不太影响代码的可读性。类型的代码优化还有将数组定义时的 new
Array()直接用"[]"代替、对象定义时的 new Object()用"{}"代替等、例如:
view plainprint?
var myArray
= new Array();
var myArray
= [];
var myObject
= new Object();
var myObject
= {};
显然、第二行和第四行的代码较为精简、而且也很容易理解。
另外、在编写代码时往往为了提高可读性、函数名称、变量名称使用了很长的英文单词、同时也大大增加了代码的长度、例如:
view plainprint?
function AddThreeVarsTogether(firstVar,secondVar,thirdVar){
return (firstVar+secondVar+thirdVar);
}
可优化成:
view plainprint?
function A(a,b,c){return (a+b+c);}
注意:在进行变量名称替换时、必须十分小心、尤其不推荐使用文本编辑器的"查找"、"替换"功能、因为编辑器不能很好地区分变量名称或者其他代码。例如、希望将变量"tion"全部替换成"io"、很可能导致关键字"function"也被破坏。
对于上面说的这些减少代码体积的方法、有一些很实用的小工具可以自动完成类似的工作、例如ECMAScript
Cruncher、JSMin、Online JavaScript Compressor等。
2、合理声明变量
减少代码的体积仅仅只能使得用户下载的速度变快、但执行程序的速度并没有改变。要提高代码执行的效果、还得在各方面做调整。
在浏览器中、JavaScript默认的变量范围是window对象、也就是全局变量。全局变量只有在浏览器关闭才释放。而JavaScript也有局部变量、通常在function中执行完毕就会立即被释放。因此在函数体中要尽可能使用var关键字来声明变量:
view plainprint?
function First(){
a = "" ; //直接使用变量
}
function Second(){
alert(a);
}
First();
Second();
这样、变量"a"就成为了全局变量、直到页面关闭时才会被销毁、浪费了不必要的资源、如果在"a"的前面加上"var"、这样"a"就成为了当前function的局部变量。在执行完First()便立即被销毁。因此、在函数体中、如果不是特别需要的全局变量、都应当使用"var"进行声明、从而节省系统资源。
3、使用内置函数缩短编译时间
只要可能、应当尽量使用JavaScript的内置函数。因为这些内置的属性、方法都是用类似C、C++之类的言语编译过的、运行起来比实时编译的JavaScript快很多。例如计算指数函数、可以自己编写:
view plainprint?
<</SPAN>html>
<</SPAN>head>
<</SPAN>base href="
相关文章推荐
- Web页面上工作流设计器(silverlight/Flex/Javascript/java Workflow&
- javaScript js 在客户端 本地生成…
- javascript 在文本框中…
- hdu3507&nbsp;动态规划+斜率优化
- JavaScript 调用 C++
- JavaScript Tip/Trick: 动态创建Table时,在IE中需要注意的一个问题
- Javascript&nbsp;层
- (转) listview加载性能优化V…
- bf3a 关于SQLSERVER SQL性能优化
- javascript&nbsp;中&nbsp;ajax&nbsp;&nbsp;事例&nbsp;(copy)
- javascript&nbsp;浅析&nbsp;对象&nbsp;function
- JavaScript 对日期,时间的操作
- poj1180&nbsp;dp斜率优化
- net 与 javascript脚本的几种交互方法
- 【JavaScript】Ajax 中如何上传文…
- CSS&nbsp;和JavaScript&nbsp;在ie6&nbsp;ie7&nbsp;ie8和…
- JavaScript 正则表达式02
- JavaScript 实现获取当前时间
- 手机刷机&nbsp;手机优化&nbsp;向导&nbsp;秘籍
- javascript调用HTTPS&nbsp;Webservice:1…