Even though most modern browsers support ES6, many developers continue to incorporate practices that ignore modern browser capabilities and focus on legacy browser support.
How does your site score on this audit?
This happens because developers often translate ES6 code to the ES5 standard to account for the small portion of users who may still be using browsers with no support or partial support for ES6.
Adopting a modern script deployment strategy can reduce the amount of code shipped to the majority of your visitors, improving their page experience.
For example, using module/nomodule feature detection can prevent unnecessary code from being shipped to users with modern browsers.
How does GTmetrix trigger this audit?
GTmetrix identifies the polyfills and transforms that should not be present if using the module/nomodule pattern.
Even if one such polyfill or transform exists, this audit triggers.
How to fix this audit?
A more practical solution is to implement modern feature-detection using
<script type="module"> and
Every browser that supports
For browsers that don't support
<script type="module">, you can use the translated ES5 code instead. In this manner, you are always serving modern code to modern browsers.
Learn more about implementing this technique here.
Note: This is an expert-level optimization