Next.js Detector

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.