İçeriğe geç
Technical SEO

JavaScript SEO: SPA, Hydration and Indexing Issues

·9 dk min read·Technical SEO Editor

Is Googlebot Great or Blind to JS?

Although single page applications (SPA) and dynamic interfaces based on JavaScript (React, Vue, Angular, etc.) offer a unique user experience for software developers, they are a bomb ready to explode in the context of SEO. Even if Google's crawling algorithms are advanced and they enter the page and run JavaScript through the Chrome-based Web Rendering Service (WRS) engine (Execute), this operation consumes a huge amount of server power / crawling budget compared to classical HTML casting. A million HTML pages can be read in a few minutes, but the processing of a million JS-wrapped pages (Render process) takes weeks and your page enters the index late.

CSR, SSR, SSG - Which Architecture Will We Choose?

The first question you will ask your developer who says "I made my page with React" is "Does this application run on the Client Side (Client-Side Rendering), Modular on the Server Side (Server-Side Rendering) or Static Output (SSG)?" should be.

  • Client Side Visualization (CSR): The entire script is downloaded to the browser (or bot) (throws a white page), and after the browser reads and finishes the JS file (hydrate), the DOM turns into HTML. Search engines are generally not tolerant of waiting for all scripts to be processed and will not rank your site, thinking it is an empty white screen. (Disaster for SEO)
  • Server Side Visualization (SSR): A ready-made HTML is sent from the server to the client. The visitor quickly starts reading (LCP) and Javascript is silently activated in the background (Hydration). (Perfect for SEO)

The 3 Worst JavaScript SEO Mistakes

  • Configure your internal redirects with OnClick events (<div onClick="redirect()">) instead of / internal linking <a href="">. Since bots cannot navigate by clicking JS click actions, you will not have link juice between content. URL discovery goes bankrupt.
  • When dynamic title or dynamic H1 replacer JS snippets are used, Bots save the first "loading" or "empty" versions to your index at the time of Snapshot. Critical on-page SEO tags should always be dumped statically from the server. It requires SSR infrastructure.
  • Creating soft 404 pages. Since the client page with the product ID that is not found or deleted in the database is not reported with the 404 error protocol HTTP response (visible in the Network Log), Google insists on trying to index the product.