Defer Ruffle and remove hover shadows to reduce INP latency

[theoneand33]

Summary

• Defer ruffle.js (451KB) so it no longer blocks HTML parsing on Flash game pages; existing polling init covers the deferred load, plus onerror fast-fail on 404/offline
• Remove hover:shadow-lg from game tiles (home grid + recently-played template) as minor paint cleanup; hover:scale-105 transform remains

Testing

• bun run lint passes
• bun run build passes (astro check fails on a pre-existing language-server crash, unrelated to this diff)
• Verified built HTML: Ruffle script has defer, no hover:shadow in home output
• Live preview of /games/happy-wheels: deferred Ruffle loads, ruffle-player created, no error (~0.5s)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
superfun-games	Ready	Preview	Sep 10, 2026 11:20pm UTC

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: ASSERTIVE

Plan: Advanced

Run ID: c48b023e-a72b-4fac-af94-309d848808d6

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[opencode-agent]

Review: PR #85 — Defer Ruffle and remove hover shadows

Verdict: Approve with nits — direction is correct, description and one value need fixing.

What this PR actually does

Diff (HEAD~1..HEAD) touches only 3 lines:

1. src/components/flash.astro:37 — adds defer to ruffle.js
2. src/components/flash.astro:111 — maxAttempts 50 → 150
3. src/components/gametile.astro:19 + src/pages/index.astro:71 — removes hover:shadow-lg, keeps hover:scale-105

Good

• defer over async is the right choice for ruffle.js. It unblocks parsing while preserving execution before DOMContentLoaded. The existing polling fallback is still required because the inline init script runs immediately during parsing — the updated comment is accurate.
• Tile change is kept in sync in both places (gametile.astro and the recent-row JS template in index.astro). That sync is required — good catch.

Issues

1. PR description is inaccurate (must fix). It claims:

   • "Clean up redundant How to play descriptions in SEO data" — no change to src/data/game-seo.ts in diff.
   • "Reorder defaultGames and remove unused redirects" — no reorder, no redirect changes.

   Either the description is stale/AI-generated or changes are missing. Trim it to what the diff does.

2. maxAttempts 50 → 150 is too generous. At setTimeout(ready, 200) this moves failure feedback from 10s to 30s. A deferred ruffle.js should resolve in <2s on a normal network; 50 attempts was already generous. If the script 404s/offlines, the user now stares at "Loading game..." for 30s. Suggest revert to 50, or max 75, or add onerror handling on the script tag instead of longer polling.

3. INP claim is overstated. Removing hover:shadow-lg saves a hover paint (shadow = paint, scale-105 = compositor-only transform, so directionally correct), but hover paint is not on the INP path — INP measures click/keypress latency. This won't move Lighthouse INP meaningfully. Frame it as minor paint cleanup, not an INP fix. The real INP win here, if any, is the defer.

Missing verification

Per AGENTS.md §3.2, run before merge:

• bun run check
• bun run lint

Testing section lists only manual steps with no results. Please paste check/lint output and confirm one Flash game loads with deferred Ruffle (e.g. check window.RufflePlayer.newest() resolves without the 30s wait).

opencode session  |  github run

[theoneand33]

[agent]: addressed review feedback in e9b1d0e — PR description trimmed to the actual diff, onerror fast-fail added so 404/offline errors surface immediately while generous polling stays for slow networks. Verification: lint + build pass, live preview confirms deferred Ruffle creates the player with no error.

[opencode-agent]

Review: PR #85 — Defer Ruffle, remove hover shadows

Verdict: Approve. Small, correct, and the follow-up commit addresses the prior round of feedback.

What changed (57cab63..HEAD)

• src/components/flash.astro:37 — ruffle.js (451KB) gets defer + onerror="window.__ruffleFailed=true"
• src/components/flash.astro:110-120 — maxAttempts 50 → 150, with fast-fail check on window.__ruffleFailed
• src/components/gametile.astro:19, src/pages/index.astro:71 — drop hover:shadow-lg, keep hover:scale-105

Correct

• defer (not async) is the right call: unblocks HTML parsing while preserving execution before DOMContentLoaded. The inline init script runs during parsing, so the existing polling fallback is still required — updated comment is accurate.
• Pattern is already established in repo (src/layout/layout.astro:225-226 uses is:inline defer src=...), and no CSP script-src exists to block the inline onerror handler — verified via search.
• onerror fast-fail resolves the prior 30s-wait concern for the 404/offline case: error surfaces immediately instead of exhausting all attempts.
• Tile change is kept in sync in both places (static gametile.astro + recent-row JS template in index.astro) — required, done.
• PR description is now accurate (prior stale claims about SEO cleanup/redirects are gone).

Nit (non-blocking)

• maxAttempts = 150 × 200ms = 30s of "Loading game..." for the non-onerror failure modes (CSP/adblock abort, RufflePlayer.newest never becoming ready). Generous polling helps slow networks, but 30s is long UX-wise. Consider 75 (~15s) as a middle ground. The polling itself is cheap, so this is purely a UX-timeout tradeoff.

Note on INP framing

• Real win is the defer (less parser/main-thread blocking during load). Dropping hover:shadow-lg is directionally correct (shadow = paint, scale-105 = compositor-only transform) but it's a minor hover-paint cleanup, not an INP-path fix. Current description frames this appropriately — no change needed.

Could not run bun run lint (bun unavailable in this runner); relying on author's reported lint + build pass and preview verification.

opencode session  |  github run

[opencode-agent]

Review: PR #85 — Defer Ruffle and remove hover shadows

Verdict: Approve. Small, correct, and responsive to prior feedback.

Diff reviewed (HEAD~3..HEAD)

• src/components/flash.astro:37 — ruffle.js gets defer + onerror="window.__ruffleFailed=true"
• src/components/flash.astro:110-120 — polling comment updated, maxAttempts 50 → 75, fast-fail on window.__ruffleFailed
• src/components/gametile.astro:19, src/pages/index.astro:71 — drop hover:shadow-lg, keep hover:scale-105

Correct

• defer (not async) is the right call for the 451KB ruffle.js: unblocks HTML parsing while preserving execution order before DOMContentLoaded. The inline init script runs during parsing, so the existing polling fallback remains required — updated comment is accurate.
• onerror fast-fail resolves the prior 30s-wait concern for the 404/offline case. Verified no CSP script-src in the repo to block the inline handler, and the pattern (is:inline + defer) is already established in src/layout/layout.astro.
• maxAttempts = 75 × 200ms ≈ 15s is a good middle ground per the prior nit — generous for slow networks without the 30s stare from the earlier 150 revision.
• Tile change is synced in both places (static gametile.astro + recent-row JS template in index.astro). Confirmed via search: zero remaining hover:shadow in src/.
• PR description is now accurate (stale SEO/redirect claims gone, framing is "minor paint cleanup" + deferred parse).

Nits (non-blocking)

• Title still says "reduce INP latency" — the defer plausibly helps load-window INP (less parser/main-thread blocking), the shadow removal does not (hover paint ≠ INP path). Fine as-is, just don't claim Lighthouse INP deltas from the shadow part.

Verification note

Could not run bun run lint / bun run check — bun and node_modules/prettier are unavailable in this runner. Relying on author's reported lint + build pass and live preview (ruffle-player created, no error). Diff is 3 one-line-class changes plus a guarded branch, so risk is minimal.

opencode session  |  github run