{"action":"closed","issue":{"url":"https://api.github.com/repos/systemjs/systemjs/issues/1780","repository_url":"https://api.github.com/repos/systemjs/systemjs","labels_url":"https://api.github.com/repos/systemjs/systemjs/issues/1780/labels{/name}","comments_url":"https://api.github.com/repos/systemjs/systemjs/issues/1780/comments","events_url":"https://api.github.com/repos/systemjs/systemjs/issues/1780/events","html_url":"https://github.com/systemjs/systemjs/issues/1780","id":284796257,"number":1780,"title":"Prefetch recommendations","user":{"login":"IceCreamYou","id":203177,"avatar_url":"https://avatars1.githubusercontent.com/u/203177?v=4","gravatar_id":"","url":"https://api.github.com/users/IceCreamYou","html_url":"https://github.com/IceCreamYou","followers_url":"https://api.github.com/users/IceCreamYou/followers","following_url":"https://api.github.com/users/IceCreamYou/following{/other_user}","gists_url":"https://api.github.com/users/IceCreamYou/gists{/gist_id}","starred_url":"https://api.github.com/users/IceCreamYou/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/IceCreamYou/subscriptions","organizations_url":"https://api.github.com/users/IceCreamYou/orgs","repos_url":"https://api.github.com/users/IceCreamYou/repos","events_url":"https://api.github.com/users/IceCreamYou/events{/privacy}","received_events_url":"https://api.github.com/users/IceCreamYou/received_events","type":"User","site_admin":false},"labels":[],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2017-12-27T21:07:50Z","updated_at":"2018-05-26T00:54:05Z","closed_at":"2018-05-26T00:54:05Z","author_association":"NONE","body":"I'm experimenting with using SystemJS Builder for code splitting and bundling. I now have bundles for each page and bundles with shared dependencies. When a page is loaded, I'd like to prefetch, but not preload, the bundles for other pages. This is because, [according to Addy Osmani](https://medium.com/reloading/preload-prefetch-and-priorities-in-chrome-776165961bbf), one should \"preload resources you have high-confidence will be used in the current page. Prefetch resources likely to be used for future navigations across multiple navigation boundaries.\"\r\n\r\nI am aware that the depcache can be used to preload resources, but is there a recommended way to prefetch them?\r\n\r\nI can think of two ways to approach this. One way would be to rewrite my HTML at build time to include the elements. Something like:\r\n\r\n```js\r\n// Load the config, then insert the following into the HTML header:\r\nObject.keys(System.bundles).map((url) => `<link rel=\"prefetch\" href=\"${url}\">`).join('\\n');\r\n```\r\n\r\nI'm not sure if this will result in double fetching the current page's bundles.\r\n\r\nAnother way would be to do something like this at runtime:\r\n\r\n```js\r\nObject.keys(System.bundles).forEach((url) => {\r\n    var link = document.createElement('link');\r\n    link.rel = 'prefetch';\r\n    link.href = url;\r\n    document.head.appendChild(link);\r\n});\r\n```\r\n\r\nThis does appear to double fetch the current page's bundles, and I am not aware of a way to check what bundles have already been loaded.\r\n\r\nAny thoughts on this? Is this even a good idea?"}}
{"actor":{"display_login":"IceCreamYou"}}