Brief: Why not ES6 yet?

While this is not quite a popular view and I do love new technology. Unfortunately I have found a reason for not using ES6 yet. At the very least with large code bases.

While I was looking through ES6 and yes I am just getting familiar with it I found that using a transpiler such as Babel is required to get your ES6 code running

So it is great that when trying to code in ES6 we have an option to and we can at least use it now for modern browsers! Awesome! However I started to ask myself, what about performance

One of the things to be considered when deciding future code bases, languages, architecture, etc is that it will be easy for development to do things correctly. Hence the beauty of React

Well when taking the below ES6 code and transpiling it I found a couple concerning things regarding performance

    let arr = [1, 2, 3];
    let squares = arr.map(x => x * x);
    let squares2 = squares.map(x => x * x);
    let squares3 = squares2.map(x => x * x);
    console.log(squares3);
  

So we simply have some block scoped variables. And as you can see they simply just take the array and make one with the squared value of it, then log. Nothing complicated here.

So looking at the transpiled version from Babel

    "use strict";

    var arr = [1, 2, 3];
    var squares = arr.map(function (x) {
      return x * x;
    });
    var squares2 = squares.map(function (x) {
      return x * x;
    });
    var squares3 = squares2.map(function (x) {
      return x * x;
    });
    console.log(squares3);
  

At first glance it seems great. It easily figured out how to make an ES5 version but if you will notice it creates a new function for doing the same thing over and over.

When first thinking about that you might say, well why would the transpiler need to figure out there is redundency in the code, that should be up to the developer to fix the architecture.

I totally agree, however what should have been a gain from doing something simple such as

x => x * x
    

Should be able to either be optimized, or not necessarily do a full creation of a function. However because something like this isnt natively being used then small operations like that still need to be put in their own function that is not recreated every time.

Now, for me this would normally not be a huge deal. But when you have 500,000 or more lines of code being delivered then something like this can begin to cause performance and memory issues. For small scale, I think it makes perfect sense. But in a LARGE codebase it can cause problems

While I do not think this is a great reason for not using ES6, it still is something to consider when using a full on ES6 code base