diff --git a/src/app.html b/src/app.html index d75d1ead00..285164d02f 100644 --- a/src/app.html +++ b/src/app.html @@ -71,6 +71,16 @@ metaThemeColorTag.setAttribute('content', '#171717'); } + const preloadHref = document.documentElement.classList.contains('dark') + ? '/static/splash-dark.png' + : '/static/splash.png'; + const preload = document.createElement('link'); + preload.rel = 'preload'; + preload.as = 'image'; + preload.href = preloadHref; + preload.setAttribute('fetchpriority', 'high'); + document.head.appendChild(preload); + window.matchMedia('(prefers-color-scheme: dark)').addListener((e) => { if (localStorage.theme === 'system') { if (e.matches) { @@ -90,6 +100,8 @@ logo.id = 'logo'; logo.style = 'position: absolute; width: auto; height: 6rem; top: 44%; left: 50%; transform: translateX(-50%); display:block;'; + logo.loading = 'eager'; + logo.fetchPriority = 'high'; logo.src = isDarkMode ? '/static/splash-dark.png' : '/static/splash.png'; document.addEventListener('DOMContentLoaded', function () { @@ -139,6 +151,8 @@ id="logo-her" style="width: auto; height: 13rem" src="/static/splash.png" + loading="eager" + fetchpriority="high" class="animate-pulse-fast" />