perf: do prefetch to other instance to load it faster (#811)

This commit is contained in:
Nolan Lawson 2018-12-15 17:13:34 -08:00 committed by GitHub
parent b4164653db
commit 89566cacaa
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 8 deletions

View File

@ -5,19 +5,28 @@
import { testHasLocalStorageOnce } from './src/routes/_utils/testStorage'
import { switchToTheme } from './src/routes/_utils/themeEngine'
import { basename } from './src/routes/_api/utils'
window.__themeColors = process.env.THEME_COLORS
function safeParse (str) {
return str === 'undefined' ? undefined : JSON.parse(str)
const safeParse = str => (typeof str === 'undefined' || str === 'undefined') ? undefined : JSON.parse(str)
const hasLocalStorage = testHasLocalStorageOnce()
const currentInstance = hasLocalStorage && safeParse(localStorage.store_currentInstance)
if (currentInstance) {
// Do prefetch if we're logged in, so we can connect faster to the other origin.
// Note that /api/v1/instance is basically the only URL that doesn't require credentials,
// which is why we can do this. Also we do end up calling this on loading the home page,
// so it's not a wasted request.
let link = document.createElement('link')
link.setAttribute('rel', 'prefetch')
link.setAttribute('href', `${basename(currentInstance)}/api/v1/instance`)
link.setAttribute('crossorigin', 'anonymous')
document.head.appendChild(link)
}
const hasLocalStorage = testHasLocalStorageOnce()
const currentInstance = hasLocalStorage &&
localStorage.store_currentInstance &&
safeParse(localStorage.store_currentInstance)
if (currentInstance && localStorage.store_instanceThemes) {
// switch theme ASAP to minimize flash of default theme
let theme = safeParse(localStorage.store_instanceThemes)[safeParse(localStorage.store_currentInstance)]
if (theme && theme !== 'default') {
switchToTheme(theme)

View File

@ -48,7 +48,7 @@ html{scrollbar-face-color:var(--scrollbar-face-color);scrollbar-track-color:var(
</head>
<body>
<!-- auto-generated w/ build-inline-script.js -->
<!-- insert inline script here --><script>!function(){"use strict";let e=document.getElementById("theThemeColor"),t=document.getElementById("theOfflineStyle");function o(){return document.head.querySelector('link[rel=stylesheet][href^="/theme-"]')}function n(e){return"undefined"===e?void 0:JSON.parse(e)}window.__themeColors={default:"royalblue",scarlet:"#e04e41",seafoam:"#177380",hotpants:"hotpink",oaken:"saddlebrown",majesty:"blueviolet",gecko:"#4ab92f",ozark:"#5263af",cobalt:"#08439b",sorcery:"#ae91e8",punk:"#e04e41",riot:"hotpink",hacker:"#4ab92f",pitchblack:"#000"};const r=(()=>{try{if(localStorage.setItem("__test__","__test__"),!localStorage.length||"__test__"!==localStorage.getItem("__test__"))return!1;localStorage.removeItem("__test__")}catch(e){return!1}return!0})(),l=r&&localStorage.store_currentInstance&&n(localStorage.store_currentInstance);if(l&&localStorage.store_instanceThemes){let r=n(localStorage.store_instanceThemes)[n(localStorage.store_currentInstance)];r&&"default"!==r&&function(n){let r=window.__themeColors[n];e.content=r||window.__themeColors.default,"default"!==n?function(e){let n=o(),r=document.createElement("link");r.rel="stylesheet",r.href=e,r.addEventListener("load",function e(){r.removeEventListener("load",e),n&&document.head.removeChild(n)}),document.head.insertBefore(r,t)}(`/theme-${n}.css`):function(){let e=o();e&&document.head.removeChild(e)}()}(r)}if(!r||!l){let e=document.createElement("style");e.textContent=".hidden-from-ssr { opacity: 1 !important; }",document.head.appendChild(e)}if(r&&"true"===localStorage.store_disableCustomScrollbars){document.getElementById("theScrollbarStyle").setAttribute("media","only x")}/mac/i.test(navigator.platform)&&document.documentElement.style.setProperty("--scrollbar-border-radius","50px"),/iP(?:hone|ad|od)/.test(navigator.userAgent)&&document.head.removeChild(document.getElementById("theManifest"))}();
<!-- insert inline script here --><script>!function(){"use strict";let e=document.getElementById("theThemeColor"),t=document.getElementById("theOfflineStyle");function o(){return document.head.querySelector('link[rel=stylesheet][href^="/theme-"]')}window.__themeColors={default:"royalblue",scarlet:"#e04e41",seafoam:"#177380",hotpants:"hotpink",oaken:"saddlebrown",majesty:"blueviolet",gecko:"#4ab92f",ozark:"#5263af",cobalt:"#08439b",sorcery:"#ae91e8",punk:"#e04e41",riot:"hotpink",hacker:"#4ab92f",pitchblack:"#000"};const n=e=>void 0===e||"undefined"===e?void 0:JSON.parse(e),r=(()=>{try{if(localStorage.setItem("__test__","__test__"),!localStorage.length||"__test__"!==localStorage.getItem("__test__"))return!1;localStorage.removeItem("__test__")}catch(e){return!1}return!0})(),a=r&&n(localStorage.store_currentInstance);if(a){let e=document.createElement("link");e.setAttribute("rel","prefetch"),e.setAttribute("href",`${l=a,function(e){return e.startsWith("localhost:")||e.startsWith("127.0.0.1:")}(l)?`http://${l}`:`https://${l}`}/api/v1/instance`),e.setAttribute("crossorigin","anonymous"),document.head.appendChild(e)}var l;if(a&&localStorage.store_instanceThemes){let r=n(localStorage.store_instanceThemes)[n(localStorage.store_currentInstance)];r&&"default"!==r&&function(n){let r=window.__themeColors[n];e.content=r||window.__themeColors.default,"default"!==n?function(e){let n=o(),r=document.createElement("link");r.rel="stylesheet",r.href=e,r.addEventListener("load",function e(){r.removeEventListener("load",e),n&&document.head.removeChild(n)}),document.head.insertBefore(r,t)}(`/theme-${n}.css`):function(){let e=o();e&&document.head.removeChild(e)}()}(r)}if(!r||!a){let e=document.createElement("style");e.textContent=".hidden-from-ssr { opacity: 1 !important; }",document.head.appendChild(e)}if(r&&"true"===localStorage.store_disableCustomScrollbars){document.getElementById("theScrollbarStyle").setAttribute("media","only x")}/mac/i.test(navigator.platform)&&document.documentElement.style.setProperty("--scrollbar-border-radius","50px"),/iP(?:hone|ad|od)/.test(navigator.userAgent)&&document.head.removeChild(document.getElementById("theManifest"))}();
//# sourceMappingURL=/inline-script.js.map</script><!-- end insert inline script here -->