perf: SSR homepage and load fonts progressively #3

Merged

waylon merged 5 commits from perf/homepage-ssr-progressive-fonts into main 2026-10-13 20:14:53 -05:00

Conversation 0 Commits 5 Files changed 36 +128968 -56

waylon commented 2026-10-13 16:37:03 -05:00

Owner

• Copy link
• Copy Markdown

Summary

• Server-render the newest ready public video on /, including its poster and useful no-JavaScript content. Hydration adopts that card and continues with the cursor feed without duplication.
• Keep desktop WOFF2 subsets and use baseline mobile font behavior with mobile-only Monocraft preload. This avoids the late font/style work that caused the earlier mobile TBT regression while retaining desktop font savings.
• Preserve existing player, pagination, permalinks, no-JavaScript /watch, cache/ETag/gzip behavior, and full FFmpeg caption fonts.
• Keep the concise report and screenshots; remove the large retained raw Lighthouse traces and JSON reports.

Measured results

Three cold Lighthouse 12.8.2 / Chromium 153 runs per case, matched 10-video fixture and simulated mobile network/CPU settings (412×823, 150 ms RTT, 1,638.4 Kbps, 4× CPU). Baseline 972b797; selected candidate includes CSS feed-progressive-9 and JS feed-progressive-6.

Mobile median	Baseline	Candidate
Performance	89	88
FCP	1.565 s	1.218 s
LCP	2.398 s	2.417 s
CLS	0.01844	0.00093
TBT	363 ms (80–477)	427 ms (335–515)
Font transfer	59,878 B / 2 fonts	59,878 B / 2 fonts

LCP is effectively at parity and CLS improves. FCP/TBT are noisy; candidate TBT median is 64 ms higher, so this PR does not claim a TBT improvement. In matched runs Style/Layout is similar and the major earlier regression traced to fonts has been removed. Desktop median LCP improves from 709 ms to 635 ms and font transfer drops from 244,261 B to 117,663 B (52%). See performance report for methods and caveats.

Current screenshots

Verification

• just check: 59 tests passed; Ruff lint/format, ty, and FFmpeg render smoke all pass.
• Chromium interactions with the 10-video feed: SSR hydration without duplicates; playback, pause, mute, scroll/pagination, and direct permalink/back navigation passed. The first active video and subsequent scrolled-to video play while inactive videos remain paused.
• JavaScript-disabled homepage shows the SSR video, poster, title/author/source, and native controls.
• Cache response check: public s-maxage=60, ETag, Vary: Accept-Encoding; gzip response returned content-encoding: gzip.
• /create renders the existing guest-gated shell. Creator-only operations were not exercised without creator credentials.

CI and merge status

.forgejo/workflows/quality.yml is removed per request; this repository will use its documented local checks (just check, backed by locked uv dependencies). Historical Forgejo runs were red and their jobs endpoint returned 404, but no new Actions run is expected. The current local check passes. Mobile TBT remains noisy with a modestly higher median, which is documented as a tradeoff; LCP is near baseline and CLS improves.

## Summary - Server-render the newest ready public video on `/`, including its poster and useful no-JavaScript content. Hydration adopts that card and continues with the cursor feed without duplication. - Keep desktop WOFF2 subsets and use baseline mobile font behavior with mobile-only Monocraft preload. This avoids the late font/style work that caused the earlier mobile TBT regression while retaining desktop font savings. - Preserve existing player, pagination, permalinks, no-JavaScript `/watch`, cache/ETag/gzip behavior, and full FFmpeg caption fonts. - Keep the concise report and screenshots; remove the large retained raw Lighthouse traces and JSON reports. ## Measured results Three cold Lighthouse 12.8.2 / Chromium 153 runs per case, matched 10-video fixture and simulated mobile network/CPU settings (412×823, 150 ms RTT, 1,638.4 Kbps, 4× CPU). Baseline `972b797`; selected candidate includes CSS `feed-progressive-9` and JS `feed-progressive-6`. | Mobile median | Baseline | Candidate | |---|---:|---:| | Performance | 89 | 88 | | FCP | 1.565 s | 1.218 s | | LCP | 2.398 s | 2.417 s | | CLS | 0.01844 | 0.00093 | | TBT | 363 ms (80–477) | 427 ms (335–515) | | Font transfer | 59,878 B / 2 fonts | 59,878 B / 2 fonts | LCP is effectively at parity and CLS improves. FCP/TBT are noisy; candidate TBT median is 64 ms higher, so this PR does not claim a TBT improvement. In matched runs Style/Layout is similar and the major earlier regression traced to fonts has been removed. Desktop median LCP improves from 709 ms to 635 ms and font transfer drops from 244,261 B to 117,663 B (52%). See [performance report](https://git.waylonwalker.com/waylon/brainrot.waylonwalker.com/src/commit/0955366/performance-reports/2026-10-13/summary.md) for methods and caveats. ### Current screenshots   ## Verification - `just check`: 59 tests passed; Ruff lint/format, ty, and FFmpeg render smoke all pass. - Chromium interactions with the 10-video feed: SSR hydration without duplicates; playback, pause, mute, scroll/pagination, and direct permalink/back navigation passed. The first active video and subsequent scrolled-to video play while inactive videos remain paused. - JavaScript-disabled homepage shows the SSR video, poster, title/author/source, and native controls. - Cache response check: public `s-maxage=60`, ETag, `Vary: Accept-Encoding`; gzip response returned `content-encoding: gzip`. - `/create` renders the existing guest-gated shell. Creator-only operations were not exercised without creator credentials. ## CI and merge status `.forgejo/workflows/quality.yml` is removed per request; this repository will use its documented local checks (`just check`, backed by locked `uv` dependencies). Historical Forgejo runs were red and their jobs endpoint returned 404, but no new Actions run is expected. The current local check passes. Mobile TBT remains noisy with a modestly higher median, which is documented as a tradeoff; LCP is near baseline and CLS improves.

waylon added 2 commits 2026-10-13 16:37:03 -05:00

fix: hide and wrap no-JS account hint bdbbefa59f

perf: streamline homepage and font loading 45912f74ad

waylon force-pushed perf/homepage-ssr-progressive-fonts from 45912f74ad to e5813cde78 2026-10-13 16:37:32 -05:00 Compare

waylon added 1 commit 2026-10-13 18:05:39 -05:00

docs: record controlled lighthouse investigation 8f9989bdf1

waylon added 1 commit 2026-10-13 20:02:22 -05:00

perf: stabilize mobile SSR font treatment e6dc9030f7

waylon added 1 commit 2026-10-13 20:02:35 -05:00

docs: retain current Brainrot screenshots 09553663cb

waylon added 1 commit 2026-10-13 20:13:55 -05:00

chore: remove unused Forgejo Actions workflow 4dca9e79f1

waylon merged commit 60301dadbe into main 2026-10-13 20:14:53 -05:00

waylon referenced this pull request from a commit 2026-10-13 20:14:53 -05:00

Merge pull request 'perf: SSR homepage and load fonts progressively' (#3) from perf/homepage-ssr-progressive-fonts into main

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels

No items

No labels

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference

waylon/brainrot.waylonwalker.com!3

No description provided.