Skip to content

Nt 3090 nextjs ssr hybrid#257

Merged
Lotfi Anwar L Arif (Lotfi-Arif) merged 17 commits intomainfrom
NT-3090-nextjs-ssr-hybrid
May 6, 2026
Merged

Nt 3090 nextjs ssr hybrid#257
Lotfi Anwar L Arif (Lotfi-Arif) merged 17 commits intomainfrom
NT-3090-nextjs-ssr-hybrid

Conversation

@Lotfi-Arif
Copy link
Copy Markdown
Contributor

@Lotfi-Arif Lotfi Anwar L Arif (Lotfi-Arif) commented May 5, 2026

SSR-primary personalization pattern for Next.js App Router. The Node SDK resolves all content variants server-side (zero flicker, zero client JS for content). The React Web SDK hydrates separately for analytics only; page tracking, interaction tracking (views/clicks/hovers), consent, and identify. The cookie ctfl-opt-aid bridges the identity between the server and the client. Content updates are visible only on the next server round trip; client actions update the profile but don't swap variants in place.

Note: The root implementation:lint script runs ESLint 10 (installed at the repo root) against all implementations/ code. When it hits the Next.js implementation, ESLint 10 resolves eslint-plugin-react@7.37.5 from that implementation's node_modules. That plugin version uses context.getFilename(), an API removed in ESLint 10, causing a TypeError that crashes the entire lint run.

vercel/next.js#89764

Restructure the bare create-next-app scaffold into a proper monorepo
implementation with both React Web SDK and Node SDK dependencies,
PM2-managed mock/serve scripts, env config, and AGENTS.md aligned
with existing implementation patterns.
Replace the useState/useEffect mount guard with a dedicated
ClientProviderWrapper that uses next/dynamic({ ssr: false }). This is
the standard Next.js pattern for browser-only third-party SDKs and
keeps OptimizationProvider clean without SSR workarounds.
- Add Node SDK server singleton and Next.js middleware for cookie
  lifecycle (ctfl-opt-aid profile management).
- Add server-resolved page: Server Component fetches entries and
  resolves them via Node SDK, renders pure server HTML with zero
  client JS for content.
- Add InteractiveControls as a small 'use client' component for
  consent/identify on the server-resolved route.
- Isolate SDK setup per route: each route has its own layout with
  its own ClientProviderWrapper, root layout is neutral.
- Remove custom OptimizationProvider wrapper; use SDK's
  OptimizationRoot directly via dynamic import.
Document isolated route layouts, server-resolved vs client-resolved
patterns, design decisions, cookie-based profile management, and the
singleton dev-mode recovery tip.
… direction

Add context on why this reference implementation exists, the known
singleton conflict when navigating between routes, and plans to
gather customer architecture patterns from pre/post-sales to inform
which setups to prioritize.
Standalone Next.js App Router implementation where the Node SDK
resolves entries server-side and the React SDK hydrates for event
tracking and interactive controls (consent, identify). Runs on port
3001 to avoid conflicts with the CSR implementation.
This branch only needs the SSR hybrid implementation
(react-web-sdk+node-sdk_nextjs). The CSR-only implementation will
live on its own branch.
Superseded by the actual reference implementations.
@phobetron
Copy link
Copy Markdown
Collaborator

We may want to change the name of the implementation folder to something like implementations/react-web-sdk+node-sdk_nextjs-ssr to help differentiate it from other NextJS implementations.

The root ESLint (v10) is incompatible with eslint-plugin-react pulled
by eslint-config-next. The Next.js implementations have their own
local eslint.config.mjs and are linted via their own setup.
Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Very nice! Especially the README. Hopefully that ESLint version issue gets fixed soon.

@Lotfi-Arif Lotfi Anwar L Arif (Lotfi-Arif) merged commit 607627b into main May 6, 2026
31 checks passed
@Lotfi-Arif Lotfi Anwar L Arif (Lotfi-Arif) deleted the NT-3090-nextjs-ssr-hybrid branch May 6, 2026 14:17
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.

2 participants