Skip to content

perf(chatbot): lazy-load + RSC marketing layout#40

Open
abdout wants to merge 1 commit into
mainfrom
perf/chatbot-lazy-rsc-layout
Open

perf(chatbot): lazy-load + RSC marketing layout#40
abdout wants to merge 1 commit into
mainfrom
perf/chatbot-lazy-rsc-layout

Conversation

@abdout
Copy link
Copy Markdown
Contributor

@abdout abdout commented Apr 25, 2026

Summary

  • `(marketing)/layout.tsx` was a client component purely to hold a chatbot `useRef`. Investigation: `onChatClick` prop was passed through 4 layers but never actually called. Dead plumbing.
  • Converts the layout to RSC, drops the dead prop chain, lazy-loads the chatbot via `next/dynamic` in a tiny client island.

Why this matters

All marketing pages (`/`, `/pricing`, `/service`) now run server-first. Chatbot bundle is no longer in the critical path — fetched only when needed. PERFORMANCE.md claimed "lazy loading of chat window" but it wasn't true; this makes it true.

Changes

  • New: `src/components/chatbot/lazy.tsx` — `` client island wrapping `next/dynamic(ChatbotContent, { ssr: false })`
  • `src/app/[lang]/(marketing)/layout.tsx` — RSC, drops `useRef` + handler + `use client`
  • `src/components/template/site-header/content.tsx` — drops `onChatClick` prop
  • `src/components/template/site-header/client.tsx` — drops `onChatClick` prop
  • `src/components/template/site-header/right-actions.tsx` — drops unused `onChatClick` prop

Test plan

  • `pnpm build` succeeds; layout is in server bundle
  • Network tab on `/` shows chatbot chunk loaded after main content
  • Chatbot button still opens the chat window on `/`, `/pricing`, `/service`
  • LCP improves on marketing routes
  • No `onChatClick` references in repo

Closes #39

🤖 Generated with Claude Code

The (marketing) layout was 'use client' purely to hold a useRef for
chatbot's imperative openChat. But onChatClick was drilled through 4
layers and never invoked — RightActions ignores it, MobileHeader
doesn't receive it. Dead plumbing.

- Drop onChatClick from layout, SiteHeader, SiteHeaderClient,
  RightActions
- Convert (marketing)/layout.tsx to server component
- Lazy-load ChatbotContent via next/dynamic in a tiny <LazyChatbot/>
  island so the chatbot bundle is no longer in the marketing critical
  path. Honors PERFORMANCE.md's claim of "lazy loading chat window"
  which was actually unimplemented.

Closes #39

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 25, 2026

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

Project Deployment Actions Updated (UTC)
marketing Ready Ready Preview, Comment Apr 25, 2026 3:11pm

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

perf(chatbot): lazy-load via next/dynamic + convert (marketing) layout to RSC

1 participant