`
hackbomb
  • 浏览: 217243 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

优化JavaScript

阅读更多

19.3.1 下载时间
Web浏览器下载的是JavaScript源码,也就是所有的长变量与注释都会包含在内。这个因素和其他因素都会增加下载时间,这会增加脚本运行的总时间。增加下载时间的关键因素就是脚本所包含的字节数。

要记住一个关键数字是1160,这是能放入单个TCP-IP包中的字节数。最好能将每个JavaScript文件都保持在1160字节以下以获取最优的下载时间。

在JavaScript中,每个字符就是一个字节,因此,每个额外的字符(不管是变量名、函数名、或者注释)都会影响下载速度。部署JavaScript之前,都应该尽可能优化下载速度。

1.删除注释

2.删除制表符和空格

3.删除所有的换行

4.替换变量名

5.ECMAScript Cruncher
利用Thomas Loo开发的ECMAScript Cruncher(ESC 可以http://www.saltstorm.net/depo/esc/或51AJAX.com下载)。ESC是一个小巧的Window Shell脚本。

利用Thomas Loo开发的ECMAScript Cruncher(ESC 可以下载)。ESC是一个小巧的Window Shell脚本。运行ESC,必须使用Windows系统。打开一个控制台窗口,输入以下命令:
cscript ESC.wsf -l [0-4] -ow outputfile.js inputfile.js [inputfile2.js]

第一部分,cscript是Windows Shell脚本解释程序。文件名ESC.wsf是ESC的程序本身。然后是压缩等级,一个0到4的数值,表示要进行优化的等级。-ow选项表示下一个参数是优化后输出的文件名。最后,剩下的参数是要进行优化的JavaScript文件。可以只给出一个要进行优化的文件,也可以有多个文件(多个文件估优化后会按顺序放到输出文件中)。

ESC支持的四个优化等级如下:
 0:不改变脚本,要将多个文件合到单个文件中时有用;
 1:删除所有的注释;
 2:除等级1外,再删除额外的制表符和空格;
 3:除等级2外,再删除换行;
 4:除等级3外,再进行变量名替换。

ESC擅长把变量名替换成无意义的名称。它不会更改构造名称、公用特性和公用方法名称。

使用ESC时要记住,如果某个JavaScript引用了另一个文件中的构造函数,4级优化会把对构造函数的引用替换成无意义的名称。解决方法是将两个文件合并成一个文件,这样就会保持构造函数的名称。

6.其他减少字节数的方法
 1)替换布尔值
  考虑下面的例子

  var bFound=false;
  for(var i=0;i<aTest.length;i++){
   if(aTest[i]==vTest) {bFound=true;}
 }

  可以替换为: 

  var bFound=0;
  for(var i=0;i    if(aTest[i]==vTest) {bFound=1;}
 }
   2)缩短否定检测

 
  if(oTest !=undefined) {
   //do something
  }
  if(oTest !=null) {
   //do something
  }
  if(oTest !=false) {
   //do something
}
  虽然这些都正确,但用逻辑非操作符来操作也有同样的效果

  if(!oTest) {
   //do something
  }

7.使用数组和对象字面量

   var aTest = new Array;
   var aTest =[];

 第二行用了数组字面量,与第一行效果一样,但要短很多。

  类似,对象字面量也可用于节省空间,以下两行效果一行,但对象字面量要更简短

   var aTest = new Object;
   var aTest ={};
 如果要创建具有一些特性的一般对象,也可以使用字面量,如下:

   var oFruit = new O;
   oFruit.color="red";
   oFruit.name="apple"; 
  前面的代码可用对象字面量来改写成这样:

   var oFruit = {color:"red",name:"apple"};

分享到:
评论

相关推荐

    利用ClosureCompiler通过Rollup缩小和优化JavaScript

    本文将详细介绍如何结合两者来有效地缩小和优化JavaScript代码。 Closure Compiler是一款由Google开发的高级JavaScript编译器,它能够对源代码进行静态分析和优化,包括删除未使用的变量、函数和类,以及进行类型...

    斐波那契记忆优化法优化JavaScript

    用斐波那契记忆优化法优化递归,提高代码运行效率,这个是JavaScript版

    murmurhash-js, MurmurHash算法的优化JavaScript实现.zip

    murmurhash-js, MurmurHash算法的优化JavaScript实现 MurmurHash.jsMurmurHash算法的优化JavaScript实现。这些算法采用一个JavaScript字符串( 还有种子),并快速创建一个非加密的32位 散列。 我的意思是亚毫秒性能。...

    javascript优化

    JavaScript 优化 JavaScript 作为一种脚本语言,广泛应用于 web 开发中,然而随着项目的复杂度增加,JavaScript 代码的性能问题不可忽视。因此,JavaScript 优化变得非常重要。本文将从多个方面对 JavaScript 优化...

    JavaScript语言精粹(高清电子版)和高性能JavaScript 双语版

    这本书的重点在于优化JavaScript代码的性能,确保应用程序的高效运行。书中可能包含以下知识点: 1. **性能分析**:如何使用开发者工具进行性能测试,识别瓶颈并进行优化。 2. **数据结构和算法**:选择合适的数据...

    优化JavaScript 之下载时间

    NULL 博文链接:https://gxl-ct001.iteye.com/blog/1748676

    JavaScript优化.docx

    此外,还可以通过其他方式进一步优化JavaScript,例如: 1. 使用压缩和混淆工具减少文件大小。 2. 合并多个JS文件为一个文件,减少HTTP请求的数量。 3. 利用异步加载(async)或延迟加载(defer)属性,防止阻塞页面...

    Chrome V8引擎中的JavaScript数组实现分析与性能优化.pdf

    在本文中,我们将对Chrome V8引擎中的JavaScript数组实现进行深入分析,并探讨如何通过优化JavaScript数组的使用方式来提高程序效率。在实际应用中,JavaScript程序的复杂度越来越高,程序执行的性能问题变得越来越...

    [高性能JavaScript编程].(High.Performance.JavaScript).Nicholas.C.Zakas.文字版

    公司的高级前端工程师,他在书中分享了大量实战经验与技巧,帮助读者优化JavaScript性能,提升网页的加载速度和运行效率。 首先,书中讲述了JavaScript代码的加载与执行,这是性能优化的第一步。作者强调了脚本的...

    优化javascript的执行速度

    本文将详细探讨如何优化JavaScript的执行速度,主要关注循环优化、DOM操作优化以及对象引用层次的减少。 首先,让我们来讨论循环优化。在JavaScript中,循环是一种常见的操作,但如果不注意细节,可能会造成不必要...

    什么是javascript,学习javascript

    优化JavaScript性能的方法包括减少DOM操作、利用缓存、压缩代码、优化循环等。 总之,JavaScript是现代Web开发不可或缺的一部分,理解和掌握JavaScript是成为前端开发者的必要条件。通过不断学习和实践,你可以利用...

    优化 JavaScript 代码的方法小结

    优化 JavaScript 代码 作者: Gregory Baker, GMail 软件工程师 和 Erik Arvidsson, Google Chrome 软件工程师 需要的经验: JavaScript 相关工作知识 客户端脚本能让你的应用更加地动态和活跃, 但是浏览器对代码的...

    seo优化如何处理JavaScript和Flash

    SEO(搜索引擎优化)是提升网站在搜索引擎中...同时,优化JavaScript的使用,确保其在所有主流浏览器上都能正常运行,并且不影响页面的加载速度和用户体验。通过这些策略,可以提升网站在搜索引擎中的可见性和排名。

    JavaScript性能优化技巧分享共8页.pdf.zip

    - **使用Chrome DevTools**:通过Timeline、Profiler等工具,实时分析和优化JavaScript执行性能。 - **Lighthouse审计**:谷歌提供的自动化性能审计工具,提供详细的优化建议。 以上是JavaScript性能优化的一些...

    高性能JavaScript + 高清+目录 PDF

    最后,书中还介绍了一些实用的工具和库,如Webpack、Babel和Lodash,它们可以帮助开发者更好地管理和优化JavaScript项目。 总而言之,《高性能JavaScript》是一本全面而深入的指南,它不仅教会你如何写出高效的...

    JavaScript高级篇视频教程

    学习者将学习到如何优化JavaScript代码,减少DOM操作,利用事件委托,以及了解V8引擎的内存管理和垃圾回收机制。此外,还将探讨如何利用各种工具进行性能分析和调试。 另外,JavaScript还涉及到一些高级特性,如...

    High Performance JavaScript(高性能Javascript编程) 【中英文对版】

    《高性能JavaScript》是一本深入探讨如何优化JavaScript代码执行效率的专业书籍。它主要针对那些希望提升JavaScript应用程序性能的开发者,无论是Web前端还是后端,都能从中受益。作者通过自身的实践经验,揭示了...

    javascriptAPI

    2. "高性能 javascript.pdf":这本书可能探讨了如何优化JavaScript代码以提高其运行效率,包括内存管理、性能分析、异步编程、函数式编程等方面,这对于开发高性能的Web应用至关重要。 3. "JQuery_API.zip":jQuery...

Global site tag (gtag.js) - Google Analytics