How to Fix the JavaScript Blindspot for React & Next.js

Published on 2026-03-26

In our previous post, "The JavaScript Blindspot," we revealed a critical issue: many modern JavaScript-heavy websites are effectively invisible to the AI crawlers that power services like ChatGPT, Perplexity, and Google's AI Overviews. This means your carefully crafted content might not be seen, cited, or recommended by the AI models your customers are using.

The core of the problem is that these AI crawlers, unlike Google's traditional search bot, often do not execute JavaScript. They see the raw HTML that your server sends, which for many React and Next.js sites is just a minimal shell with a <div id="root"></div> and a bunch of <script> tags.

The good news is that this is a solvable problem. In this post, we'll walk through the technical solutions to ensure your React and Next.js sites are fully visible and citable by AI crawlers.

The Solution: Server-Side Rendering (SSR) and Static Site Generation (SSG)

The key to making your content visible to AI crawlers is to send them fully-rendered HTML. Instead of sending a blank page that relies on the client's browser to render the content, you need to render it on the server and send the complete HTML document.

For React and Next.js, this means embracing Server-Side Rendering (SSR) or Static Site Generation (SSG).

Server-Side Rendering (SSR) with Next.js

Next.js is a popular React framework that makes SSR relatively straightforward. With Next.js, you can create pages that are pre-rendered on the server for each request.

Here's a simplified example of a Next.js page that fetches data and renders it on the server:

// pages/blog/[slug].js
import { getPostData } from '../../lib/posts';

export default function Post({ postData }) {
  return (
    <Layout>
      <h1>{postData.title}</h1>
      <div dangerouslySetInnerHTML={{ __html: postData.contentHtml }} />
    </Layout>
  );
}

export async function getServerSideProps({ params }) {
  const postData = await getPostData(params.slug);
  return {
    props: {
      postData,
    },
  };
}
      

The getServerSideProps function runs on the server for every request. It fetches the necessary data and passes it as props to the page component. When an AI crawler requests this page, it will receive the fully rendered HTML, including the blog post title and content.

Static Site Generation (SSG) with Next.js

If your content doesn't change with every request, SSG is an even better option. With SSG, the HTML is generated at build time, so it's incredibly fast and always available.

Here's how you would use SSG in Next.js:

// pages/posts/[id].js
import { getAllPostIds, getPostData } from '../../lib/posts';

export default function Post({ postData }) {
  // ... same as above
}

export async function getStaticProps({ params }) {
  const postData = await getPostData(params.id);
  return {
    props: {
      postData,
    },
  };
}

export async function getStaticPaths() {
  const paths = getAllPostIds();
  return {
    paths,
    fallback: false,
  };
}
      

The getStaticProps function fetches the data at build time, and getStaticPaths tells Next.js which paths to pre-render. The result is a set of static HTML files that are perfect for AI crawlers.

What About Create React App?

If you're using Create React App, you're not out of luck. While Create React App doesn't support SSR or SSG out of the box, you can add it using tools like Prerender.io or by migrating to a framework like Next.js.

For most businesses, migrating to Next.js is the best long-term solution. The benefits of SSR and SSG for both AI visibility and user experience are too significant to ignore.

Conclusion

The rise of AI search means that the "JavaScript blindspot" is a bigger problem than ever. If your site isn't sending fully rendered HTML, you're missing out on a massive opportunity.

By embracing Server-Side Rendering and Static Site Generation with frameworks like Next.js, you can ensure that your content is seen, cited, and recommended by the AI models that are shaping the future of search.