How to detect Next.js on any website
Production-grade React framework from Vercel — the most-used meta-framework on the web.
Official siteWhat is Next.js?
Next.js is a React framework that ships server rendering, file-based routing, API routes, image optimization and a build toolchain as a single package. Since version 13 it has shipped two router paradigms — Pages Router and App Router — which are both still in active use.
Next.js occupies a unique position in the React ecosystem. It's a framework that most of the React team's contributors use and influence, it has first-party hosting via Vercel (where several Next core maintainers work), and its choices tend to become the de-facto standard for how production React apps are built. When Server Components, Server Actions, partial prerendering or edge runtime streaming hit Next first, they hit the rest of the React ecosystem shortly after. That's why knowing whether a site uses Next.js matters more than most other framework-identification questions: the answer tells you not just 'they chose Next' but also roughly what year they last rewrote their frontend, what patterns they're likely using, and what their hosting arrangements are. Pages Router (v9-onward) and App Router (v13-onward) represent two different mental models for routing and data, and many large apps deliberately run both in parallel during long-running migrations.
Why it matters to identify
Next.js powers a large share of production React sites — Vercel deploys alone account for millions of apps, and most big React-based SaaS products eventually end up on Next in some form. Identifying Next.js tells you a lot about a site's constraints: server-rendered vs static, App Router vs Pages, likely hosting (Vercel dominates but isn't required), likely state libraries (TanStack Query, SWR, Zustand). It also predicts performance characteristics — Next's default chunking, its specific ISR and streaming behaviors, its image optimization pipeline — all of which shape how the site feels to users.
A brief history of Next.js
Next.js was released in October 2016 by Vercel (then ZEIT) as a minimal opinionated framework for building SSR React apps. Early versions (1.x-8.x) focused on the file-based routing + getInitialProps model. v9 (2019) introduced API routes and `getStaticProps`/`getServerSideProps`. v10 (2020) added Image component and i18n. v12 (2021) introduced Middleware and the SWC-based compiler. v13 (2022) was a major inflection point: the App Router, React Server Components and the streaming model went into stable. v14 (2023-2024) refined Server Actions and Partial Prerendering. v15 (2024) added React 19 support and Turbopack dev builds. The pattern over time has been 'invent something in Next, see it adopted across React'. The App Router is the most consequential example — it pushed the whole React ecosystem toward Server Components, a model that didn't meaningfully exist before Next made it consumable.
Ecosystem and common pairings
A typical production Next.js stack in 2026 looks like: Next.js + React + Tailwind CSS + shadcn/ui (or a Radix/Base-UI pairing) + a data-fetching library (TanStack Query or SWR) + a form library (React Hook Form or Conform) + Zod for validation + Prisma or Drizzle for database + NextAuth (or Clerk) for auth, hosted on Vercel or Cloudflare. Analytics is commonly PostHog, Vercel Analytics or Google Analytics. Error tracking is Sentry. Payments are Stripe. The stack-around-Next is predictable enough that detecting Next.js lets you make reasonable guesses about the rest with high accuracy.
Detection signals we look at
Each signal alone is rarely conclusive; the detector cross-references all of them and weights by confidence. You can reproduce any of these checks yourself in Chrome DevTools.
#__next
Pages Router apps wrap every page in `<div id="__next">`. App Router apps don't.
How to reproduce: Elements panel, search `__next`.
__NEXT_DATA__
Pages Router injects a `<script id="__NEXT_DATA__" type="application/json">` with page props. App Router uses `self.__next_f.push(...)` flight payloads instead.
How to reproduce: View source, search `__NEXT_DATA__` or `self.__next_f`.
_next/static/chunks/
Both router paradigms load JS chunks from `/_next/static/chunks/`. The subdirectory tells you the router: `pages/` or `app/`.
How to reproduce: Network tab, filter by `_next/static`.
x-powered-by: Next.js
Self-hosted Next often sets `X-Powered-By: Next.js <version>` on document responses. Vercel sites add `X-Vercel-Id`.
How to reproduce: Network tab → document request → Response Headers.
window.__NEXT_DATA__ or window.next
Runtime globals populated by the Next.js client runtime.
How to reproduce: Console: type `__NEXT_DATA__` and inspect the payload.
node_modules/next/
When sourcemaps are exposed, `node_modules/next/` paths in `sources[]` prove Next.js is bundled. `node_modules/next/package.json` gives exact version.
How to reproduce: Install Sourcemap Explorer, or fetch a .map file and search `sources[]`.
__Secure-next-auth.session-token
NextAuth cookies on a site strongly imply Next.js, because NextAuth is a Next-specific auth library.
How to reproduce: DevTools → Application → Cookies.
Versioning
What you typically see in production
On a fresh visit to a Next.js site you can usually identify the major version within 30 seconds: `X-Powered-By` header if self-hosted gives it directly, sourcemap gives it authoritatively, and even without both the presence of `self.__next_f.push` vs `__NEXT_DATA__` narrows the router choice which correlates loosely with major version (App Router is 13+).
Sites commonly running Next.js
- vercel.com
- nike.com (parts of)
- tiktok.com
- hulu.com
- notion.so
- openai.com
- claude.ai (parts of)
When you see Next.js, also check for
- React (always, it's the underlying library)
- NextAuth.js (very common auth choice)
- Tailwind CSS + shadcn/ui (popular UI stack)
- TanStack Query or SWR (data fetching)
- Prisma or Drizzle ORM (if there's a database)
- Vercel Analytics + Vercel Speed Insights (if Vercel-hosted)
Often confused with
Next.js vs React
Every Next.js site is a React site, but not every React site is a Next.js site. Look for `_next/static/` paths and `__NEXT_DATA__` / App Router flight payloads to confirm Next specifically.
Next.js vs Vercel hosting
Vercel hosts many frameworks (Next, Remix, SvelteKit, Astro, static). A `X-Vercel-Id` header alone doesn't mean Next.js.
Next.js vs Create React App (CRA)
CRA apps have no `_next/` paths and no `__NEXT_DATA__`. They serve from `/static/js/main.<hash>.js`. CRA is deprecated (2023) but still found on older apps.
FAQ
How do I tell App Router from Pages Router?
App Router apps don't have `#__next` or `__NEXT_DATA__`. They stream RSC payloads via `self.__next_f.push(...)` in inline scripts. Pages Router has both wrappers.
Can Next.js be self-hosted?
Yes — any Node.js host (AWS, GCP, Fly, Render, self-managed servers) can run Next. Vercel is the default but not required. Server-rendering features like middleware/ISR need Node, but statically exported apps run on any static host.
Does detecting Next.js imply SSR?
Not necessarily. A Next.js app can be fully statically exported (SSG), server-rendered on every request (SSR), or mix both per-page. The presence of Next tells you it supports SSR; it doesn't tell you it uses SSR on the page you're viewing.
Is detecting Next.js useful for security research?
Yes — Next has a CVE history, and knowing the exact version (via sourcemap `package.json`) lets you correlate with known advisories. Some older Next versions have SSRF and XSS issues that are version-gated.
Related
See Next.js — with the exact version — on every site you visit.
Sourcemap Explorer runs these checks passively in the background. When the target library is bundled, you get the precise package.json-level version.