Skip to main content
Engineering
Updated September 10, 20267 min read

Technical SEO for React, Next.js & JavaScript Applications

A practical guide to rendering, crawlability, metadata, structured data, international targeting, internal links, and Core Web Vitals for JavaScript applications.

Rohit Sharma

Engineering Strategy

A crawlable web interface connected to a global network of search discovery paths

Perspective

Practical engineering guidance

Depth

8 focused sections

Use it for

React SEO · Next.js SEO optimization

Start with content that is available without user interaction

Search engines can process JavaScript, but that does not make every client-rendered architecture equally dependable. The safer baseline for a public page is meaningful HTML containing the primary heading, body copy, navigation, and crawlable links. Client-side code can then enhance the experience without being the only path to the content.

Choose rendering by page behavior:

  • Static generation fits articles, service pages, documentation, and other content that changes through a controlled publishing workflow.
  • Server rendering fits request-specific pages where the response genuinely depends on current data.
  • Revalidation and caching fit content that should remain fast while accepting bounded freshness.
  • Client rendering remains useful for authenticated or highly interactive regions, but should not conceal the information a public landing page depends on.

The useful question is not “SSR or SSG?” in isolation. It is whether users and crawlers receive the correct content, status code, metadata, and links for each URL.

Make every indexable URL unambiguous

Each public page should have one descriptive title, one concise summary, a self-referencing canonical URL, and a stable path. Redirect retired paths permanently and avoid allowing tracking parameters, case variants, trailing-slash variants, or duplicate filters to compete with the preferred URL.

Use robots directives for indexation choices, not as a substitute for access control. A blocked URL can still be known to a search engine through links; confidential content belongs behind authentication. Include canonical URLs in the XML sitemap, and use real modification dates rather than changing every timestamp on each deployment.

Treat international SEO as information architecture

For regional English pages such as /en-us, /en-gb, and /en-in, use reciprocal hreflang annotations and an x-default global version. Every alternate should resolve successfully, reference the same page intent, and link back to the complete alternate set.

Regional routes should earn their existence through useful differences: local operating context, terminology, currency, contact expectations, regulations, or delivery considerations. Creating hundreds of near-identical city and country pages only to capture query variations creates a poor experience and can resemble scaled search-first content.

Use structured data to clarify—not invent—the page

Structured data must match what a visitor can see. Useful examples include Organization, BreadcrumbList, Service, and BlogPosting. An article schema should provide its canonical URL, headline, author, publication date, truthful modification date, and a representative image.

Do not add review, rating, price, or FAQ markup for information that is absent or misleading on the page. Eligibility for a rich result is not a guarantee that one will appear.

Use real anchor elements with meaningful surrounding text. Link from broad service and industry pages to specific evidence, and from articles to the next useful decision—not to every remotely related keyword. A compact cluster of strong contextual links is more useful than a footer packed with repetitive anchors.

Images need stable dimensions, responsive delivery, and alt text that communicates their purpose. Decorative visuals should use empty alt text; informative visuals should describe what the image adds rather than repeating the article title. Include important original images in the sitemap when appropriate.

Measure page experience on representative devices

Core Web Vitals are diagnostic signals, not the whole experience. Track Largest Contentful Paint, Interaction to Next Paint, and Cumulative Layout Shift with field data where possible. Also test keyboard access, focus, zoom, contrast, reduced motion, mobile navigation, form recovery, and long-content reflow.

Begin with the largest real bottleneck. A smaller script bundle will not compensate for a slow origin, and a fast hero image will not fix an interaction blocked by long main-thread tasks.

Add AI-readable discovery without confusing it with ranking

A root /llms.txt file can provide a concise Markdown index for tools that choose to consume the emerging convention. Keep it factual, link to canonical source pages, and offer an expanded /llms-full.txt only when it remains maintainable. This complements conventional crawlability, metadata, and sitemaps; it does not replace them or guarantee visibility in AI products.

A practical release checklist

  1. Fetch the rendered HTML and confirm that primary content and links are present.
  2. Verify the final URL, status code, canonical, robots directive, and language alternates.
  3. Validate structured data against visible page content.
  4. Test the page on a constrained mobile viewport and network profile.
  5. Check internal links for descriptive text and valid destinations.
  6. Submit the sitemap through the relevant search-engine tooling and monitor indexation rather than assuming it.
  7. Revisit the page when the product, standards, or implementation materially change.

For an example of applying these decisions to a production framework, see our web application development approach and the related Core Web Vitals guide for ecommerce.

Primary references

Standards and documentation used for this guide

Topics in this article

React SEONext.js SEO optimizationJavaScript framework SEOSSR vs SSGCore Web Vitals guideJSON-LD schemaindexable web apps