6to5 JavaScript Transpiler Gains Momentum

The promise of ECMAScript 6 is on the horizon, but the varying extent of implementation by browsers presents developers with a moving target. Interest in JavaScript transpiler 6to5 has grown over the past few months and the team recently announced that the developers behind competitor esnext will join the project.

Since the first commit in September 2014 by Sebastian McKenzie, 6to5 has emerged as an important tool for developers who want to write code in ES6 syntax now and not have to worry about environment compatibility issues. According to one compatibility chart, 6to5 has the largest percentage of ES6 features implemented.

Using 6to5, ES6 code:

class User extends Model {
  constructor() {
    super();
    this.sayHello();
  }

  sayHello() {
    alert("Hello World!");
  }
}

is compiled to valid ES5 code:

var User = function User() {
  Model.call(this);
  this.sayHello();
};

_inherits(User, Model);

User.prototype.sayHello = function () {
  alert("Hello World!");
};

Created by Brian Donovan, Esnext had a smaller community, mostly made up of those working with ember.js. When InfoQ asked ember.js core team member, Stefan Penner, about the reason behind joining forces, he said:

With the existence of both esnext and 6to5, we had very similar overlapping solutions, and two communities solving the same problems, ultimately just duplicate effort, and yet another confusing choice for consumers.

Penner said that for ES6 transpilation, the community needs more "polish, improved spec compliance, improved transpile time, better documentation and ideally, a defacto solution to focus energy."

According to McKenzie, no esnext code will make the jump into the 6to5 code base but the project will gain valuable talent:

The 6to5 codebase will remain the same, inheriting nothing from esnext. Brian Donovan who leads esnext will be joining core development of 6to5. Stefan Penner will be involved in the development process and will be bringing in Ember integration and more.

While 6to5 was heavily influenced by Google’s Traceur, it takes a different approach. With 6to5, developers can disable individual transforms as the target environment compatibility changes. If needed, some features do require polyfills, but there is no required runtime.

Developers who have used 6to5 praise it for its setup guide and for the quality of its generated code. It also integrates with many build systems including Node.js, grunt, and gulp.

Durandal has started using 6to5 for its next generation version, dubbed Aurelia. Rob Eisenberg, creator of Durandal, said he considered many options, but that the compiled output, no need for a runtime, and the ES6 spec compliance convinced him 6to5 was the right choice.

I found the 6to5 team to be extremely responsive. They are releasing, often multiple times per day, and working really hard. They are very passionate about the project and it comes through. [Aurelia is] a non-trivial ES6 project and it’s working lovely with 6to5 today, including compilation to multiple module formats for use with different module loaders like SystemJS and RequireJS.

Though the project's name implies that it only transpiles ES6 to ES5, McKenzie says that eventually the name will change and the project will support "all future versions of JavaScript/ECMAScript."

People are under the impression that 6to5 will be a short-term solution until ES6 is widely supported. This isn't necessarily true as it'll be quite a while until all browsers and environments support ES6.

Correction: An earlier version of this story identified Stefan Penner as the creator of esnext. Mr. Penner is the creator of ember-cli which used esnext and is part of the ember.js core team. Brian Donovan is the creator of esnext.