fetchpriority-attribute

Installation
SKILL.md

Use fetchpriority to hint resource loading priority

Browsers use internal heuristics to guess resource priority, but they cannot know which image is your LCP candidate. Adding fetchpriority="high" to the LCP image has been shown to reduce LCP by 5–30 % in real-world tests, directly improving Core Web Vitals scores and user-perceived load speed. The attribute costs nothing to add and is the lowest-effort high-impact performance optimisation available today.

Quick Reference

  • Add fetchpriority="high" to the LCP image to accelerate Largest Contentful Paint
  • Add fetchpriority="low" to below-the-fold images that would otherwise compete with critical resources
  • Use fetchpriority="high" on for critical fonts and CSS
  • Avoid marking more than one or two resources as high priority — it defeats the purpose

Check

Check whether the LCP image or hero element has fetchpriority="high" and whether any high-priority preload links are missing the attribute.

Fix

Add fetchpriority="high" to the LCP image element and any preloaded critical resources, and fetchpriority="low" to non-critical below-the-fold images.

Installs
1
GitHub Stars
73.0K
First Seen
Jun 8, 2026
fetchpriority-attribute — thedaviddias/frontendchecklist