Back to blog

Social preview bots and JavaScript websites: why shared links look wrong

Learn why JavaScript websites can produce missing or stale link previews and how to verify Open Graph, card metadata, images, redirects, and cache behavior.

Operations
Jul 10, 2026
4 min read

A page can look correct in a browser and still produce an empty, generic, or outdated preview when its URL is shared.

Preview systems often fetch the page with their own crawler and look for metadata such as Open Graph or card tags. They may fetch only part of the response and may not wait for a client-rendered application to replace generic metadata.

Quick answer

If the server already sends complete HTML, you probably do not need Prerender Buddy. If visitors see a complete JavaScript page but bots receive thin HTML or an empty app shell, Prerender Buddy can help by serving rendered HTML to search engines and AI crawlers.

Who this is for

  • SaaS founders with already-shipped JavaScript websites
  • React, Vite, Vue, Lovable, Bolt, or Base44 users
  • SEO freelancers checking crawler-readable HTML
  • Agencies maintaining client sites without rebuilding them

What a preview response should contain

HTML
1<meta property="og:title" content="Route-specific title">
2<meta property="og:description" content="A useful public summary">
3<meta property="og:url" content="https://www.example.com/page">
4<meta property="og:image" content="https://www.example.com/preview.png">
5<meta name="twitter:card" content="summary_large_image">

Also provide a normal HTML title and meta description. Use absolute public URLs for preview images.

Common JavaScript preview failures

  • every route starts with the same generic metadata
  • Open Graph tags appear only after React or another client framework mounts
  • the preview image URL requires cookies, authentication, or blocked hotlink access
  • root and www redirect inconsistently
  • og:url points to a preview or noncanonical hostname
  • the crawler receives a challenge page, redirect loop, or app shell
  • the platform keeps an older cached preview after the page changes

Test the exact shared URL

Do not test only the homepage when users share deeper routes.

Check:

  1. Final URL after redirects.
  2. HTTP status and content type.
  3. Initial HTML metadata.
  4. Absolute image URL and image response.
  5. Canonical and og:url agreement.
  6. Preview-bot response through the actual public hostname.

Prerender Buddy's crawler matcher includes common search, AI, social, and messaging preview user agents. The goal is still content parity: the preview metadata should describe the same public page visitors open.

Preview caches are separate

Refreshing rendered HTML does not automatically clear a social platform's own preview cache. After fixing the page response:

  1. Confirm the public crawler response contains the new metadata.
  2. Refresh the exact URL in Prerender Buddy when needed.
  3. Use the destination platform's official preview debugger or retry mechanism where available.
  4. Allow time for the external preview cache to update.

Slack documents that its link-expanding crawler looks for Open Graph and card metadata and may fetch only a limited portion of the page. See Slack Robots.

Use Metadata and structured data in rendered HTML and the Bot View Checker for the underlying response check. Correct metadata improves technical eligibility for a preview but cannot guarantee how every external platform displays it.

You may not need Prerender Buddy if

  • Server HTML is already complete.
  • Static pages crawl correctly.
  • You are already rebuilding with SSR or static generation.
  • You only need an audit, not a rendering fix.

Final recap

Social preview bots and JavaScript websites comes down to what search engines and AI crawlers actually receive from your site.

Prerender Buddy does not guarantee rankings or AI citations. It helps with one specific technical problem: making sure crawlers receive readable rendered HTML instead of a thin JavaScript shell.

The first step is to check what bots see.

Check your website

Check what crawlers see to test whether the site sends readable HTML to search engines and AI crawlers.