Skip to content

perf: deduplicate common namespace serialization across layout and page providers#17682

Draft
pettinarip wants to merge 1 commit intodevfrom
perf/deduplicate-common-namespace
Draft

perf: deduplicate common namespace serialization across layout and page providers#17682
pettinarip wants to merge 1 commit intodevfrom
perf/deduplicate-common-namespace

Conversation

@pettinarip
Copy link
Copy Markdown
Member

Summary

  • Eliminate double-serialization of the common i18n namespace in HTML payload
  • Layout provider serializes "common" once; page providers now merge parent messages instead of replacing them
  • No changes needed to any of the 29 page files — the merge happens automatically in I18nProvider

Problem

The common namespace (~26KB) was serialized twice on every page:

  1. Layout-level NextIntlClientProvider in providers.tsx serialized it for layout components
  2. Page-level I18nProvider also included it via getRequiredNamespacesForPage()

Per next-intl behavior, nested providers treat messages as atomic replacements — the page provider's messages completely replaced the layout's. This forced pages to re-include "common".

Solution (3 files)

  1. providers.tsx — Use NextIntlClientProvider directly as root provider (no merging needed)
  2. I18nProvider.tsx — Call useMessages() to get parent provider's messages and merge with page-specific messages on the client
  3. translations.ts — Remove "common" from getRequiredNamespacesForPage() base namespaces

How it works

Layout: serializes { common: {...} } once → NextIntlClientProvider
  └── Page: serializes only { "page-wallets": {...} } → I18nProvider
        ├── useMessages() returns { common: {...} } from parent
        ├── merged = { common: {...}, "page-wallets": {...} }
        └── NextIntlClientProvider gets merged messages

Test plan

  • TypeScript type check passes (pnpm tsc --noEmit)
  • Production build succeeds (pnpm build)
  • Desktop nav: click through all 5 sections, verify labels render
  • Mobile nav: open hamburger menu, verify labels, theme toggle, search
  • Search modal: verify all UI strings on desktop and mobile
  • FeedbackWidget: click floating dot, verify prompt and yes/no buttons
  • RTL locale (e.g. /ar/): verify nav direction and layout
  • HTML payload: verify "common" namespace appears only once

@github-actions github-actions Bot added documentation 📖 Change or add documentation tooling 🔧 Changes related to tooling of the project labels Feb 27, 2026
@pettinarip pettinarip marked this pull request as draft February 27, 2026 15:30
Base automatically changed from perf/lazy-load-mobile-menu to dev March 10, 2026 22:47
@github-actions
Copy link
Copy Markdown
Contributor

This issue is stale because it has been open 30 days with no activity.

@github-actions github-actions Bot added the Status: Stale This issue is stale because it has been open 30 days with no activity. label Apr 10, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

documentation 📖 Change or add documentation Status: Stale This issue is stale because it has been open 30 days with no activity. tooling 🔧 Changes related to tooling of the project

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant