Resource Hints: a beginner's guide
Find preconnect, prefetch, and preload hints
Resource hints: the preload tricks that make pages feel instant
Resource hints are a small family of signals — `<link rel="preload">`, `<link rel="prefetch">`, `<link rel="preconnect">`, `<link rel="dns-prefetch">`, and `<link rel="modulepreload">`, plus the newer `fetchpriority` attribute and the Speculation Rules API — that tell the browser to start fetching, connecting to, or resolving things earlier than it otherwise would. They are some of the smallest, easiest, highest-leverage performance improvements available, because they let you parallelize work that would otherwise happen sequentially. The browser is happy to start a DNS lookup, open a connection, or download a critical asset as soon as it can — but it doesn't always know which things will be needed. Resource hints tell it.
You should care because resource hints can knock hundreds of milliseconds off a typical page load with a handful of HTML tags and zero changes to the underlying code. The classic example is a page that has to load a font from `fonts.googleapis.com` halfway through rendering. By default, the browser doesn't know it will need that font until it parses the CSS, which means it has to do a DNS lookup, a TLS handshake, and a download — all sequentially — before the text on the page can render with the right font. With a single `<link rel="preconnect" href="https://fonts.googleapis.com" crossorigin>` in the page header, the browser starts the connection setup immediately, and by the time the CSS parser needs the font, the connection is already warm.
The hints every audit looks at:
`dns-prefetch` — start the DNS lookup for a hostname. Cheapest hint, useful for any third-party origin you'll talk to.
`preconnect` — start the full TCP and TLS handshake with a hostname. More expensive than `dns-prefetch` but a much bigger win when the connection actually gets used. `crossorigin` matters: fonts must use `crossorigin` or the browser opens a separate non-CORS connection and the preconnect is wasted. Per Chrome's official guidance, limit `preconnect` to 1–2 critical origins and use `dns-prefetch` for the rest.
`preload` — fetch a specific resource right now, with high priority. Useful for critical assets like fonts, hero images, and above-the-fold CSS. The `as=` attribute is mandatory — without it, browsers ignore the hint entirely.
`fetchpriority="high"` — the highest-leverage modern hint. Apply it to the LCP image to give the browser the strongest possible prioritization signal. Browser support is mainstream (Chrome 102+, Safari 17.2+, Firefox 132+) and the LCP impact is often 10–20%. Reserve `fetchpriority=high` for the single LCP element — multiple high-priority resources compete with each other.
`prefetch` — fetch a resource in the background, low priority, to be used later. Useful for the next page a user is likely to visit.
`modulepreload` — like `preload`, but for ES module dependencies. Useful for modern JavaScript bundles.
Speculation Rules API (`<script type="speculationrules">`) — the modern, JSON-based replacement for the deprecated `<link rel="prerender">`. Lets you declare "these URLs are likely-next; prerender them in the background" with conditions like document-rules and eagerness settings. Shipping in Chrome 121+ and growing.
103 Early Hints — the server can send a preliminary HTTP `103 Early Hints` response with `Link:` headers for preload and preconnect before the main response is ready. Cloudflare, Vercel, Fastly, and Akamai support it. When the CDN supports it and you publish `Link:` headers, the LCP win is often 30%+.
Three questions a resource-hint audit answers:
Is my LCP image getting `fetchpriority="high"`, or am I leaving the single biggest LCP optimization on the table?
Are my font `preconnect` / `preload` hints actually using `crossorigin`, or are they silently broken?
Are CDN-injected `Link:` header hints lining up with what's declared in HTML — and could I unlock 103 Early Hints by moving hints into headers?
The cost of skipping resource hints is leaving easy performance wins unclaimed. The fix is a one-time pass through the HTML to add the right hints at the right places. Most modern frameworks (Next.js, Nuxt, SvelteKit) generate appropriate hints automatically for the most common cases, but the audit still catches the cases that fall through the cracks — and almost no framework adds `fetchpriority` correctly without explicit configuration. Authoritative guidance lives at web.dev's resource-hints reference.
The Resource Hints endpoint, in plain language
In one sentence: Find preconnect, prefetch, and preload hints
Discovers resource hints (preconnect, prefetch, preload, DNS-prefetch) configured on a webpage. Reveals third-party dependencies and performance optimization strategies.
Don't worry if some of the words above are still unfamiliar — there's a plain-language glossary at the bottom of this page, and most of the terms link to their own beginner guides if you want to learn more.
What is actually happening when you call it
Here's what's actually happening behind the scenes when you call this endpoint:
Parses HTML (HyperText Markup Language) for link rel="preconnect", "prefetch", "preload", and "DNS-prefetch" tags. Identifies which external domains are prioritized, what resources are preloaded, and analyzes the performance optimization strategy.
If you're using an AI assistant through MCP, you don't need to understand any of the technical details — the assistant calls the tool and translates the result for you.
Why this specific tool matters
Let's skip the marketing fluff and answer the only question that actually matters: why should you, a real human with a real to-do list, care about the Resource Hints tool? Here's the plain-English version, written the way you'd hear it from a friend who happens to do this for a living.
Resource hints reveal critical third-party dependencies and performance priorities. They expose which services a site relies on and provide insights into their performance optimization approach.
Picture this in real life. Imagine a performance engineer. Here's the situation they're walking into: Analyze resource hints to understand performance optimization strategy. Without the right tool, that person would be stuck copy-pasting between five browser tabs, reading documentation written for engineers, and crossing their fingers that the answer they cobble together is correct. With the Resource Hints tool, the same person gets a clear answer in seconds — no spreadsheets, no guessing, no waiting for someone on the infrastructure team to free up.
Three questions this tool answers in plain English. If any of these have ever crossed your mind, the Resource Hints tool is built for you:
Why does my website feel slow on real devices, even though it looks fine on mine?
Which specific change would give me the biggest speed boost for the least work?
Am I losing visitors and search rankings because of performance problems I cannot see?
You can either click the tool and get the answer yourself, or ask your AI assistant — connected through MCP (Model Context Protocol) — to ask the question for you and translate the answer into something you can paste into Slack.
Who gets the most out of this. Founders watching their conversion rates, marketers trying to lift landing-page revenue, ecommerce operators chasing every percentage point of speed, and developers tuning Core Web Vitals. If you see yourself in that list, this is one of the EdgeDNS tools you should bookmark today.
What happens if you skip this entirely. Skip it and visitors bounce, conversions drop, and your search ranking quietly slides — all from a problem nobody on the team can see. That's why running this check — even once a month — is one of the cheapest forms of insurance you can give your domain.
Available on the developer plan. The technical details: `GET /v1/domain/resource-hints`.
When would I actually use this?
If you're still on the fence about whether the Resource Hints tool belongs in your toolbox, this section is for you. Below you'll meet three real people — a performance engineer, a security analyst, and an SEO specialist — facing three real situations where this tool turns a stressful afternoon into a five-minute task. Read whichever story sounds closest to your week.
Story 1: Performance Analysis
Imagine you're a performance engineer. Analyze resource hints to understand performance optimization strategy.
Why it matters: Learn from competitor performance optimizations.
Story 2: Third-Party Discovery
Imagine you're a security analyst. Identify critical third-party dependencies from preconnect hints.
Why it matters: Map supply chain dependencies for security assessment.
Story 3: SEO Audit
Imagine you're an SEO specialist. Verify resource hints are properly configured for Core Web Vitals (Google Core Web Vitals).
Why it matters: Optimize page performance for better search rankings.
Common situations across teams. Beyond the three stories above, here are the everyday workplace moments when people across the company reach for the Resource Hints tool — or one of the tools right next to it in this category. If any of these are on your calendar this month, that's your sign:
Before a high-traffic marketing campaign or product launch.
After a redesign, to make sure performance did not regress.
When your conversion rate drops without an obvious cause.
On a recurring schedule, to enforce a performance budget for your team.
If you can see yourself in even one of those bullets, the Resource Hints tool will pay for itself the first time you use it.
Still not sure? Here's the easiest test in the world. Open Claude, ChatGPT, Gemini, or any other AI assistant connected to the EdgeDNS MCP server and ask, in your own words: "Is the Resource Hints tool useful for my job?" The assistant will look at the tool, ask you a couple of follow-up questions about what you're trying to accomplish, and give you a straight answer in plain English. No commitment, no signup forms, no jargon.
The easiest way: just ask your AI assistant
If you've connected the EdgeDNS MCP server to Claude, ChatGPT, Gemini, Cursor, or any other AI assistant, you don't need to write any code. Just ask in plain English:
"Use the Resource Hints tool to check https://example.com and explain anything that looks wrong in plain language."
The AI will figure out which tool to call, fill in the right parameters, run it, and then explain the result back to you. No copy-pasting between tabs. No reading raw JSON. No memorizing endpoint names.
MCP (Model Context Protocol) access is free on every plan, including the free tier. One API key works for both REST and AI — you do not have to choose.
The technical way: call it from code
If you're a developer and want to call the endpoint from a script or your own application, here's the simplest possible example. Replace the placeholder API key with the real one from your dashboard.
# Replace edns_live_YOUR_KEY with your real API key from the dashboard
curl -H "Authorization: Bearer edns_live_YOUR_KEY" \
"https://api.edgedns.dev/v1/domain/resource-hints?domain=https%3A%2F%2Fexample.com"What you need to provide
There's just one piece of information you need to provide. The table below explains exactly what it is and what a real value looks like.
| Field | Type | Required? | What it means | Example |
|---|---|---|---|---|
domain | string | Yes | Domain or full URL (web address) — accepts `example.com` or `HTTPS://example.com/path`. | https://example.com |
What you get back
When you call this tool, you'll get back a JSON object with the fields below. If you're talking to it through an AI assistant, the assistant reads these for you and explains them in plain language — you don't need to memorize them.
| Field | Type | What you'll see in it |
|---|---|---|
domain | string | The analyzed domain (bare hostname). |
url | string | Full URL (web address) that was fetched, echoing the protocol used in the request. |
preconnect | array | Hrefs with preconnect hints (legacy flat form) |
preconnectEntries | array | Structured preconnect entries: { href, crossorigin, media, source: "html" | "link-header" } |
prefetch | array | Resources marked for prefetch (legacy flat form) |
prefetchEntries | array | Structured prefetch entries with source |
preload | array | Preload entries: { href, as, type, crossorigin, media, fetchpriority, source } |
dnsPrefetch | array | Domains with DNS (Domain Name System) prefetch (legacy flat form) |
dnsPrefetchEntries | array | Structured DNS-prefetch entries with source |
prerender | array | Pages marked for prerender (legacy; use Speculation Rules) |
prerenderEntries | array | Structured prerender entries with source |
speculationRules | object | Modern Speculation Rules API (Application Programming Interface) rules parsed from <script type="speculationrules"> — { prerender: [...], prefetch: [...], raw } |
bySource | object | Count of hints by origin: { html, linkHeader }. Reveals CDN-injected hints |
earlyHintsRecommended | boolean | True when the CDN (Content Delivery Network) supports 103 Early Hints and the origin already publishes Link headers |
duplicates | array | Hrefs hinted multiple ways (e.g. preload + preconnect, or HTML (HyperText Markup Language) + Link header) — wasted bytes |
issues | array | Structured issues: missing `as`, font preload without crossorigin, multiple fetchpriority=high, etc. |
totalCount | number | Total resource hints found |
recommendations | array | Optimization suggestions based on web.dev 2026 guidance |
Words you might be wondering about
If any words on this page felt like jargon, here's a plain-language version. Click any linked term to read a full beginner-friendly guide.
DNS (Domain Name System) — The internet's address book. When you type a website name, DNS turns it into the actual numeric address computers use to find each other.
HTML (HyperText Markup Language) — The basic language web pages are written in. The tags you see in the source code (<h1>, <p>, <a>) are HTML.
Core Web Vitals (Google Core Web Vitals) — Google's official measurements of how fast and smooth your web pages feel — how quickly content appears, how long the page takes to become interactive, and how stable the layout is. Used as a search ranking signal.
Need Programmatic Access?
Automate domain intelligence with 100+ API endpoints and a free MCP server for AI integration.