Public sites perf · Phase 1: page weight (server-rendered blocks, lazy chat, images, fonts) #71

Part of the public-site performance plan (master issue linked above). Needs no CDN or new infrastructure.

Goal

Reduce how much JavaScript and how many bytes each public page sends, so LCP, INP and CLS improve whatever the TTFB.

Tasks

• Record a baseline first: Lighthouse on a sample tenant (home, docs page, blog post) plus server-side TTFB, so each change below can be measured.
• Render pages with server components. (Improve public site rendering performance #78) Today packages/page-builder/scripts/add-use-client.mjs marks every built file "use client", and src/renderer/page-renderer.tsx and apps/sites/components/site-page-renderer.tsx are client components, so the whole layout JSON and every block ship to the browser and run there.
  • Add a renderer entry that works on the server. Static blocks render on the server; only interactive blocks (FAQ, marquee, forms, theme mode switcher, docs search) stay client components.
  • Exclude that entry from the post-build "use client" step. The builder entry used by apps/web stays fully client.
  • Move theme resolution (resolveSiteTheme) out of the client wrapper.
• Lazy-load the chat widget (Improve public site rendering performance #78) (apps/sites/app/sites/[teamId]/layout.tsx): render only the launcher button; load the panel when the browser is idle or on first interaction.
• Images: (Improve public site rendering performance #78; article/feed images in perf(sites): optimize article and feed images; record Phase 1 measurements (#71) #142) use next/image (built-in optimizer) for MediaLit images, with width/height, lazy loading below the fold, and fetchpriority="high" on the hero/LCP image. Leave room for a configurable loader later (IMAGE_LOADER).
• Lock down images.remotePatterns (Improve public site rendering performance #78, IMAGE_REMOTE_HOSTS) in apps/sites/next.config.mjs. It is hostname: "**" today, which makes the optimizer an open image proxy; limit it to the media host(s).
• Preload the active theme fonts only. (Improve public site rendering performance #78) Fonts are self-hosted with preload: false (apps/sites/lib/fonts.ts); add <link rel="preload"> for the fonts the active theme uses.
• Code injection: (Improve public site rendering performance #78, injected when idle) make sure tenant codeInjectionHead/Body scripts don't block rendering (defer where possible).

Done when

• Lighthouse and Web Vitals are measurably better than the baseline on the sample tenant.
• The editor preview in apps/web still works unchanged.