Next.js detector

Next.js logo

How do you detect if a website is built with Next.js by looking at the source code?

You can check for several hints in the page source:

  • Open the Page Source: Right-click on the webpage and select “View Page Source” or press Ctrl+U (Windows) or Cmd+Option+U (Mac) to open the page source code.
  • Look for the Next.js Markup: Search for specific scripts or markers that indicate the use of Next.js. Use Ctrl+F (Windows) or Cmd+F (Mac) to open the search function and look for the following keywords:
    • /_next/: This indicates the presence of Next.js assets. You might see URLs like https://example.com/_next/static/chunks/main.js.
  • Check for Next.js Versioning: Within the /_next/ directory, you might find version-specific information. Look for files named with versioning, for example, main-123456.js, which can indicate the Next.js version used.
  • Look for Next.js Rendering Markers: Next.js enables functionalities like SSR (Server-Side Rendering) and SSG (Static Site Generation). Look for the following:
    • Check for data-reactroot: This attribute is often found in the main HTML tag rendered by Next.js.
  • Search for Next.js Specific Meta Tags: Sometimes, websites using Next.js may include specific meta tags. Look for:
    • <meta name="next-head-count" content="X">: This tag indicates the number of head elements that Next.js has processed.
  • Inspect Network Activity: Open the Developer Tools (F12 or right-click and select “Inspect”) and navigate to the “Network” tab. Refresh the page and look for any requests to the /_next/ directory. This is a clear indicator that Next.js is being used.
  • Look for Dynamic Imports: In the page source or the JavaScript bundle, you might find indications of dynamic imports which are common in Next.js applications. Look for patterns such as import('...').
  • Check for Image Optimization: Next.js supports image optimization with the next/image component. Look for <Image> tags in the source code, which may indicate the use of Next.js for optimized images.

Check out our in-depth guide on how to detect Next.js here.

What is Next.js?

Next.js is a popular web development framework built on React, a JavaScript library for building user interfaces.

It is designed to simplify building complex, fast, and SEO-friendly web applications.