Improve Lighthouse LCP and accessibility scores (#23)
Some checks failed
Build / build (push) Has been cancelled

Preload the LCP image (install.webp) from the HTML and add
fetchpriority="high" so the browser discovers it before JS executes.
Use a <main> landmark for the primary content container to satisfy
the "document has a main landmark" accessibility audit.
This commit is contained in:
Christian Semmler 2026-02-07 15:43:07 -08:00 committed by GitHub
parent a85e2ab952
commit de9fefb999
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 4 additions and 3 deletions

View File

@ -27,6 +27,7 @@
<link rel="manifest" href="manifest.json">
<link rel="icon" type="image/png" href="favicon.png">
<link rel="canonical" href="https://isle.pizza">
<link rel="preload" as="image" href="/images/install.webp" fetchpriority="high">
<style>
body { margin: 0; background-color: #000000; }
#app:empty { visibility: hidden; }

View File

@ -126,7 +126,7 @@
<UpdatePopup />
<ConfigToast />
<div id="main-container">
<main id="main-container">
<div class="page-wrapper" class:active={$currentPage === 'main'}>
<TopContent />
<Controls />
@ -156,7 +156,7 @@
<p><strong>DEVELOPMENT MODE</strong></p>
{/if}
</div>
</div>
</main>
<CanvasWrapper />

View File

@ -68,7 +68,7 @@
<div id="top-content">
<div class="video-container">
<img id="install-video" width="260" height="260" src="images/install.webp" alt="Install Game">
<img id="install-video" width="300" height="300" fetchpriority="high" src="images/install.webp" alt="Install Game">
<span
id="sound-toggle-emoji"
title={$soundEnabled ? 'Pause Audio' : 'Play Audio'}