Skip to content

Commit e18e692

Browse files
committed
perf(ScreenshotCarousel): prioritize first image fetch with fetchpriority
1 parent 0c4f100 commit e18e692

2 files changed

Lines changed: 2 additions & 1 deletion

File tree

docs/apps/womens-lacrosse-timekeeping-and-scoring-app/index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,5 +4,5 @@
44
Keep time, score, and stats for women’s lacrosse. Track goals,
55
cards, draws, and 15+ player stats — or just run the clock.
66
Built for NFHS rules.
7-
</p> </section> <div class="deviceFrame" data-astro-cid-bcx2i5kv> <div class="screen" style="aspect-ratio: 1179 / 2556; background-color: rgb(243 243 243)" data-astro-cid-bcx2i5kv> <div class="deviceNotch" aria-hidden="true" data-astro-cid-bcx2i5kv></div> <div class="carousel-wrapper" style="timeline-scope: --slide-1, --slide-2, --slide-3, --slide-4, --slide-5" data-astro-cid-fqjt62f3> <div class="carousel-track" data-astro-cid-fqjt62f3> <div class="slide" style="view-timeline-name: --slide-1; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-active-game.DeNdlzfY_ZauSVG.webp" srcset="/_astro/screenshot-active-game.DeNdlzfY_Z96v3d.webp 270w, /_astro/screenshot-active-game.DeNdlzfY_BvQbF.webp 540w, /_astro/screenshot-active-game.DeNdlzfY_Z1xxH6d.webp 810w" alt="Active game with score and clock running" sizes="(max-width: 480px) 230px, 270px" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-2; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-ready-game.Dzr-cGVj_Z1ybT3F.webp" srcset="/_astro/screenshot-ready-game.Dzr-cGVj_ZSHUvm.webp 270w, /_astro/screenshot-ready-game.Dzr-cGVj_1JQz1G.webp 540w, /_astro/screenshot-ready-game.Dzr-cGVj_1lyncy.webp 810w" alt="Game ready to start" sizes="(max-width: 480px) 230px, 270px" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-3; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-settings.cL20k1IP_29SVb6.webp" srcset="/_astro/screenshot-settings.cL20k1IP_1BKD1y.webp 270w, /_astro/screenshot-settings.cL20k1IP_Z1XzTEK.webp 540w, /_astro/screenshot-settings.cL20k1IP_Zjhlbv.webp 810w" alt="App settings" sizes="(max-width: 480px) 230px, 270px" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-4; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-teams.DSC6KFv-_Z1q8Aop.webp" srcset="/_astro/screenshot-teams.DSC6KFv-_2Buzd.webp 270w, /_astro/screenshot-teams.DSC6KFv-_Z1woWq.webp 540w, /_astro/screenshot-teams.DSC6KFv-_2ml83C.webp 810w" alt="Teams list" sizes="(max-width: 480px) 230px, 270px" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-5; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-empty-games.DvPnh0y3_Xajx.webp" srcset="/_astro/screenshot-empty-games.DvPnh0y3_vhD5I.webp 270w, /_astro/screenshot-empty-games.DvPnh0y3_1gU0kB.webp 540w, /_astro/screenshot-empty-games.DvPnh0y3_ZS9xWh.webp 810w" alt="Empty games list" sizes="(max-width: 480px) 230px, 270px" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div> </div> <div class="dots" aria-hidden="true" data-astro-cid-fqjt62f3> <div class="dot" style="animation-timeline: --slide-1" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-2" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-3" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-4" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-5" data-astro-cid-fqjt62f3></div> </div> </div> </div> </div> </main> <footer class="siteFooter"> <p class="footerText">
7+
</p> </section> <div class="deviceFrame" data-astro-cid-bcx2i5kv> <div class="screen" style="aspect-ratio: 1179 / 2556; background-color: rgb(243 243 243)" data-astro-cid-bcx2i5kv> <div class="deviceNotch" aria-hidden="true" data-astro-cid-bcx2i5kv></div> <div class="carousel-wrapper" style="timeline-scope: --slide-1, --slide-2, --slide-3, --slide-4, --slide-5" data-astro-cid-fqjt62f3> <div class="carousel-track" data-astro-cid-fqjt62f3> <div class="slide" style="view-timeline-name: --slide-1; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-active-game.DeNdlzfY_ZauSVG.webp" srcset="/_astro/screenshot-active-game.DeNdlzfY_Z96v3d.webp 270w, /_astro/screenshot-active-game.DeNdlzfY_BvQbF.webp 540w, /_astro/screenshot-active-game.DeNdlzfY_Z1xxH6d.webp 810w" alt="Active game with score and clock running" sizes="(max-width: 480px) 230px, 270px" fetchpriority="high" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-2; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-ready-game.Dzr-cGVj_Z1ybT3F.webp" srcset="/_astro/screenshot-ready-game.Dzr-cGVj_ZSHUvm.webp 270w, /_astro/screenshot-ready-game.Dzr-cGVj_1JQz1G.webp 540w, /_astro/screenshot-ready-game.Dzr-cGVj_1lyncy.webp 810w" alt="Game ready to start" sizes="(max-width: 480px) 230px, 270px" fetchpriority="low" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-3; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-settings.cL20k1IP_29SVb6.webp" srcset="/_astro/screenshot-settings.cL20k1IP_1BKD1y.webp 270w, /_astro/screenshot-settings.cL20k1IP_Z1XzTEK.webp 540w, /_astro/screenshot-settings.cL20k1IP_Zjhlbv.webp 810w" alt="App settings" sizes="(max-width: 480px) 230px, 270px" fetchpriority="low" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-4; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-teams.DSC6KFv-_Z1q8Aop.webp" srcset="/_astro/screenshot-teams.DSC6KFv-_2Buzd.webp 270w, /_astro/screenshot-teams.DSC6KFv-_Z1woWq.webp 540w, /_astro/screenshot-teams.DSC6KFv-_2ml83C.webp 810w" alt="Teams list" sizes="(max-width: 480px) 230px, 270px" fetchpriority="low" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div><div class="slide" style="view-timeline-name: --slide-5; view-timeline-axis: inline" data-astro-cid-fqjt62f3> <img src="/_astro/screenshot-empty-games.DvPnh0y3_Xajx.webp" srcset="/_astro/screenshot-empty-games.DvPnh0y3_vhD5I.webp 270w, /_astro/screenshot-empty-games.DvPnh0y3_1gU0kB.webp 540w, /_astro/screenshot-empty-games.DvPnh0y3_ZS9xWh.webp 810w" alt="Empty games list" sizes="(max-width: 480px) 230px, 270px" fetchpriority="low" data-astro-cid-fqjt62f3="true" loading="lazy" decoding="async" width="1179" height="2556" class="slide-image"> </div> </div> <div class="dots" aria-hidden="true" data-astro-cid-fqjt62f3> <div class="dot" style="animation-timeline: --slide-1" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-2" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-3" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-4" data-astro-cid-fqjt62f3></div><div class="dot" style="animation-timeline: --slide-5" data-astro-cid-fqjt62f3></div> </div> </div> </div> </div> </main> <footer class="siteFooter"> <p class="footerText">
88
&copy; 2026 <a href="/" class="footerLink">Wavering Light LLC</a> </p> </footer> </body></html>

src/components/ScreenshotCarousel.astro

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@ const timelineScope = images.map((_, i) => `--slide-${i + 1}`).join(", ");
2424
class="slide-image"
2525
widths={[270, 540, 810]}
2626
sizes="(max-width: 480px) 230px, 270px"
27+
fetchpriority={i === 0 ? "high" : "low"}
2728
/>
2829
</div>
2930
))

0 commit comments

Comments
 (0)