Transpiler

 Transpilers, or source-to-source compilers, are tools that read source code written in one programming language and generate equivalent code in another language with a similar level of abstraction. A good example of a translator is the TypeScript translator, which translates TypeScript code into JavaScript. The Babel compiler can also be used for ES6 JS code to ES5 JS code.


Compilers also translate code from one language to another, but the level of abstraction is very different between the two languages. For example, compile from .java to .class files.


ES6 and ES5

To understand the translator, you must first understand the difference between ES6 and ES5 JavaScript. ES6 (ECMAScript 6) is the specification for the next version of JavaScript. Some of its major enhancements include modules, class declarations, lexical block scopes, iterators and generators, a commitment to asynchronous programming, deconstructing patterns, and appropriate tail calls.


The features are great, but most browsers do not support the specification until now. As a result, any UI application specification written in ES6 will not work in most browsers. To run these applications, you must convert this ES6 source code to the supported JavaScript version ES5. ES5 is supported by almost all browsers and is by far the most stable version.


ES6 - Brings "types" to JavaScript. Make it closer to strongly typed languages such as Java and C#. So far, most browsers don't support it. It must be converted to ES5 to execute in the browser.


ES5 - Over the years, we've been writing plain JavaScript.

Translation unit

A compiler is a program-like compiler that converts ES6 JavaScript code into ES5 JavaScript code to run in a browser. When the compiler sees an expression that uses the language functionality that needs to be translated, it generates a logically equivalent expression. The resulting expression can be very similar to or very different from the source expression.


What does a translator do?


ES6 code => ES5 code (even ES4, ES3)


Sources

https://scotch.io/tutorials/javascript-transpilers-what-they-are-why-we-need-them

https://devopedia.org/transpiler

Comments

Popular posts from this blog

Breakable Toys

What is Rest API

Difference Between Black-Box, White-Box