parcel-bundler/parcel

Module scripts loaded with low priority when compiled

Open

#6,981 opened on 2021年9月23日

GitHub で見る
 (0 comments) (0 reactions) (0 assignees)JavaScript (44,030 stars) (2,274 forks)batch import
:bug: BugGood First Issue✨ Parcel 2

説明

Native module scripts (e.g. <script type="module">) are typically loaded by browsers with high priority. However, when targeting browsers without native support, Parcel inserts <script defer nomodule> tags, which are loaded with low priority. See https://addyosmani.com/blog/script-priorities/.

With that said, these scripts still need the defer attribute to emulate the execution timing of native modules. One workaround to boost priority of deferred scripts is to also insert a <link rel="preload" as="script"> into the document head with an href with the same value as the script's src.

We should consider adding these link tags as well when including js targeted at these environments.

Related: #6980

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

技術スタック
javascripthtmlcss
領域
frontendperformance
Issue 種別
feature
難度新しい貢献者にとっての実装難度です。1 は非常に小さな変更、5 は専門的な作業です。
3
推定時間経験ある貢献者が調査、実装、テスト、pull request 準備にかけるおおよその時間範囲です。
half day
活動状況Issue が今どれだけ取り組みやすいかを示します。新しい、活発、古い、ブロック中、またはメンテナー入力待ちなどです。
fresh
明確さ期待される変更、受け入れ条件、次の手順がどれだけ明確かを示します。
mostly clear
前提条件
Basic understanding of Parcel bundlerKnowledge of script loading priorities
初心者向け度初回貢献者にどれだけ取り組みやすいかを 1-100 で推定したスコアです。
55
調査方針
Investigate how Parcel currently generates `<script defer nomodule>` tags for non module targets. Look at the bundler's HTML asset handling, likely in packages/core/integration tests or similar. Consider adding logic to insert `<link rel="preload" as="script">` for each deferred script. Related issue #6980 provides additional context.
Module scripts loaded with low priority when compiled · parcel-bundler/parcel#6981 | Good First Issue