Why do that?

• Prepare our codebase for the future
• Write cleaner code
• Write fatser
• ES6 2015 standard is 100% complete

A few ES6 features

Arrow functions

							evens.map(v => v + 1);
						

String interpolation

var name = "Bob", time = "today";
console.log(`Hello ${name}, how are you ${time}?`);
						

ES6 features

Classes

class SkinnedMesh extends THREE.Mesh {
  constructor(geometry, materials) {
    super(geometry, materials);

    this.idMatrix = SkinnedMesh.defaultMatrix();
    this.bones = [];
    this.boneMatrices = [];
    //...
  }
  update(camera) {
    //...
    super.update();
  }
  static defaultMatrix() {
    return new THREE.Matrix4();
  }
}
						

ES6 features

Modules

import * as math from "lib/math";
import {sum, pi} from "lib/math";
						

and more

• Promises
• and many more... See all ES2015 features

Tooling

• Babel (transpilers)
• Webpack (module loader/bundler)

Babel

Babel has support for the latest version of JavaScript through syntax transformers. These allow you to use new syntax, right now without waiting for browser support.

Webpack

Webpack takes modules with dependencies and generates static assets representing those modules. It supports AMD, CommonJs and ES6 module loaders.