engine icon indicating copy to clipboard operation
engine copied to clipboard

Polyfills should be a build step only

Open marklundin opened this issue 1 year ago • 7 comments

The engine currently ships with a load of polyfills which are automatically imported in a build whether you need them or not. Consequently building against a modern target like ES2020 inlines these polyfils when they're actually not required. In addition, if playcanvas is included in a project with it's own build step + polyfills, these would likely clash.

Ideally polyfills should be part of the build step and not the source code. Using core-js with babel-preset-env or similar, only the required polyfills are chosen based on the chosen output target

marklundin avatar Feb 21 '24 11:02 marklundin

Perhaps we should only add them when building ES5 targets, but not when building ESM?

mvaligursky avatar Feb 21 '24 13:02 mvaligursky

Perhaps we should only add them when building ES5 targets, but not when building ESM?

We also don't include a polyfill for Object.entries() which is partially responsible for #6011. So including it as part of the build would catch whenever we introduced a new language feature an polyfill for it

marklundin avatar Feb 21 '24 14:02 marklundin

For now though, you're probably right @mvaligursky, we can just add a conditional flag that omits from the ES6 build

marklundin avatar Feb 21 '24 14:02 marklundin

Wouldn't it be easier to change the engine compile process to translate output ESM build to UMD and have that step add the polyfills?

slimbuck avatar Feb 22 '24 08:02 slimbuck

core-js does this. However some initial tests show it's quite aggressive. For example including new Float32Array() adds polyfills for all methods, even those methods are never called. I imagine this is by design (maybe some of the polyfills depend on each other), but as our build UMD target is pretty old, core-js is adding around 160Kb of code, just for TypedArray.

Auto-polyfilling definitely seems like the right way to go, but it needs some more investigation and optimisation. Either way, as #6011 shows, we don't have a polyfill for Object.entries, which is used in a few places, so the current UMD build has not worked with those code paths on pre Chrome 54 era browsers.

marklundin avatar Feb 22 '24 09:02 marklundin

Considering we're hoping to deprecate the IMD build in no too distant future, we might just add that single polyfill missing at the moment and call it a day for now.

mvaligursky avatar Feb 22 '24 09:02 mvaligursky

I think that's fine for now, we just exclude these in the ES6 build

marklundin avatar Feb 22 '24 09:02 marklundin

Closing for now. As of https://github.com/playcanvas/engine/pull/6079 ESM build omits the polyfills.

marklundin avatar Jul 05 '24 10:07 marklundin