Website Thumbnails
Generate high-quality website thumbnails programmatically. A common building block for directory sites, URL shorteners, and link-preview services.
Overview
Any product that displays user-submitted or curated URLs benefits from a thumbnail preview — directory sites, URL shorteners, RSS readers, bookmarking apps. Without one, a list of URLs is just text.
A screenshot API is the canonical way to produce these at scale. Request a capture on first display, cache aggressively, and fall back to the page's `og:image` meta tag for URLs that fail to render cleanly.
Thumbnail workloads split into two modes: sync (user just submitted a URL and is watching a spinner) and async (crawler queued a batch overnight). Design for both — a sync-optimized endpoint with a 6-second timeout plus a separate worker queue for batch with a 20-second timeout and retries.
Aggressive caching is non-negotiable. A URL like `https://example.com` rarely changes in a way that matters for a 1280×720 thumbnail, so a 7-day CDN cache keyed on the source page's ETag compresses a 10k-request month into fewer than 500 actual captures.
Key Benefits
Results You Can Expect
How It Works
On URL submission, fire a capture request
Show a skeleton preview while capture is in flight
Cache the final image on a CDN with a 7-day TTL
Regenerate when the source page Last-Modified changes
Code Example
// Generate a website thumbnail
const response = await fetch('https://api.screenshotly.app/screenshot', {
method: 'POST',
headers: {
Authorization: 'Bearer YOUR_API_KEY',
'Content-Type': 'application/json',
},
body: JSON.stringify({
url: 'https://example.com',
format: 'webp',
viewport: { width: 1280, height: 720 },
fullPage: false,
}),
});Thumbnail Pipeline Benchmarks
| Metric | Value | Context |
|---|---|---|
| Default output | 1280×720 | WebP preferred; PNG fallback |
| p50 capture latency | 1.8s | Standard URL, networkidle |
| p99 capture latency | ~4s | Includes slow SPAs |
| Cache hit rate | ~93% | Steady-state on typical workloads |
| Cache TTL | 7 days | Keyed on Last-Modified / ETag |
Frequently Asked Questions
How fast can the thumbnail pipeline run?
p50 ~1.8 seconds, p99 ~3–4 seconds for live captures. Cached hits return in under 100ms from your CDN.
What happens when a URL blocks headless browsers?
Fall back to the page's og:image meta tag if one is set; otherwise serve a branded placeholder. This pattern covers roughly 99% of the long tail.
Should I use PNG or WebP?
WebP for in-page previews — smaller file, equivalent quality. PNG when you need wider client compatibility or lossless output.
When this isn't the right fit
Screenshotly is not ideal for every workflow. Consider a different approach if any of the following apply:
- Your URLs are gated behind logins (LinkedIn profiles, private Facebook posts). Logged-out renders will be blank.
- You need thumbnails of interactive content like video or game pages. A single still cannot represent dynamic content; you need a short MP4 capture.
- You need sub-1s p99 per thumbnail. Real-browser rendering cannot match that consistently.
Want a step-by-step walkthrough?
Read: Website Thumbnail Generation Guide →Ready to automate thumbnails?
Get started with 100 free screenshots. No credit card required.