mdn/content

Topic on setting HTTP priority of resource requests

オープン

#14,803 opened on 2022/04/08

 (3 件のコメント) (0 件のリアクション) (0 人の担当者)Markdown (23,229 件のフォーク)batch import
Content:Performancedocument not writtenhelp wanted

Repository metrics

Stars
 (10,950 個のスター)
PR merge metrics
 (PR metrics pending)

説明

When loading a page with many resources it can be useful to prioritize the requests so that the page appears to render more quickly. It would be useful to have a topic on this.

There are a bunch of ways to do this:

  • Use fetch() and set the priority in Request.priority.
  • Set the HTTP priority on HTMLLinkElement, HTMLIFrameElement, and HTMLImageElement elements (and associated tags) using the fetchpriority attribute.
  • In future maybe Priority HTTP header. There are also some ideas (from here), some of which may be relevant (e.g. marking the non-critical ones as async):
  • Mark non-critical scripts as async
  • Consider inlining @font-face declarations directly into HTML
  • Avoid using CSS background images or @import
  • Use preload to retrieve critical resources earlier

Possible locations for such a page are under these:

This comes out of the discussion here: https://github.com/mdn/content/issues/14561

コントリビューターガイド