Nt 3090 nextjs ssr hybrid#257
Merged
Lotfi Anwar L Arif (Lotfi-Arif) merged 17 commits intomainfrom May 6, 2026
Merged
Conversation
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.
and client-resolved demo
localStorage crash
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.
Collaborator
|
We may want to change the name of the implementation folder to something like |
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.
Charles Hudson (phobetron)
approved these changes
May 6, 2026
Collaborator
Charles Hudson (phobetron)
left a comment
There was a problem hiding this comment.
Very nice! Especially the README. Hopefully that ESLint version issue gets fixed soon.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
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:lintscript runs ESLint 10 (installed at the repo root) against all implementations/ code. When it hits the Next.js implementation, ESLint 10 resolveseslint-plugin-react@7.37.5from that implementation'snode_modules. That plugin version usescontext.getFilename(), an API removed in ESLint 10, causing a TypeError that crashes the entire lint run.vercel/next.js#89764