refactor: split platform-specific code into platform-vercel and platform-cloudflare packages

.github/CODEOWNERS

@@ -27,8 +27,10 @@ turbo.json @nodejs/nodejs-website @nodejs/web-infra
 crowdin.yml @nodejs/web-infra
 apps/site/redirects.json @nodejs/web-infra
 apps/site/site.json @nodejs/web-infra
-apps/site/wrangler.jsonc @nodejs/web-infra
-apps/site/open-next.config.ts @nodejs/web-infra
+apps/cloudflare/wrangler.jsonc @nodejs/web-infra
+apps/cloudflare/open-next.config.ts @nodejs/web-infra
+apps/cloudflare/next.platform.config.mjs @nodejs/web-infra
+apps/vercel/next.platform.config.mjs @nodejs/web-infra
 apps/site/redirects.json @nodejs/web-infra
 
 # Critical Documents

.github/workflows/playwright-cloudflare-open-next.yml

@@ -50,12 +50,19 @@ jobs:
         working-directory: apps/site
         run: node_modules/.bin/playwright install --with-deps
 
+      - name: Build open-next site
+        working-directory: apps/cloudflare
+        run: node --run cloudflare:build:worker
+        env:
+          NEXT_PUBLIC_DEPLOY_TARGET: cloudflare
+          NODE_OPTIONS: --conditions=cloudflare
+
       - name: Run Playwright tests
         working-directory: apps/site
         run: node --run playwright
         env:
-          PLAYWRIGHT_RUN_CLOUDFLARE_PREVIEW: true
-          PLAYWRIGHT_BASE_URL: http://127.0.0.1:8787
+          NEXT_PUBLIC_DEPLOY_TARGET: cloudflare
+          NODE_OPTIONS: --conditions=cloudflare
 
       - name: Upload Playwright test results
         if: always()

.github/workflows/tmp-cloudflare-open-next-deploy.yml

@@ -50,18 +50,18 @@ jobs:
           cache: 'pnpm'
 
       - name: Install packages
-        run: pnpm install --frozen-lockfile
+        run: pnpm install --frozen-lockfile --filter=@node-core/website... --filter=@node-core/platform-cloudflare...
 
       - name: Build blog data
         working-directory: apps/site
         run: node --run build:blog-data
 
       - name: Build open-next site
-        working-directory: apps/site
+        working-directory: apps/cloudflare
         run: node --run cloudflare:build:worker
 
       - name: Deploy open-next site
-        working-directory: apps/site
+        working-directory: apps/cloudflare
         run: node --run cloudflare:deploy
         env:
           CF_WORKERS_SCRIPTS_API_TOKEN: ${{ secrets.CLOUDFLARE_API_TOKEN }}

apps/cloudflare/next.platform.config.mjs

@@ -0,0 +1,49 @@
+import { createRequire } from 'node:module';
+import { relative } from 'node:path';
+
+import { getDeploymentId } from '@opennextjs/cloudflare';
+
+const require = createRequire(import.meta.url);
+
+/**
+ * Platform config contributed by the Cloudflare deployment target.
+ *
+ * Consumed by `apps/site/next.config.mjs` via the platform-config loader.
+ * Must export a default `{ nextConfig, aliases, images }` shape — any of
+ * which may be omitted when the platform has nothing to contribute.
+ *
+ * @type {import('../site/next.platform.config').PlatformConfig}
+ */
+export default {
+  nextConfig: {
+    // Skew protection: Cloudflare routes requests by deploymentId so that
+    // a client and the worker stay in sync across rolling deploys.
+    deploymentId: await getDeploymentId(),
+  },
+  aliases: {
+    '@platform/analytics': '@node-core/platform-cloudflare/analytics',
+    '@platform/instrumentation':
+      '@node-core/platform-cloudflare/instrumentation',
+  },
+  images: {
+    // Route optimized images through Cloudflare's Images service via the
+    // custom loader. `remotePatterns` do NOT apply here — Cloudflare
+    // enforces allowed origins at the edge instead.
+    loader: 'custom',
+    // Next.js joins `loaderFile` onto its own cwd (apps/site), so pass a
+    // path relative to that cwd rather than an absolute one. Resolving via
+    // `require.resolve` avoids the `new URL(..., import.meta.url)` pattern,
+    // which webpack rewrites as an asset reference and mangles at runtime.
+    loaderFile: relative(
+      process.cwd(),
+      require.resolve('@node-core/platform-cloudflare/image-loader')
+    ),
+  },
+  mdx: {
+    // Cloudflare workers can't load `shiki/wasm` via `WebAssembly.instantiate`
+    // with custom imports (blocked for security), so fall back to the
+    // JavaScript RegEx engine. Twoslash also needs a VFS we don't have here.
+    wasm: false,
+    twoslash: false,
+  },
+};

