Description
In order to support App Shell style apps, we need to be able to only inline the JS necessary to render a basic "shell" page, and load the remaining scripts asynchronously, i.e.:
<body>
<!-- inlined app shell html and CSS -->
<script>
// necessary to render shell page
</script>
<script src="everything-app-needs.js" async></script>
</body>If any scripts are included without the async attribute, they would block the app shell from rendering, and render it useless.
The current scripts that are loaded are:
- es6-shim/es6-shim.js
- systemjs/dist/system-polyfills.js
- angular2/bundles/angular2-polyfills.js
- systemjs/dist/system.src.js
- rxjs/bundles/Rx.js
- angular2/bundles/angular2.dev.js
- angular2/bundles/http.dev.js
- angular2/bundles/router.dev.js
Plus the System configuration is inlined
I think we could just combine System.js libs, polyfills, system configuration, and initial System.import into a single script file, that could be included with the async attribute. And instead of loading libraries like angular, http, router, and rxjs via <script> tags, they would be loaded by System.
@hansl says "looks good" but he's going to give it more thought.
But this assumes the user doesn't manually add script tags to the html. Deserves some more thought.