IssueRaiser

Add first-class support for differential script loading

The `type=module`/`nomodule` pattern gave developers a “clean break” to ship small, modern JavaScript bundles (with minimal polyfilling + transpilation) vs. legacy bundles (with lots of polyfills + transpilated code), which is great not just for module adoption but also for web performance. However, as more features are added to the JavaScript language, more polyfilling and transpilation becomes necessary even for these “modern” `type=module` script bundles. @kristoferbaxter, @philipwalton, and I have been thinking about ways to address this problem in a future-facing way, and have explored several potential solutions. One way we could introduce a new “clean break” once a year is by adding a new attribute to `<script type="module">`, perhaps `syntax` or `srcset`: ```html <script type="module" srcset="2018.mjs 2018, 2019.mjs 2019" src="2017.mjs"></script> <script nomodule src="legacy.js"></script> ``` (Note that this is just an example of what a solution could look like.) The `2018` and `2019` descriptors would then refer to feature sets that browsers recognize (in particular, they do **NOT** refer to ECMAScript version numbers or anything like that). For more details, [**read our exploration doc**](https://docs.google.com/document/d/1kOLu53dYzwElJZ6JBgMR137-Rdj8cDc_rX2YkPFYUsY/edit). At this stage **we’d like to get feedback on whether others agree this is a problem worth solving**. Feedback on any particular solution (such as `<script type="module" srcset

Posted by mathiasbynens on Mar 13, 2019, 3:16 PM

Tags

Related issues

Raise real-world problems, find people facing the same issue, and discuss solutions.4,000 issues0 comments

support (Other)

Add first-class support for differential script loading

mathiasbynensMar 13, 2019, 3:16 PM

The `type=module`/`nomodule` pattern gave developers a “clean break” to ship small, modern JavaScript bundles (with minimal polyfilling + transpilation) vs. legacy bundles (with lots of polyfills + transpilated code), which is great not just for module adoption but also for web performance. However, as more features are added to the JavaScript language, more polyfilling and transpilation becomes necessary even for these “modern” `type=module` script bundles. @kristoferbaxter, @philipwalton, and I have been thinking about ways to address this problem in a future-facing way, and have explored several potential solutions. One way we could introduce a new “clean break” once a year is by adding a new attribute to `<script type="module">`, perhaps `syntax` or `srcset`: ```html <script type="module" srcset="2018.mjs 2018, 2019.mjs 2019" src="2017.mjs"></script> <script nomodule src="legacy.js"></script> ``` (Note that this is just an example of what a solution could look like.) The `2018` and `2019` descriptors would then refer to feature sets that browsers recognize (in particular, they do **NOT** refer to ECMAScript version numbers or anything like that). For more details, [**read our exploration doc**](https://docs.google.com/document/d/1kOLu53dYzwElJZ6JBgMR137-Rdj8cDc_rX2YkPFYUsY/edit). At this stage **we’d like to get feedback on whether others agree this is a problem worth solving**. Feedback on any particular solution (such as `<script type="module" srcset

Comments (0)

No comments yet. Start the discussion.

Comment on this issue