apps/site/open-next.config.ts → apps/cloudflare/open-next.config.ts

@@ -20,7 +20,8 @@ const cloudflareConfig = defineCloudflareConfig({
 
 const openNextConfig: OpenNextConfig = {
   ...cloudflareConfig,
-  buildCommand: 'pnpm build --webpack',
+  buildCommand:
+    'cross-env NEXT_PUBLIC_DEPLOY_TARGET=cloudflare NODE_OPTIONS=--conditions=cloudflare pnpm build --webpack',
   cloudflare: {
     skewProtection: { enabled: true },
   },

apps/cloudflare/package.json

@@ -0,0 +1,45 @@
+{
+  "name": "@node-core/platform-cloudflare",
+  "version": "1.0.0",
+  "private": true,
+  "type": "module",
+  "exports": {
+    "./analytics": "./src/analytics.tsx",
+    "./image-loader": "./src/image-loader.ts",
+    "./instrumentation": "./src/instrumentation.ts",
+    "./next.platform.config": "./next.platform.config.mjs",
+    "./playwright.platform.config": "./playwright.platform.config.mjs",
+    "./worker-entrypoint": "./src/worker-entrypoint.ts"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/nodejs/nodejs.org",
+    "directory": "apps/cloudflare"
+  },
+  "scripts": {
+    "cloudflare:build:worker": "cd ../site && opennextjs-cloudflare build --openNextConfigPath ../cloudflare/open-next.config.ts --config ../cloudflare/wrangler.jsonc",
+    "cloudflare:deploy": "cd ../site && opennextjs-cloudflare deploy --openNextConfigPath ../cloudflare/open-next.config.ts --config ../cloudflare/wrangler.jsonc",
+    "cloudflare:preview": "cd ../site && wrangler dev --config ../cloudflare/wrangler.jsonc",
+    "lint:types": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@flarelabs-net/wrangler-build-time-fs-assets-polyfilling": "^0.0.1",
+    "@opennextjs/cloudflare": "^1.19.3",
+    "@sentry/cloudflare": "^10.49.0",
+    "wrangler": "^4.77.0"
+  },
+  "peerDependencies": {
+    "next": "catalog:",
+    "react": "catalog:"
+  },
+  "devDependencies": {
+    "@cloudflare/workers-types": "^4.20260418.1",
+    "@playwright/test": "^1.58.2",
+    "@types/node": "catalog:",
+    "@types/react": "catalog:",
+    "typescript": "catalog:"
+  },
+  "engines": {
+    "node": ">=20"
+  }
+}

apps/cloudflare/playwright.platform.config.mjs

@@ -0,0 +1,18 @@
+/**
+ * Playwright overrides contributed by the Cloudflare deployment target.
+ *
+ * Consumed by `apps/site/playwright.config.ts` via the platform-config
+ * loader. Spins up the wrangler preview so E2E runs against the
+ * OpenNext worker artifact rather than `next dev`.
+ *
+ * @type {import('../site/playwright.platform.config').PlatformPlaywrightConfig}
+ */
+export default {
+  baseURL: 'http://127.0.0.1:8787',
+  webServer: {
+    stdout: 'pipe',
+    command: 'pnpm --filter=@node-core/platform-cloudflare cloudflare:preview',
+    url: 'http://127.0.0.1:8787',
+    timeout: 60_000 * 3,
+  },
+};

apps/cloudflare/src/analytics.tsx

@@ -0,0 +1 @@
+export default () => null;

apps/site/cloudflare/image-loader.ts → apps/cloudflare/src/image-loader.ts

@@ -1,8 +1,7 @@
 import type { ImageLoaderProps } from 'next/image';
 
-const normalizeSrc = (src: string) => {
-  return src.startsWith('/') ? src.slice(1) : src;
-};
+const normalizeSrc = (src: string) =>
+  src.startsWith('/') ? src.slice(1) : src;
 
 export default function cloudflareLoader({
   src,

apps/cloudflare/src/instrumentation.ts

@@ -0,0 +1 @@
+export const register = () => {};

apps/site/cloudflare/worker-entrypoint.ts → apps/cloudflare/src/worker-entrypoint.ts

@@ -11,7 +11,7 @@ import type {
   Request,
 } from '@cloudflare/workers-types';
 
-import { default as handler } from '../.open-next/worker.js';
+import { default as handler } from '../../site/.open-next/worker.js';
 
 export default withSentry(
   (env: {
@@ -50,4 +50,4 @@ export default withSentry(
   }
 );
 
-export { DOQueueHandler } from '../.open-next/worker.js';
+export { DOQueueHandler } from '../../site/.open-next/worker.js';

apps/cloudflare/tsconfig.json

@@ -0,0 +1,22 @@
+{
+  "compilerOptions": {
+    "target": "esnext",
+    "lib": ["dom", "dom.iterable", "esnext"],
+    "skipLibCheck": true,
+    "strict": true,
+    "forceConsistentCasingInFileNames": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "Bundler",
+    "customConditions": ["default"],
+    "isolatedModules": true,
+    "jsx": "react-jsx"
+  },
+  "include": [
+    "src",
+    "next.platform.config.mjs",
+    "playwright.platform.config.mjs"
+  ],
+  "exclude": ["src/worker-entrypoint.ts"]
+}

apps/cloudflare/turbo.json

@@ -0,0 +1,43 @@
+{
+  "$schema": "https://turbo.build/schema.json",
+  "extends": ["//"],
+  "tasks": {
+    "cloudflare:build:worker": {
+      "dependsOn": ["@node-core/website#build:blog-data"],
+      "inputs": [
+        "open-next.config.ts",
+        "wrangler.jsonc",
+        "src/**/*.ts",
+        "../site/{app,components,hooks,i18n,layouts,middlewares,pages,providers,types,util}/**/*.{ts,tsx}",
+        "../site/{app,components,layouts,pages,styles}/**/*.css",
+        "../site/{next-data,scripts,i18n}/**/*.{mjs,json}",
+        "../site/{app,pages}/**/*.{mdx,md}",
+        "../site/*.{md,mdx,json,ts,tsx,mjs,yml}"
+      ],
+      "outputs": ["../site/.open-next/**"],
+      "env": [
+        "NEXT_PUBLIC_DEPLOY_TARGET",
+        "NEXT_PUBLIC_BASE_URL",
+        "NEXT_PUBLIC_DIST_URL",
+        "NEXT_PUBLIC_DOCS_URL",
+        "NEXT_PUBLIC_BASE_PATH",
+        "NEXT_PUBLIC_ORAMA_API_KEY",
+        "NEXT_PUBLIC_ORAMA_ENDPOINT",
+        "NEXT_PUBLIC_DATA_URL",
+        "NEXT_GITHUB_API_KEY"
+      ]
+    },
+    "cloudflare:preview": {
+      "dependsOn": ["cloudflare:build:worker"],
+      "cache": false,
+      "persistent": true
+    },
+    "cloudflare:deploy": {
+      "dependsOn": ["cloudflare:build:worker"],
+      "cache": false
+    },
+    "lint:types": {
+      "cache": false
+    }
+  }
+}

apps/site/wrangler.jsonc → apps/cloudflare/wrangler.jsonc

@@ -1,14 +1,14 @@
 {
   "$schema": "./node_modules/wrangler/config-schema.json",
-  "main": "./cloudflare/worker-entrypoint.ts",
+  "main": "./src/worker-entrypoint.ts",
   "name": "nodejs-website",
   "compatibility_date": "2024-11-07",
   "compatibility_flags": ["nodejs_compat", "global_fetch_strictly_public"],
   "account_id": "fb4a2d0f103c6ff38854ac69eb709272",
   "minify": true,
   "keep_names": false,
   "assets": {
-    "directory": ".open-next/assets",
+    "directory": "../site/.open-next/assets",
     "binding": "ASSETS",
     "run_worker_first": true,
   },
@@ -31,13 +31,16 @@
     "head_sampling_rate": 1,
   },
   "build": {
+    // Run the asset polyfiller from apps/site so that `pages`, `snippets`, and
+    // the `.open-next` output directory resolve against the Next.js app.
+    "cwd": "../site",
     "command": "wrangler-build-time-fs-assets-polyfilling --assets pages --assets snippets --assets-output-dir .open-next/assets",
   },
   "alias": {
-    "node:fs": "./.wrangler/fs-assets-polyfilling/polyfills/node/fs.ts",
-    "node:fs/promises": "./.wrangler/fs-assets-polyfilling/polyfills/node/fs/promises.ts",
-    "fs": "./.wrangler/fs-assets-polyfilling/polyfills/node/fs.ts",
-    "fs/promises": "./.wrangler/fs-assets-polyfilling/polyfills/node/fs/promises.ts",
+    "node:fs": "../site/.wrangler/fs-assets-polyfilling/polyfills/node/fs.ts",
+    "node:fs/promises": "../site/.wrangler/fs-assets-polyfilling/polyfills/node/fs/promises.ts",
+    "fs": "../site/.wrangler/fs-assets-polyfilling/polyfills/node/fs.ts",
+    "fs/promises": "../site/.wrangler/fs-assets-polyfilling/polyfills/node/fs/promises.ts",
   },
   "r2_buckets": [
     {

apps/site/app/[locale]/@analytics/default.tsx

@@ -0,0 +1 @@
+export { default } from '@platform/analytics';

apps/site/app/[locale]/layout.tsx

@@ -1,25 +1,27 @@
 import { availableLocales, defaultLocale } from '@node-core/website-i18n';
-import { Analytics } from '@vercel/analytics/react';
-import { SpeedInsights } from '@vercel/speed-insights/next';
 import classNames from 'classnames';
 import { NextIntlClientProvider } from 'next-intl';
 
 import BaseLayout from '#site/layouts/Base';
-import { VERCEL_ENV } from '#site/next.constants.mjs';
 import { IBM_PLEX_MONO, OPEN_SANS } from '#site/next.fonts';
 import { ThemeProvider } from '#site/providers/themeProvider';
 
-import type { FC, PropsWithChildren } from 'react';
+import type { FC, PropsWithChildren, ReactNode } from 'react';
 
 import '#site/styles/index.css';
 
 const fontClasses = classNames(IBM_PLEX_MONO.variable, OPEN_SANS.variable);
 
 type RootLayoutProps = PropsWithChildren<{
   params: Promise<{ locale: string }>;
+  analytics: ReactNode;
 }>;
 
-const RootLayout: FC<RootLayoutProps> = async ({ children, params }) => {
+const RootLayout: FC<RootLayoutProps> = async ({
+  children,
+  analytics,
+  params,
+}) => {
   const { locale } = await params;
 
   const { langDir, hrefLang } =
@@ -46,12 +48,7 @@ const RootLayout: FC<RootLayoutProps> = async ({ children, params }) => {
           href="https://social.lfx.dev/@nodejs"
         />
 
-        {VERCEL_ENV && (
-          <>
-            <Analytics />
-            <SpeedInsights />
-          </>
-        )}
+        {analytics}
       </body>
     </html>
   );

apps/site/eslint.config.js

@@ -6,15 +6,7 @@ import baseConfig from '../../eslint.config.js';
 
 export default baseConfig.concat([
   {
-    ignores: [
-      'pages/en/blog/**/*.{md,mdx}/**',
-      'public',
-      'next-env.d.ts',
-      // The worker entrypoint is bundled by wrangler, not tsc. Its imports
-      // trigger a tsc crash (see tsconfig.json), so it is excluded from both
-      // type checking and ESLint's type-aware linting.
-      'cloudflare/worker-entrypoint.ts',
-    ],
+    ignores: ['pages/en/blog/**/*.{md,mdx}/**', 'public', 'next-env.d.ts'],
   },
 
   eslintReact.configs['recommended-typescript'],

apps/site/instrumentation.ts

@@ -1,7 +1 @@
-export async function register() {
-  if (!('Cloudflare' in globalThis)) {
-    // Note: we don't need to set up the Vercel OTEL if the application is running on Cloudflare
-    const { registerOTel } = await import('@vercel/otel');
-    registerOTel({ serviceName: 'nodejs-org' });
-  }
-}
+export { register } from '@platform/instrumentation';