[Fix] Lighthouse performance score below threshold

[JoeMatt]

Lighthouse Performance Score Below Threshold

Current score: 56/100 (threshold: 70)

View Lighthouse Report

Common fixes:

• Defer or remove render-blocking JavaScript
• Optimize and lazy-load images (use WebP, set explicit dimensions)
• Reduce unused CSS/JS
• Improve server response time (TTFB)
• Use efficient cache policies

Auto-opened by Site Audit

@claude Please fix the Lighthouse performance regression shown above.

Steps:

1. Review the Lighthouse report linked above
2. Create a working branch: git checkout -b claude/fix-performance
3. Apply the necessary code fixes
4. Push and create a PR: git push -u origin HEAD && gh pr create --title "fix: improve Lighthouse performance score" --base main
5. Enable auto-merge: gh pr merge --auto --squash

[claude]

Claude finished @JoeMatt's task in 4m 59s —— View job • claude/issue-34-20260321-0756 • Create PR ➔

---

Fixing Lighthouse Performance Regression

• Gather context and analyze codebase
• Identify performance bottlenecks
• Fix 1: Remove below-fold screenshot priority flag → replaced with explicit loading="lazy" (page.tsx)
• Fix 2: Defer itch.io iframe via IntersectionObserver (ItchIoEmbed.tsx) — iframe only loads when scrolled into view
• Fix 3: Defer GA to lazyOnload + add itch.io DNS prefetch (layout.tsx)
• Committed and pushed

Changes made

src/app/page.tsx — Removed priority={idx === 0} from iPhone screenshot images. The screenshots section is well below the fold; marking the first screenshot as priority forced the browser to preload it immediately, consuming bandwidth and delaying above-fold rendering. Replaced with loading="lazy".

src/components/ItchIoEmbed.tsx — Rewrote as a 'use client' component using IntersectionObserver. The itch.io iframe (and its third-party JS) now only loads when the widget scrolls within 200px of the viewport. This eliminates itch.io's contribution to Total Blocking Time on the initial page load.

src/app/layout.tsx — Two changes:

1. Google Analytics scripts changed from strategy="afterInteractive" → strategy="lazyOnload". GA now loads during browser idle time rather than immediately after hydration, reducing TBT further.
2. Added dns-prefetch for itch.io and its CDN (v6p9d9t4.ssl.hwcdn.net) so the DNS lookup is warmed up before the lazy iframe fires.