作者：沧海各种js解析器是前端工程的基石。可以说，没有它，很多项目都无法正常执行。我们每天都在使用babel、webpack、eslint，TypeScript需要一套对应的js解析器，今天我们就来看看，市面上常用的解析器有哪些，它们都有哪些特点？前言在讲js解析器之前，我们需要先了解一下ESTree项目。本项目的初衷是通过社区的力量保证与es规范的一致性，通过自定义的语法结构来表达JavaScript的AST。后来随着它的知名度越来越高，众多知名工程师的参与，使得它成为了事实上意义上的规范。目前，这个库由Mozilla和社区维护。如果没有AST规范，就意味着根本无法创建相应的解析器，而如果AST规范不统一，一些相应的工具库就无法很好的沟通。比如webpack不能正常使用babel相关的插件。.正是因为EsTree定义的规范，所有的js解析器或者编译器基本上绕不过去。如果你有兴趣自己写一个js解析器，你必须阅读它的文档。一。知名JS解析器1.1uglify-js(11.2k☆)创建时间：2010-8-1工作地址：https://github.com/mishoo/UglifyJS作者介绍：MihaiBazon，Lisp程序员，Emacs爱好者，看来做个罗马尼亚作者的博客：https://github.com/mishoohttp://lisperator.net/**是用来混淆压缩代码的。由于一些原因，uglify-js本身[内部实现了一套AST规范[1]](http://lisperator.net/blog/ug...，正是因为它的AST是自创的，并不是一个标准ESTree，以及es6之后新语法的AST不支持，所以没办法压缩如果需要压缩最新的es6代码，可以先用babel之类的工具转成ES5。uglify-js已经到3版本了，前两个版本由MihaiBazon维护，现在最新的3版本是alexlamsluglify-js已经到3版本了，前两个版本是uglify-js可以通过--acorn或者--spidermonkey指定对应parsing1.2Esprima(6k☆)创建时间：2011-11-20工作地址：https://github.com/jquery/esprima作者介绍：ariya印尼人，德国博士，现居山景城，硅谷，创造了世界上第一个真正的无头网络浏览器，PhantomJS。也为WebKit、KDE、Qt贡献了大量代码作者博客：https://ariya.io/abouthttps://github.com/ariya这是第一个用JavaScript编写的符合EsTree规范的JavaScript解析器，很多后续的编译器都受其影响，个人觉得它的出现具有历史意义。1.3acorn(6.8k☆)创建时间：2012-9-23工作地址：https://github.com/acornjs/acorn作者介绍：MarijnHaverbeke，也是富文本编辑器prosemirror(4.8k)，浏览器代码作者编辑器CodeMirror(21.7k)。此外，他还出了一本书《Eloquent JavaScript》，这本书也可以在网上找到https://eloquentjavascript.net/。目前这本书在中国也有翻译，但只有第一版第二版《JavaScript编程精解》，也是现居德国柏林的人。作者博客：https://marijnhaverbeke.nl/https://github.com/marijnhacorn与Esprima非常相似，输出的ast符合EsTree规范，目前的webpackAST解析器使用acorn，与Esprima是一样的埃斯普里玛。它不直接支持JSX。需要说明的是[acorn的es6语法支持RReverser贡献了一半以上[2]](https://rreverser.com/added-e...1.4@babel/parser(babylon)创建时间：2012-9-23工作地址：https://github.com/babel/babel/tree/master/packages/babel-parserbabel官方解析器，最初在acorn中fork，后来完全我行我素，从babylon开始后更名，它搭建的插件系统很强大1.5espree(1.3k☆)创建时间：2014-11-30工作地址：https://github.com/eslint/espree作者：NicholasC.Zakas,多个js其中，《红宝书 第三版》是最著名的一本书，他还创建了eslint。他在2016年被诊断出患有莱姆病，已经很久没有工作了。如果有兴趣可以去github上捐给他,和捐赠页面链接.作者博客:https://github.com/nzakashttps://humanwhocodes.com/eslint,prettier的默认解析器,最初在Esprima(v1.2.2)的一个分支中分叉,后来因为ES6发展很快，但是Esprima短时间内不支持，后面会基于acorn开发。1.5TypeScript创建时间：2014-7-6工作地址：https://github.com/microsoft/TypeScript/tree/master/src/compiler作者：这是微软的AndersHejlsberg创建的，他也是C#，Delphi，TurboPascal的作者现在很多大型项目，首选的是TypeScript，它的解析器在项目src/compiler/parser.ts中，TypeScript和其他项目有一个最大的区别，就是上面的库本质上都是它是基于js写的，里面有一些库，还有一些专门的js解析器，有需要的也可以看下两本。其他有趣的parser2.1sucrase(2.9k☆)创建时间：2017-9-24工作地址：https://github.com/alangpierce/sucrase作者：AlanPierce，就职于benchling，这是一家致力于生命科学家的公司提供软件协作。作者博客：https://github.com/alangpierce这是@babel/parser的一个子集。如果你确定代码不需要兼容IE浏览器，你可以使用这个解析器。据他介绍，它的解析速度应该是迄今为止最快的。2.2swc(10.1k☆)创建时间：2017-12-17工作地址：https://github.com/swc-project/swc作者：???，1997级新生，还在读大二，铁锈爱好者，开源了许多与铁锈相关的项目。为此，Deno在今年8月正式给了他一份顾问合同。作者博客：https://github.com/kdy1https://kdy1.github.io/用rust写的js编译器，单核比babel快4倍，4核比babel快70倍，并且可以也可以用封装js和ts代码，也有treeshaking功能。它的默认配置文件spack.config.js和webpack.config.js是一致的。@swc/cli有意与@babel/cli相同。看来野心很大。它的目标是取代babel。目前已经完成了babel的大部分功能。[详细请参考对照表[3]](https://swc.rs/docs/compariso...2.3esbuild(16.5k☆)创建时间：2020-1-1工作地址：https:///github.com/evanw/esbuild/作者：EvanWallace，一直从事webGL相关开发，目前在Figma工作个人博客：https://github.com/evanwhttp://madebyevan.com/esbuild是一个go写的下一代web打包工具，有最快的打包记录和压缩记录，snowpack和vite也用它作为打包工具，为了追求卓越的性能，目前没有暴露AST，AST不能被修改，无法解析对应的JavaScript，目前是所有项目中star增长最快的。3.其他一些著名工具库的创建3.1recast(3.4k☆)时间：2012-9-16工作地址：https://github.com/benjamn/recast作者：BenNewman，recast作者，TC39成员，现居纽约布鲁克林个人博客：https://github.com/benjamnhttps://www.quora.com/profile/Ben-Newman如果你需要重构你的代码，那么这个库将是你的首选，它可以同时使用多个解析器，并且你可以自定义pass是重构的利器.3.2jscodeshift(5.9k☆)创建时间：2015-3-22工作地址：https://github.com/facebook/jscodeshift作者：FelixKling。个人博客：https://github.com/fklinghttps://felix-kling.de/jscodeshift底层依赖recast，并在此基础上封装了遍历和操作AST的方法，更加方便。如果你需要直接操作AST来构建新的函数，我认为这是最合适的选择。目前fkling已经离开了Facebook，这个库的主要维护者也不再是他了。:FelixKling如果你需要重构代码或者进行AST分析，那么https://astexplorer.net/这个网站应该可以很好的帮助到你。是一个可视化的AST浏览工具，非常不错。目前还不支持SWC，但是已经有人提出了相应的pr，引用暂时还没有合并。1.为什么uglify-js使用SpiderMonkeyAST2。RReverser为acorn3贡献了大部分es6规范实现。swc完成的babel功能对比图对Electron感兴趣？请关注我们的开源项目ElectronPlayground，带你快速上手Electron。每周五我们都会挑选一些有趣的文章和新闻与大家分享。快来关注我们的小风周刊吧。我们是好未来小黑板的前端技术团队。我们会经常与您分享最新最酷的行业技术知识。欢迎知乎、掘金、Segmentfault、CSDN、简书、开源中国、博客园关注我们。
