YUI Compressor是如何压缩JS代码的?
YUI Compressor 压缩 JavaScript 的内容包括:
- 移除注释
- 移除额外的空格
- 细微优化
- 标识符替换(Identifier Replacement)
YUI Compressor 包括哪些细微优化呢?
- object["property"] ,如果属性名是合法的 JavaScript 标识符(注:合法的 JavaScript 标识符——由一个字母开头,其后选择性地加上一个或者多个字母、数字或下划线)且不是保留字,将优化为: object.property
- {"property":123} ,如果属性名是合法的 JavaScript 标识符且不是保留字,将优化为 {property:123} (注:在对象字面量中,如果属性名是一个合法的 JavaScript 标识符且不是保留字,并不强制要求用引号引住属性名)。
- 'abcd'efgh',将优化为 "abcd'efgh"。
- "abcd" + "efgh",如果是字符串相连接,将优化成 "abcdefgh"(注:所有在使用 YUI Compressor 的前提下,对于脚本中的字符串连接,使用连接符 "+" 的效率和可维护性最高)。
对于 JavaScript 最有效的压缩优化,当属标识符替换。比如:
1 |
( function (){ |
2 |
function add(num1, num2) { |
3 |
return num1 + num2; |
4 |
} |
5 |
})(); |
进行属标识符替换后:
1 |
( function (){ |
2 |
function A(C, B) { |
3 |
return C+ B; |
4 |
} |
5 |
})(); |
再移除额外的空格,最终成了:
1 |
( function (){ function A(C,B){ return C+B;}})(); |
YUI Compressor 标识符替换仅替换函数名和变量名,那哪些不能被替代呢?
- 原始值:字符串、布尔值、数字、null 和 undefined。一般来说字符串占的空间最多,而非数字字面量其次(true、false,null,underfinded)。
- 全局变量:window、document、XMLHttpRequest等等。使用最多的就是 document、window。
- 属性名,比如:foo.bar。占据的空间仅次于字符串,"." 操作符无法被代替,且 a.b.c 更加费空间。
- 关键字。经常被过度使用的关键字有:var、return。最好的优化方法:一个函数仅出现一次 var 和 return 关键字。
对于原始值、全局变量、属性名的优化处理方式大致相同:任何字面量值、全局变量或者属性名被使用超过 2 次(包括2次),都应该用局部变量存储代替。
但有部分情况下是禁止使用标识符替换的:
- 使用 eval() 函数。解决方法:不使用或者创建一个全局函数封装 eval()。
- 使用 with 语句。解决方法:方法同上。
- JScript 的条件注释。唯一解决的方法:不使用。
由于 YUI Compressor 是建立在 rhino interpreter 基础上的,所以上述所有的优化都是安全的。
YUI Compressor是如何压缩JS代码的?的更多相关文章
- js数组特定位置元素置空,非null和undefined,实现echarts现状图效果;谷歌格式化压缩js代码
一.想要实现eCharts线状图表的断点效果,如图(后来又查到数据格式为data:['-', 2, 3,'-' , 5, 6, 7]:也可以断点显示) 这种效果,在设置数据的时候应该是这样: data ...
- nodejs+gulpjs压缩js代码
1.安装node.js 下载地址:nodejs.org 或者 nodejs.cn 2.安装gulp之前我们需要安装nodejs的环境,检测能够正常使用npm后,我们用npm对gulp进行一次全局安 ...
- .net 运用YUI相关的dll压缩js (按照自己的规则,想想都觉得强大和有趣)
写在前面 不管是做前端的还是做后台的,不管是懂javaScript的还是不太懂JavaScript的人,我想都或多或想的知道些许js压缩对于页面性能提升的效应吧. 之前老喜欢用在线压缩工具去压缩js, ...
- 记录一个在线压缩和还原压缩js代码的工具
packer – javascript 压缩工具 http://dean.edwards.name/packer/ Javascript Beautifier ---可以恢复某些压缩工具压缩的js代码 ...
- grunt压缩js代码
安装node.js的环境和grunt插件在上一篇已经将过,点击这里跳到上一篇 所以我们直接从压缩插件的安装开始讲 起 1.安装uglify插件 目录结构如下: 命令行:npm install grun ...
- gulp 压缩 js 和 css 代码
我们在写出来的代码都是非常规范的,改换行的时候就换行,改tab 的时候就有tab,还有这样做是为了后期维护方便,但是这也导致了内存占用量的增大,当把把代码发到线上,如果网速慢一点,可能很久都加载不出来 ...
- 压缩和还原压缩的JS代码
压缩JS代码:packer – 最好用的 javascript 压缩工具地址: http://dean.edwards.name/packer/ http://kan.willin.org/?page ...
- YUI Compressor for Sublime text2
YUI Compressor 是一个用来压缩 JS 和 CSS 文件的工具,采用Java开发. 最近压缩文件,常使用在线压缩的方式来压缩文件,一来多有不便,二来如果没有网络,只能搁置了.本文来描述如何 ...
- idea 添加yuicompressor压缩js/css
打开idea 点击file->Settings 出现如下界面 argumets项填写 : -jar F:\yui\yuicompressor-2.4.8.jar $FilePath$ -o $F ...
随机推荐
- 解决pycharm报错:AttributeError: module 'pip' has no attribute 'main'
找到pycharm安装目录下 helpers/packaging_tool.py文件,找到如下代码: def do_install(pkgs): try: import pip except Impo ...
- java初级应用:环境安装及配置
相关文件下载: jdk下载路径:http://www.oracle.com/technetwork/java/javase/downloads/index.html eclipse下载路径:https ...
- ActivityStream是什么?什么是Feed流?
我先说说feed流吧,它就是社交网站中用户活动信息流,例如用户写了博客.发了照片.评论了什么等等.Facebook叫newsFeed.推特叫TimeLineFeed.ActivityStream是这些 ...
- python2.7入门---列表(List)
序列是Python中最基本的数据结构.序列中的每个元素都分配一个数字 - 它的位置,或索引,第一个索引是0,第二个索引是1,依此类推.Python有6个序列的内置类型,但最常见的是列表和元组. ...
- maven之package与install的区别
mvn clean package 先看命令的执行过程 mvn clean install 同样先看执行过程 mvn clean package依次执行了clean.resources.compile ...
- 【转】Ubuntu 14.04下Django+MySQL安装部署全过程
一.简要步骤.(阿里云Ubuntu14.04) Python安装 Django Mysql的安装与配置 记录一下我的部署过程,也方便一些有需要的童鞋,大神勿喷~ 二.Python的安装 由于博主使用的 ...
- 基于Ubuntu Server 16.04 LTS版本安装和部署Django之(二):Apache安装和配置
基于Ubuntu Server 16.04 LTS版本安装和部署Django之(一):安装Python3-pip和Django 基于Ubuntu Server 16.04 LTS版本安装和部署Djan ...
- 批处理bat实现创建、复制、删除文件及文件夹
转自:http://blog.csdn.net/linda1000/article/details/10221285 1 建bat文件自动执行复制,删除命令. 例1:以下是复制cd.dll文件至win ...
- VHDL入门学习-程序组成
1. VHDL程序的组成 一个完整的VHDL程序是以下五部分组成的: 2. 库(LIBRARY):比较好理解,调用系统已有的库,WORK库就是用户当前编辑文件所在的文件夹, IEEE库:由IEEE(美 ...
- spring 读取properties文件--通过注解方式
问题: 需要通过properties读取页面的所需楼盘的名称.为了以后便于修改. 解决: 可以通过spring的 PropertiesFactoryBean 读取properties属性,就不需要自己 ...