wiki:Webshit/Babel

Babel - the transpiller

Nothing is new under the moon. All this terrible fucking mess we call modern webdev could be reduced down to the classic compiler technology (a compilation pipeline) which is, well, half-assed bloatware implemented by a crowd of ignorant amateur coders.

The principles

Since all browsers and NodeJS accept only Javascript as its input, all the "compilation" (Babel) and "linking" (Webpack) stages of a pipeline produce a text/javascript stream (or a file) as its output.

The pipeline might have optimizing stages, such as pipelining of a text/javascript stream to Google's Closure Compiler and/or other minifiers, which further transform (or transpile) the source code by consistently renaming variables to a shortest possible set of symbols (based on frequency) etc.

The pipeline could be arbitrary long, given that all the transformations preserve semantics, which means math-like substitution of equal for equal (for which so-called type-consistency is just another fancy word.

For example, there is possible to add non-standard layer of extra syntax on top of Javascript with provide explicit static type-annotations. This additional syntax would, obviously, cause a syntax error when given to a execution engine, so it must be removed (or transformed into a valid Javascript) in some prior stage in a pipeline.

This is exactly how Flow - a plug-able external static type annotation system works.

Setup

sudo npm i -g babel-cli babel-eslint babel-preset-react

see also NodeJS, Webpack, Eslint, Flow, React

Last modified 15 months ago Last modified on Jan 19, 2019, 5:29:32 AM
Note: See TracWiki for help on using the wiki.