Back to glossary

Resource Prioritization

The process of telling the browser which resources are most important to load first to improve perceived performance.

Categoryweb

Overview

Resource Prioritization involves using browser hints to influence the order in which assets (scripts, styles, fonts, images) are downloaded and executed. This ensures that critical content is available to the user as quickly as possible.

Key Techniques

  • Preload: <link rel="preload"> for high-priority resources needed for the current page.
  • Prefetch: <link rel="prefetch"> for low-priority resources needed for future navigations.
  • Preconnect: <link rel="preconnect"> to establish early connections to third-party origins.
  • Fetch Priority API: Using the fetchpriority attribute on elements like <img> or <script> to explicitly set priority (high, low, auto).

Benefits

Proper prioritization can significantly reduce metrics like Largest Contentful Paint (LCP) and First Contentful Paint (FCP) by ensuring the browser doesn't waste bandwidth on non-essential assets.

Related Terms

Critical Rendering Path