ES6+ features to be well tested and allowed listed in CONTRIBUTING.md before using

[Maksims]

It is important to keep engine code well maintained, and still support all major platforms, the engine promises backwards compatibility.

Risks of adding new ES6+ features to codebase:

1. Lack of platform support for ES6+ engine version users.
2. Bad transcompilation path to ES5 leading to large polyfills and/or filesize growth.

Benefits:

1. Easier to read code.
2. More trivial solutions, and easier to maintain.
3. Faster execution for the ES6+ version as browser engines evolve.

Whitelisted features:

• [x] let
• [x] const
• [x] for of
• [x] arrow functions
• [x] classes
• [x] default parameters
• [x] modules
• [x] optional chaining
• [x] template literals

Awaiting adding to CONTRIBUTING.md:

• [x] Map
• [x] Set

Currently used, and untested:

• [ ] static on class only recently been added to Safari, leading to a large portion of module engine version users not supporting it
• [ ] padEnd
• [ ] spread syntax
• [ ] Promise

Considerations:

• [ ] ** exponentiation operator
• [ ] padStart
• [ ] destructing
• [ ] rest parameters
• [ ] custom iterator functions
• [ ] Symbol.iterator
• [ ] Symbol
• [ ] Subclassable build-ins (e.g. Class extends Array)
• [ ] async, await
• [ ] Reflect
• [ ] Object.values
• [ ] Object.entries
• [ ] RegExp Named Group Captures ?

Features not to use:

[kungfooman]

Object destructuring looks good to me too, only tested this case tho.

How it is now: https://github.com/playcanvas/engine/blob/6db49b7cb172e9476046d074711156e08d0ba754/src/input/element-input.js#L638-L641

How it could look:

const {element, camera, x, y} = touchInfo;

The ES5 transcompilation looks like:

var element = touchInfo.element,
    camera = touchInfo.camera,
    x = touchInfo.x,
    y = touchInfo.y;

How ES5 transcompilation looks with current code:

var element = touchInfo.element;
var camera = touchInfo.camera;
var x = touchInfo.x;
var y = touchInfo.y;

(result is less code in ES5 as well as in ES6)

[willeastcott]

Agreed. We should definitely add that to the allow list.

[kungfooman]

Thoughts on shorthand method/property names? They can reduce quite some code too:

Example for shorthand method names:

https://github.com/playcanvas/engine/blob/ae0a36d6c603e4d1e7e2f29a854af0df2cbebc55/src/deprecated/deprecated.js#L121-L130

Could be (removing : function):

export const log = {
    write(text) {
        Debug.deprecated("pc.log.write is deprecated. Use console.log instead.");
        console.log(text);
    },

    open() {
        Debug.deprecated("pc.log.open is deprecated. Use console.log instead.");
        log.write("Powered by PlayCanvas " + version + " " + revision);
    },

Example for shorthand property names:

https://github.com/playcanvas/engine/blob/ae0a36d6c603e4d1e7e2f29a854af0df2cbebc55/src/deprecated/deprecated.js#L466-L498

Could be:

export const scene = {
    partitionSkin,
    procedural: {
        calculateTangents,
        createMesh,
        createTorus,
        createCylinder,
        createCapsule,
        createCone,
        createSphere,
        createPlane,
        createBox
    },
    BasicMaterial,
    Command,
    DepthMaterial,
    ForwardRenderer,
    GraphNode,
    Material,
    Mesh,
    MeshInstance,
    Model,
    ParticleEmitter,
    PhongMaterial: StandardMaterial,
    Picker,
    Projection: {
        ORTHOGRAPHIC: PROJECTION_ORTHOGRAPHIC,
        PERSPECTIVE: PROJECTION_PERSPECTIVE
    },
    Scene,
    Skin,
    SkinInstance
};

It helps to quickly see irregularities, e.g. that PhongMaterial is mapped to StandardMaterial. The ES5 version will be transcompiled into "longhand" again, so only the ES6 has reduced size.

[marklundin]

Just updating as the engine is now using the following

• static on class
• padEnd
• padStart
• spread syntax
• Promise
• ** exponentiation operator
• Object.values
• Object.entries
• async, await
• destructing
• ?? Nullish Coalescing (ES11)

[marklundin]

I'm closing this for now as we are currently using Babel + polyfils to lower our builds to both UMD and ES6 (module support)

If we feel this is still relevant, please flag and we can relook at it