对于Javascript来说，提高网络下载的性能最直接的方法就是把JS文件体积减小，前边混淆压缩变量名字是方法之一，但是还有诸多可以把代码体积压小的规则，我在本篇文章会对UglifyJS所有压缩代码体积的细节整理成一条条的规则，为了方便理解，还会给出一些压缩前代码以及压缩后代码的对比。由于UglifyJS里边对IF的压缩规则最多，也是最为丰富精彩的部分，放在最后边解释。
还是那样，有兴趣了解UglifyJS实现细节，看文章最后的我对它源码做的注释。
留意：
UglifyJS会对JS文件的变量名进行混淆处理，要理解Javascript变量混淆的细节，我们需要回答以下几个问题：
1.遇到一个变量myName，我们怎么知道这个myName变量要不要混淆
2.混淆名字怎么生成才合适，新的名字替换旧的名字时有什么要注意的地方？
3.哪些关键字会产生一个作用域？
4.作用域链跟符号表在UglifyJS里边是怎么体现？
5.UglifyJS混淆的过程是什么样？
我们先梳理一下这5个问题，最后贴出我阅读UglifyJS在这部分的实现时做的代码注释。 [Read more...]
为了理解源码结构，必须要进行语法分析，uglify在语法分析阶段得到一棵AST树（它的结构是数组嵌套数组，parse-js移植于一个Lisp的项目，获得的AST树类似Lisp里边的表，数组套数组：["toplevel", ["stat", [xxxx]]]）
对于JS来说，一个文件就是处于一个全局域的语句块，uglify里边把这个命名为toplevel的语句块，里边涉及各种状态，太具体的状态就不画图了，上一个语句块的状态转移的图片，其他还是要阅读源码比较爽快。
uglifyjs是用来压缩混淆JS文件，同时会对代码尽可能的优化，使得最后产出的js代码非常小，uglifyjs通过nodejs写的，底层用了一个parse-js的进行AST分析。
这两天在工作空隙的时间阅读了uglifyjs的源码，发现了很多js语法细节的东西，略有收获，顺便把看的过程注释在它代码里边。
词法分析的文章写过好几篇了，不想重复了，直接贴代码注释了。 [Read more...]
我们先看一下在zend_language_parser.y里边是如何书写赋值语句的语法规则（在没有任何说明的情况下，本文讨论的仅仅是：$var = 1;这样一条简单的赋值语法规则）。
本篇文章是剖析Sizzle的最后一篇，上一篇文章把大概的匹配器解析过程剖析了，但是还有一个特殊的选择器规则没说到：位置伪类。（姑且称为位置伪类吧，因为它与节点在父节点的位置信息有关）
上一篇文章已经把详细的匹配器工作过程叙述了一遍，本篇文章不再叙述相关过程，只是把其中有关于位置伪类特殊处理的部分剖析一下，了解详细匹配过程移步到《jQuery源码剖析（九）——Sizzle选择器引擎之匹配器》
[Read more...]
上篇文章《jQuery源码剖析（八）——Sizzle选择器引擎之解析原理》谈到一个终极匹配器superMatcher，它把候选元素集合seed筛选出最后符合规则的节点集合。如下图：
从这个图中我们知道，superMatcher的输入是DOM节点结合，输出也是DOM节点集合。这个终极匹配器里边需要一堆小的匹配器来判断当前输入的节点是否符合规则。
因此容易想到这样的匹配器的形式如：function(elem){return true;}
也即是说，输入一个DOM节点，判断一下输入节点是否符合某个匹配规则，如果符合了，那它就应该在最后的结果集里边。 [Read more...]
这篇文章的主题是解释Sizzle选择器引擎中的解析原理，以及部分源码注释。注意，这篇文章会做一下两点限制：
我接下去的几篇文章会用以下例子来逐步剖析Sizzle的解析原理以及匹配器构成原理：
1 2 3 4 5 6 7 8 9 10 11 | <div> <p> <span class="clr"> <input type="text" /> </span> </p> <div class="clr"> <input type="checkbox" name="readme" /> <p>Hello World</p> </div> </div> |
使用以下选择器S来选取节点：$(‘div .clr > input[name="readme"] + p’)。
在开始前，我们必须了解一个真相：CSS选择器的解析顺序是从右到左的。 [Read more...]