作者：滄海
各種js解析器是前端工程化的基石酿炸，可以說如果沒有它灸眼，很多工程化都無法正常執(zhí)行，我們每天用到的babel粱玲、webpack淹真、eslint童芹、TypeScript背后都需要一套對應(yīng)的js解析器吭从，今天我們來看看纤子，目前市場上有哪些常用的解析器篷牌，他們各自又擁有什么特性尼睡蟋？
前言
在說js解析器前，我們需要先了解下ESTree這個(gè)項(xiàng)目枷颊，這個(gè)項(xiàng)目的初衷通過社區(qū)的力量戳杀，保證和es規(guī)范的一致性，通過自定義的語法結(jié)構(gòu)來表述JavaScript的AST夭苗，后來隨著知名度越來越高信卡，多位知名工程師的參與，使得變成了事實(shí)意義上的規(guī)范题造，目前這個(gè)庫是Mozilla和社區(qū)一起維護(hù)的傍菇。
如果沒有AST規(guī)范，那么也就意味著根本無法造出對應(yīng)的解析器界赔，而如果AST規(guī)范不統(tǒng)一丢习，一些相應(yīng)的工具庫就不能很好的互通有無牵触，比如webpack就無法正常的使用babel相關(guān)插件。
正是因?yàn)镋sTree的定義的規(guī)范咐低，所以現(xiàn)在所有的js解析器或者編譯器揽思，基本上都繞不開它，如果你有志于自己寫一個(gè)js解析器见擦，那它的文檔你一定需要讀一遍钉汗。
一。知名的JS解析器
1.1 uglify-js (11.2k☆)
創(chuàng)作時(shí)間：2010-8-1
作品地址：https://github.com/mishoo/UglifyJS
作者介紹：Mihai Bazon鲤屡，Lisp程序員损痰，Emacs愛好者，貌似是羅馬尼亞人
作者博客：
**
用于混淆和壓縮代碼执俩，因?yàn)橐恍┰蛐炷疲瑄glify-js自己內(nèi)部實(shí)現(xiàn)了一套AST規(guī)范[1]，也正是因?yàn)樗腁ST是自創(chuàng)的役首，不是標(biāo)準(zhǔn)的ESTree尝丐，es6以后新語法的AST，都不支持衡奥，所以沒有辦法壓縮最新的es6的代碼爹袁，如果需要壓縮，可以用類似babel這樣的工具先轉(zhuǎn)換成ES5矮固。
uglify-js已經(jīng)進(jìn)行到3版本了失息，前兩個(gè)版本都是Mihai Bazon維護(hù)，但現(xiàn)在最新的3版本是alexlamsluglify-js已經(jīng)進(jìn)行到3版本了档址，前兩個(gè)版本都是
uglify-js可以通過--acorn或者--spidermonkey指定對應(yīng)的parsing
1.2 Esprima (6k☆)
創(chuàng)作時(shí)間：2011-11-20
作品地址：https://github.com/jquery/esprima
作者介紹：ariya印尼人盹兢，在德國獲得博士學(xué)位，目前住在硅谷山景城守伸，創(chuàng)建了世界上第一個(gè)真正的無頭Web瀏覽器PhantomJS绎秒。也為WebKit, KDE, 和 Qt貢獻(xiàn)過很多代碼
作者博客：
這是第一個(gè)用JavaScript編寫的符合EsTree規(guī)范的JavaScript的解析器，后續(xù)多個(gè)編譯器都是受它的影響尼摹，個(gè)人覺得它的出現(xiàn)具有歷史意義见芹。
1.3 acorn (6.8k☆)
創(chuàng)作時(shí)間：2012-9-23
作品地址：https://github.com/acornjs/acorn
作者介紹：Marijn Haverbeke，同時(shí)也是富文本編輯器prosemirror（4.8k）蠢涝、瀏覽器代碼編輯器CodeMirror（21.7k）的作者玄呛，另外他還出版了一本書《Eloquent JavaScript》，并且這本書在網(wǎng)上也有https://eloquentjavascript.net/和二，目前國內(nèi)也翻譯了這本書徘铝，不過只有第二版《JavaScript編程精解》，也有人目前居住在德國柏林。
作者博客：
acorn和Esprima很類似庭砍，輸出的ast都是符合EsTree規(guī)范的场晶，目前webpack的AST解析器用的就是acorn混埠，和Esprima一樣怠缸，也是也不直接支持JSX
需要提一下的是，acorn的es6語法支持RReverser貢獻(xiàn)了大半[2]
1.4 @babel/parser(babylon)
創(chuàng)作時(shí)間：2012-9-23
作品地址：https://github.com/babel/babel/tree/master/packages/babel-parser
babel官方的解析器钳宪，最初fork于acorn揭北，后來完全走向了自己的道路，從babylon改名之后吏颖，其構(gòu)建的插件體系非常強(qiáng)大搔体。
1.5 espree (1.3k☆)
創(chuàng)作時(shí)間：2014-11-30
作品地址：https://github.com/eslint/espree
作者：Nicholas C. Zakas，多本js書籍半醉，其中《紅寶書 第三版》最為知名疚俱，eslint也是他創(chuàng)建的，在2016年被查出萊姆病缩多，目前已經(jīng)很長時(shí)間沒有工作了呆奕，如果有興趣的話，可以去github上面捐贈(zèng)他衬吆，捐贈(zèng)頁面鏈接梁钾。
作者博客：
eslint、prettier的默認(rèn)解析器逊抡，最初fork于Esprima的一個(gè)分支（v1.2.2）姆泻，后來因?yàn)镋S6的快速發(fā)展，但Esprima短時(shí)間內(nèi)又不支持冒嫡，后面就基于acorn開發(fā)了拇勃。
1.5 TypeScript
創(chuàng)作時(shí)間：2014-7-6
作品地址：https://github.com/microsoft/TypeScript/tree/master/src/compiler
作者：這個(gè)是microsoft的Anders Hejlsberg領(lǐng)導(dǎo)創(chuàng)建的，他也是是C#孝凌、Delphi方咆、Turbo Pascal的作者
現(xiàn)在很多大型項(xiàng)目，首選就是TypeScript胎许，它的解析器是就在項(xiàng)目內(nèi)src/compiler/parser.ts峻呛，TypeScript和其他項(xiàng)目有一個(gè)最大的不同，就在于
以上的庫辜窑，本質(zhì)上都是基于js來寫的钩述，還有一些庫，還有一些特殊的js解析器穆碎，如果有需要也可以了解下
二牙勘。其他有意思的解析器
2.1 sucrase (2.9k☆)
創(chuàng)作時(shí)間：2017-9-24
作品地址：https://github.com/alangpierce/sucrase
作者：Alan Pierce，就職于benchling，這是一家專門給生命科學(xué)家提供軟件協(xié)作的公司方面。
作者博客：
這是@babel/parser的一個(gè)子集放钦，如果你確定的代碼不需要兼容IE瀏覽器，就可以用這個(gè)解析器恭金，按照他的介紹操禀，其解析速度目前來說應(yīng)該是最快的。
2.2 swc (10.1k☆)
創(chuàng)作時(shí)間：2017-12-17
作品地址：https://github.com/swc-project/swc
作者：???横腿，他是一個(gè)97年的小萌新颓屑，目前還在讀大二，rust的狂熱愛好者耿焊，開源了很多rust相關(guān)的項(xiàng)目揪惦，為此今年8月份Deno官方給了他一份顧問合同。
作者博客：
用的rust編寫的js編譯器罗侯，單核比babel快4倍器腋，4核比babel快70倍，也可以用來打包js钩杰、ts代碼纫塌，并且也擁有 tree shaking功能，它的默認(rèn)的配置文件spack.config.js和webpack.config.js保持一致榜苫，@swc/cli故意與@babel/cli想同护戳，看來野心非常大。
它的目標(biāo)就是替換babel垂睬，目前它已經(jīng)完成了babel的大部分功能媳荒，具體可以看對照表[3]
2.3 esbuild (16.5k☆)
創(chuàng)作時(shí)間：2020-1-1
作品地址：https://github.com/evanw/esbuild/
作者：Evan Wallace，一直從事webGL方面的相關(guān)的開發(fā)驹饺，目前就職于Figma
個(gè)人博客：
esbuild是用go編寫的下一代web打包工具钳枕，它擁有目前最快的打包記錄和壓縮記錄，snowpack和vite的也是使用它來做打包工具赏壹，為了追求卓越的性能鱼炒，目前沒有將AST進(jìn)行暴露，也無法修改AST蝌借，無法用作解析對應(yīng)的JavaScript昔瞧。
目前它的star在所有項(xiàng)目中增長最為迅速。
三菩佑。其他一些著名的工具庫
3.1 recast (3.4k☆)
創(chuàng)作時(shí)間：2012-9-16
作品地址：https://github.com/benjamn/recast
作者：Ben Newman自晰，recast作者，TC39成員稍坯，目前居住于紐約布魯克林地區(qū)
個(gè)人博客：
如果你需要重構(gòu)你的代碼酬荞，那么這個(gè)庫將會是你的第一選擇，它可以同時(shí)使用多種解析器，并且可以自定義傳入需要的解析器混巧，是重構(gòu)利器枪向。
3.2 jscodeshift (5.9k☆)
創(chuàng)作時(shí)間：2015-3-22
作品地址：https://github.com/facebook/jscodeshift
作者：Felix Kling。
個(gè)人博客：
jscodeshift底層依賴于recast咧党，在其基礎(chǔ)上封裝了遍歷秘蛔、操作AST的方法，使得更加便凿傅，如果你需要直接操作AST來構(gòu)建新的功能缠犀，我覺得這個(gè)是最合適的選擇。
目前來說fkling已經(jīng)離開了Facebook聪舒，目前這個(gè)庫的主要維護(hù)者已經(jīng)不是他了
3.2 ASTExplorer (3.6k☆)
創(chuàng)作時(shí)間：2014-6-29
作品地址：https://github.com/fkling/astexplorer
作者：Felix Kling
如果你需要對代碼進(jìn)行重構(gòu)或者進(jìn)行AST的分析，那么https://astexplorer.net/這個(gè)網(wǎng)站應(yīng)該可以很好的幫助你虐急，它是一個(gè)可視化的AST瀏覽工具箱残，非常棒。
目前還不支持SWC止吁，但是已經(jīng)有人提了對應(yīng)的pr被辑，還沒有合并
參考文獻(xiàn)
- 1. uglify-js為什么用SpiderMonkey AST
- 2. RReverser為acorn貢獻(xiàn)了大部分es6規(guī)范實(shí)現(xiàn)
- 3. swc完成的babel功能對照圖
對 Electron 感興趣？請關(guān)注我們的開源項(xiàng)目 Electron Playground敬惦，帶你極速上手 Electron盼理。
我們每周五會精選一些有意思的文章和消息和大家分享，來掘金關(guān)注我們的 曉前端周刊俄删。
我們是好未來 · 曉黑板前端技術(shù)團(tuán)隊(duì)宏怔。
我們會經(jīng)常與大家分享最新最酷的行業(yè)技術(shù)知識。
歡迎來 知乎畴椰、掘金臊诊、Segmentfault、CSDN斜脂、簡書抓艳、開源中國、博客園 關(guān)注我們帚戳。
