Empty input
Last updated 2017-08-09

Standards & Languages

Learn more about javascript standards and transpilers

Brendan Eich created JavaScript in 10 days for Netscape and changed the landscape of web development. While I’m not claiming that JavaScript is THE most popular programming language out there, it’s influence and power certainly cannot be denied. I got to the party a little late and only recently started working with JavaScript. But then I came across numerous other xyz-Scripts, and was left curious by terminologies like ‘syntactic sugar’ and ‘convention-over-configuration’. Trying to make sense out of all this led to transpilers and this post is a result of that.

So the fundamental question then is — What are transpilers?

The simplest answer is that it is a source-to-source compiler. Okay, maybe that’s still not very simple. A source-to-source compiler (or transcompiler, or transpiler, call it what you want!) , in simple terms, takes code written in one programming language and converts that into code for a target language. And of course, the target language, in this case, is JavaScript.

But if JavaScript is so widely popular and used, why not just write the native code in JavaScript itself?

Well, because everyone does not access the web in the same way. Netscape first had SpiderMonkey as its JavaScript engine but since then numerous competing browsers and JavaScript engines have come into the market. Apple’s Safari uses the Nitro engine, Google’s Chrome redefined speed with the V8 engine aided by Crankshaft, and Mozilla’s JavaScript engine is no longer SpiderMonkey in it’s original form, having come through iterations of IonMonkey and OdinMonkey. Bottom line is that users could access a site via many possible platforms and even within them, they could be using older versions of these browsers — all of which do not provide the same level of compatibility.

Using a transpiler allows one standard instance of JavaScript to be rendered across different browsers in an even fashion. This also allows users with older versions of the browsers to access the same code written on modern standards.
  • ECMAScript: A language standardized by ECMA International and overseen by the TC39 committee. This term is usually used to refer to the standard itself.
  • JavaScript: The commonly used name for implementations of the ECMAScript standard. This term isn’t tied to a particular version of the ECMAScript standard, and may be used to refer to implementations that implement all or part of any particular ECMASCript edition.
  • ECMAScript 5 (ES5): The 5th edition of ECMAScript, standardized in 2009. This standard has been implemented fairly completely in all modern browsers
  • ECMAScript 6 (ES6)/ ECMAScript 2015 (ES2015): The 6th edition of ECMAScript, standardized in 2015. This standard has been partially implemented in most modern browsers. To see the state of implementation by different browsers and tools, check out these compatibility tables.
  • ECMAScript 2016: The expected 7th edition of ECMAScript. This is scheduled to be released next summer. The details of what the spec will contain have not been finalized yet
  • ECMAScript Proposals: Proposed features or syntax that are being considered for future versions of the ECMAScript standard. These move through a process of five stages: Strawman, Proposal, Draft, Candidate and Finished.

Read more on https://blog.zipboard.co/looking-beyond-javascript-a-beginners-guide-to-javascript-transpilers-c02bbe146313 and https://benmccormick.org/2015/09/14/es5-es6-es2016-es-next-whats-going-on-with-javascript-versioning/