feat(perf): migrate second-wave image consumers to OptimizedImage (#161)

[wab]

Summary

• Extends OptimizedImage with optional onError prop (TDD: red→green on optimized-image.test.tsx)
• Migrates 9 components to OptimizedImage, replacing raw <img> tags and adding intrinsic width/height where missing — the main CLS fix

Components migrated

Component	File	Dimensions added
BlogItem	blog/blog-item.tsx	1200×630 (blog OG ratio)
StoryItem (×4 imgs)	stories/story-item.tsx	already present; above-fold cards use priority={index < 4}
StoryQuoteBlock	stories/story-quote-block.tsx	600×375
TeamMemberCard (about)	about/team-member-card.tsx	128×128
TeamMemberCard (studio)	studio/team-member-card.tsx	128×128
MemberCard	member/member-card.tsx	100×100 (pre-existing); now uses onError via new prop
ClientCarousel	ClientCarousel.tsx	logo — no fixed dims
ClientMarquee	home/client-marquee.tsx	logo — no fixed dims; onError for broken logos
OfficesSection (×2 imgs)	jobs/offices-section.tsx	800×600 (4:3) + 1200×800

Out of scope

• story-header.tsx: logo uses fetchPriority="high" + loading="eager" which maps to priority=true. Migrating with priority=false would regress it to lazy. Left as-is pending a separate decision.
• jobs/hero-section.tsx: same reason — existing priority treatment.

Test plan

• pnpm check && pnpm typecheck green
• pnpm test:run — only pre-existing navbar flake fails (unrelated)
• optimized-image.test.tsx 10/10 (includes new onError test)
• Visual: compare 5 listing pages (blog, stories, jobs, about, studio) before/after in dev
• CLS comparison against 2026-05-15 baseline once deployed

Closes #161

[vercel]

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

Project	Deployment	Actions	Updated (UTC)
ocobo	Ready	Preview	May 15, 2026 10:34am