How Rendering Detection Works

A technical deep-dive into WatchThis's rendering detection process, from raw HTML fetch to final comparison.

The Three-Step Process

Step 1: Fetch Raw HTML

When you submit a URL, WatchThis performs a standard HTTP GET request — the same kind a basic web crawler would make. We capture:

  • The initial HTML response body
  • HTTP status code
  • All redirect hops (if any)
  • Response headers

This raw HTML is what a crawler that doesn't execute JavaScript will see. We parse this HTML and extract:

  • <title> tag content
  • <meta name="description">
  • <link rel="canonical">
  • <meta name="robots">
  • All <h1> tags
  • Internal link count (same-domain <a href> tags)
  • Visible text word count
  • Structured data (<script type="application/ld+json">)
  • Image tags and alt attributes
  • HTML size in bytes

Step 2: Render with JavaScript

Next, we load the same URL in a headless browser environment (similar to how Googlebot renders pages). The browser:

  • Downloads and executes all JavaScript
  • Waits for the DOM to stabilize (network idle, no pending mutations)
  • Captures JavaScript errors that occur during execution
  • Records blocked resources (requests that fail or are denied)
  • Measures total render time

Once the page is fully rendered, we extract the exact same set of elements from the live DOM that we extracted from raw HTML.

Step 3: Compare & Score

We diff the raw and rendered snapshots element-by-element. Each discrepancy is classified by:

  • Severity:
    • critical — Essential SEO elements missing or broken in raw HTML
    • warning — Important content differs between raw and rendered
    • info — Minor differences that are usually acceptable
  • Category: The affected element (Title, Meta Description, Headings, etc.)

The risk score is calculated based on the number and severity of findings. Critical issues have the largest negative impact on the score.

What We Check

Title Tag

The <title> is one of the most important on-page SEO elements. If it's missing in raw HTML, crawlers see no title — a critical issue.

<!-- Raw HTML: missing title -->
<head>
  <meta charset="utf-8">
</head>

<!-- Rendered DOM: title added by JS -->
<head>
  <meta charset="utf-8">
  <title>Product Name | My Store</title>
</head>

Meta Description

Search engines use the meta description for snippets. If it's only set after JavaScript runs, crawlers may generate their own snippet from visible text.

Canonical URL

The canonical tag tells search engines which version of a page is authoritative. Setting it client-side can lead to duplicate content issues if crawlers don't execute JS.

Headings (H1)

Heading tags provide content structure. We count <h1> tags in both snapshots. A count of 0 in raw HTML means your primary heading is JavaScript-dependent.

Internal Links

Links are critical for crawlability. We count same-domain links. A large increase from raw to rendered (e.g., 0 → 50) means your navigation or content links are invisible to non-JS crawlers.

Structured Data

We extract JSON-LD structured data and note the types (e.g., Product, Article). If structured data only appears after rendering, rich results may not show in search.

Handling Redirects

If your URL redirects (HTTP 301, 302, etc.), we follow the chain and report each hop. The final URL is what gets rendered. Excessive redirects can slow down crawling and waste crawl budget.

JavaScript Errors

Any uncaught errors or console errors during rendering are logged. These can indicate broken scripts that prevent content from appearing.

Render Timeout

We wait up to 30 seconds for the page to render. If it takes longer, the check times out. Optimize your page load speed to ensure complete rendering.

Limitations

  • User interactions: We don't click buttons or scroll. Content behind interactions won't be detected.
  • Auth-protected content: We can't log in. Public pages only.
  • Geo-specific content: We check from a single location. Geo-targeted rendering may differ.

Next Steps

Now that you understand how rendering detection works, learn how to interpret the results and fix common JavaScript SEO issues.