`
jobar
  • 浏览: 339776 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

高性能web网站优化原则10——精简JavaScript

阅读更多
1 精简压缩
精简是从代码中移除空格注释等不必要的字符以减少大小,进而减少页面加载的时间。代码被精简之后,所有的注释以及不必要的空白字符(空格,换行和制表符)都被删除,对js文件来说,由于文件大小减小了,从而可以改善用户响应时间。

2 混淆
混淆是另外一种优化方式,不仅会移除不必要的代码,还会修改代码本身,函数和变量名字被转换为更短的字符串,这使得代码更精简且难以阅读和调试,这样做增加了反向工程的难度,这也是混淆的目的,它比精简更能减小代码大小从而提供性能。混淆相比精简更复杂一些,有三个主要缺点:
1 混淆更复杂,混淆过程中有可能引入新的bug
2 混淆会改变js符号,因此需要对不能改变的符号加以限制或者标记,避免混淆器修改他们。
3 经过混淆的代码很难阅读,也不好调试
3 压缩工具
现在已经有非常多的JavaScript压缩工具,可为Web开发人员提供了良好的压缩率,也很容易使用。附几款常用的js压缩工具:
Closure Compiler
这是一个JavaScript优化编译器,可以对JavaScript进行解析,分析,并最大限度地减少。它已经在许多JavaScript应用程序中使用在如Gmail,谷歌地图等。

JSMin
它能够删除注释和JavaScript文件的空白处,从而减小文件大小的一半的。

YUI Compressor

YUI压缩器是另一个流行的JavaScript压缩工具,已经有很多顶级网站使用该工具。

UglifyJS
另一个JavaScript分析器/压缩器/美化器,基于NodeJS开发。适用于任何支持CommonJS模块的JavaScript平台,

KJScompress
另一个JavaScript压缩器,能够删除JavaScript文件中的注释和空白内容。KJScompress 构建来自 KHTML的JavaScript interpreter之上。

ShrinkSafe
ShrinkSafe是一个JavaScript压缩工具,基于 Rhino,一个JavaScript interpreter。它是开源的,了解更多和下载 ShrinkSafe webpage

4 锦上添花
内联脚本:我们也可以精简内联脚本以减少页面大小
5 压缩和精简
规则4强调了gzip压缩脚本的重要性,gzip能带来的压缩量更能减少页面的大小,我们可以在gzip压缩的基础上进一步使用精简来优化网站的性能。
6 精简css
精简css带来的节省要小于精简js。因为css注释和空白相对少,并且里面定义的元素之间有顺序依赖性
分享到:
评论

相关推荐

Global site tag (gtag.js) - Google Analytics