تشير واجهة برمجة تطبيقات أولوية الجلب إلى الأولوية النسبية للموارد إلى المتصفّح. ويمكن أن يتيح لك ذلك تحميل البيانات بشكل مثالي وتحسين "مؤشرات أداء الويب الأساسية".
عندما يحلّل المتصفّح صفحة ويب ويبدأ في اكتشاف موارد وتنزيلها، مثل الصور أو النصوص البرمجية أو CSS، يعيّن لها priority عملية جلب ليتمكّن من تنزيلها بالترتيب الأمثل. تعتمد أولوية المورد عادةً على ما هو ومكانه في المستند. على سبيل المثال، قد تكون للصور في إطار العرض أولوية High، والأولوية في صور CSS التي يتم تحميلها مبكرًا وحظر العرض باستخدام <link> في <head> قد تكون Very High. المتصفّحات جيدة إلى حدّ كبير في تحديد الأولويات التي تعمل بشكل جيد، ولكنها قد لا تكون الأفضل في جميع الحالات.
تتناول هذه الصفحة واجهة برمجة تطبيقات أولوية الجلب وسمة HTML fetchpriority، التي تتيح لك إمكانية الإشارة إلى الأولوية النسبية لأحد الموارد (high أو low). ويمكن أن تساعد أولوية الجلب في تحسين "مؤشرات أداء الويب الأساسية".
ملخّص
في ما يلي بعض المجالات الرئيسية التي تساعد فيها أولوية الجلب:
- زيادة أولوية صورة LCP من خلال تحديد
fetchpriority="high"على عنصر الصورة، ما يؤدي إلى حدوث سرعة LCP في وقت أقرب - زيادة أولوية
asyncنصوص برمجية، باستخدام دلالات أفضل من الاختراق الأكثر شيوعًا حاليًا (إدراج<link rel="preload">للنص البرمجيasync) - تقليل أولوية النصوص البرمجية المتأخرة للسماح بتسلسل أفضل مع الصور.
في السابق، كان للمطوّرين تأثير محدود على أولوية الموارد باستخدام ميزتَي التحميل المُسبَق والاتصال المُسبَق. يتيح لك التحميل المسبق إعلام المتصفح بالموارد المهمة التي تريد تحميلها في وقت مبكر قبل أن يكتشفها المتصفح بشكل طبيعي. ويكون هذا مفيدًا على وجه الخصوص للموارد التي يصعب اكتشافها، مثل الخطوط المضمّنة في أوراق الأنماط أو صور الخلفية أو الموارد التي تم تحميلها من نص برمجي. يساعد الاتصال المُسبَق في إعداد الاتصالات بالخوادم المشتركة المصدر ويمكن أن يساعد في تحسين المقاييس، مثل الوقت المطلوب للوصول إلى البايت الأول. وهو مفيد عندما تعرف أصلاً وليس بالضرورة عنوان URL الدقيق لمورد ستحتاجه.
تكمل "أولوية الاسترجاع" تلميحات الموارد هذه. وهو إشارة مستندة إلى الترميز تتوفّر من خلال السمة fetchpriority ويمكن للمطوّرين استخدامها للإشارة إلى الأولوية النسبية لمورد معيّن. يمكنك أيضًا استخدام هذه التلميحات من خلال JavaScript وجلب واجهة برمجة التطبيقات باستخدام السمة priority للتأثير في أولوية عمليات استرجاع الموارد المخصّصة للبيانات. ويمكن لأولوية الاسترجاع أيضًا أن تكمل التحميل المُسبق. التقِط صورة "سرعة عرض أكبر محتوى مرئي" على الصورة، وسيتم منحها أولوية منخفضة عند تحميلها مُسبقًا. وإذا تم التراجع عن هذا الإجراء بسبب موارد أخرى ذات أولوية منخفضة، قد يساعد استخدام "أولوية الاسترجاع" في زيادة سرعة تحميل الصورة.
أولوية الموارد
يعتمد تسلسل تنزيل الموارد على الأولوية المعيّنة للمتصفح لكل مورد في الصفحة. تشمل العوامل التي يمكن أن تؤثر في منطق حساب الأولوية ما يلي:
- نوع المورد، مثل CSS والخطوط والنصوص البرمجية والصور والموارد التابعة لجهة خارجية
- تمثّل هذه السمة الموقع أو ترتيب المستند الذي يشير إلى الموارد.
- ما إذا تم استخدام السمتَين
asyncأوdeferفي النصوص البرمجية
يوضِّح الجدول التالي كيفية إعطاء Chrome الأولوية لمعظم الموارد وترتيبها:
| التحميل في مرحلة حظر التنسيق | تحميل مرة واحدة في كل مرة في مرحلة حظر التنسيق | ||||
|---|---|---|---|---|---|
| أولوية الوميض |
VeryHigh | مرتفعة | متوسطة | منخفضة | VeryLow |
| أولوية أدوات مطوّري البرامج |
الأعلى | مرتفعة | متوسطة | منخفضة | الأدنى |
| المورد الرئيسي | |||||
| CSS (مبكر**) | CSS (متأخرة**) | CSS (عدم تطابق الوسائط***) | |||
| نص برمجي (مبكر** أو ليس من الماسح الضوئي للتحميل المُسبق) | النص البرمجي (متأخرًا**) | نص برمجي (غير متزامن) | |||
| الخط | الخط (rel=preload) | ||||
| استيراد | |||||
| صورة (في إطار العرض) | الصورة (أول 5 صور > 10,000 بكسل2) | صورة | |||
| الوسائط (فيديو/صوت) | |||||
| الجلب المُسبَق | |||||
| ملفات XSL | |||||
| XHR (مزامنة) | XHR/fetch* (غير متزامن) | ||||
ينزّل المتصفح الموارد التي لها نفس الأولوية المحسوبة بالترتيب الذي يتم اكتشافها به. يمكنك التحقّق من الأولوية المحدّدة لموارد مختلفة عند تحميل صفحة ضمن علامة التبويب الشبكة في "أدوات مطوّري البرامج في Chrome". (تأكد من تضمين عمود priority من خلال النقر بزر الماوس الأيمن على عناوين الجدول ووضع علامة بجانب ذلك).
type = "font" على صفحة تفاصيل أخبار BBC
type = "script" على صفحة تفاصيل أخبار BBCعند تغيير الأولويات، يمكنك الاطّلاع على الأولوية الأولية والنهائية في إعداد صفوف الطلبات الكبيرة أو في تلميح.
متى قد تحتاج إلى أولوية الجلب؟
الآن بعد أن فهمت منطق تحديد الأولويات في المتصفّح، يمكنك تعديل ترتيب تنزيل صفحتك لتحسين أدائها ومؤشرات أداء الويب الأساسية. في ما يلي بعض الأمثلة على الأشياء التي يمكنك تغييرها للتأثير في أولوية عمليات تنزيل الموارد:
- ضَع علامات المراجع، مثل
<script>و<link>، بالترتيب الذي تريد أن ينزِّله به المتصفِّح. يتم بشكل عام تحميل الموارد ذات الأولوية نفسها بالترتيب الذي يتم اكتشافها بها. - استخدِم تلميح الموارد
preloadلتنزيل الموارد الضرورية في وقت سابق، خاصةً للموارد التي لا يمكن للمتصفّح العثور عليها بسهولة في مرحلة مبكرة. - يمكنك استخدام
asyncأوdeferلتنزيل النصوص البرمجية بدون حظر موارد أخرى. - يمكنك التحميل الكسول للمحتوى في الجزء السفلي غير المرئي من الصفحة حتى يتمكّن المتصفِّح من استخدام معدل نقل البيانات المتاح لنقل الموارد الأكثر أهمية في الجزء المرئي من الصفحة.
وتساعد هذه الأساليب في التحكّم في طريقة احتساب أولوية المتصفّح، ما يؤدّي إلى تحسين الأداء ومؤشرات أداء الويب الأساسية. على سبيل المثال، عند تحميل صورة خلفية مهمة مسبقًا، يمكن اكتشافها في وقت أبكر من السابق، ما يؤدي إلى تحسين سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP).
وفي بعض الأحيان، قد لا تكون هذه الأسماء المعرِّفة كافية لتحديد أولوية الموارد بشكل مثالي لتطبيقك. في ما يلي بعض السيناريوهات التي قد تكون فيها أولوية الجلب مفيدة:
- لديك العديد من الصور في الجزء المرئي من الصفحة، ولكن ليس لكلها نفس الأولوية. على سبيل المثال، في لوحة العرض الدوّارة للصور، تحتاج أول صورة مرئية فقط إلى أولوية أعلى، في حين يمكن عادةً ضبط الصور الأخرى خارج الشاشة على أولوية أقل.
- عادةً ما تبدأ الصور داخل إطار العرض بأولوية
Low. بعد اكتمال التنسيق، يكتشف Chrome أن هذه المواضع في إطار العرض ويعزز أولويتها. يؤدي هذا عادةً إلى إضافة تأخير كبير في تحميل الصور المهمة، مثل صور الجزء الرئيسي. يتيح توفير أولوية الجلب في الترميز إمكانية بدء الصورة بأولويةHighوالبدء في التحميل قبل ذلك بكثير. في محاولة لإجراء ذلك إلى حد ما، يضبط Chrome أول خمس صور أكبر حجمًا على أولويةMedium، إلا أنّ استخدامfetchpriority="high"فاضح سيكون أفضل من ذلك.
يجب استخدام ميزة التحميل المُسبق لاكتشاف صور LCP المضمّنة كخلفيات CSS قبل إطلاقها. لتعزيز أولوية صور الخلفية، يمكنك تضمينfetchpriority='high'في التحميل المُسبَق. - في حال تعريف النصوص البرمجية بالرمز
asyncأوdefer، يجب أن يحمِّلها المتصفِّح بشكل غير متزامن. ومع ذلك، وكما هو موضَّح في جدول الأولوية، يتم أيضًا تعيين أولوية "منخفضة" لهذه النصوص البرمجية. من الأفضل زيادة أولويتها مع ضمان التنزيل غير المتزامن، وخاصةً بالنسبة إلى النصوص البرمجية الضرورية لتجربة المستخدم. - إذا كنت تستخدم واجهة برمجة تطبيقات JavaScript
fetch()لجلب الموارد أو البيانات بشكلٍ غير متزامن، يحدِّد المتصفِّح أولويةHighلها. قد تحتاج إلى تنفيذ بعض عمليات الجلب بأولوية أقل، خاصةً في حال كنت تخلط بين طلبات البيانات من واجهة برمجة التطبيقات في الخلفية وطلبات البيانات من واجهة برمجة التطبيقات التي تستجيب لإدخال المستخدم. وضع علامة على طلبات البيانات من واجهة برمجة التطبيقات للخلفية على أنّها ذات أولويةLow، وطلبات البيانات من واجهة برمجة التطبيقات التفاعلية كأولويةHigh. - يعيّن المتصفّح أولوية
Highللخطوط CSS والخطوط، ولكن قد تكون بعض هذه الموارد أكثر أهمية من غيرها. يمكنك استخدام أولوية الجلب لخفض أولوية الموارد غير المهمة (لاحظ أن خدمة CSS المبكرة تحظر العرض، ولذلك يجب أن تكون عادة أولويةHigh).
السمة fetchpriority
استخدِم سمة HTML fetchpriority لتحديد أولوية تنزيل أنواع الموارد، مثل CSS والخطوط والنصوص البرمجية والصور عند تنزيلها باستخدام العلامات link أو img أو script. يمكن أن يأخذ القيم التالية:
high: المورد هو أولوية أعلى، وتريد من المتصفِّح منحه أولوية أعلى من المعتاد، ما دامت الأساليب الإرشادية للمتصفّح لا تمنع حدوث ذلك.low: المورد ذو أولوية منخفضة، وتريد أن يقلل المتصفح من أولوياته، مرة أخرى إذا كانت استدلالاته تسمح بذلك.auto: القيمة التلقائية التي تتيح للمتصفّح اختيار الأولوية المناسبة.
في ما يلي بعض الأمثلة على استخدام السمة fetchpriority في الترميز، بالإضافة إلى سمة priority التي تعادل النص البرمجي.
<!-- We don't want a high priority for this above-the-fold image -->
<img src="/images/in_viewport_but_not_important.svg" fetchpriority="low" alt="I'm an unimportant image!">
<!-- We want to initiate an early fetch for a resource, but also deprioritize it -->
<link rel="preload" href="/js/script.js" as="script" fetchpriority="low">
<script>
fetch('https://example.com/', {priority: 'low'})
.then(data => {
// Trigger a low priority fetch
});
</script>
تأثيرات أولوية المتصفّح وfetchpriority
يمكنك تطبيق السمة fetchpriority على موارد مختلفة كما هو موضَّح في الجدول التالي لزيادة الأولوية المحسوبة أو تقليلها. يشير fetchpriority="auto" (MATCH) في كل صف إلى الأولوية التلقائية لهذا النوع من الموارد. (متاح أيضًا كمستند Google).
| التحميل في مرحلة حظر التنسيق | تحميل واحد تلو الآخر في مرحلة حظر التنسيق | ||||
|---|---|---|---|---|---|
| أولوية الوميض |
VeryHigh | مرتفعة | متوسطة | منخفضة | VeryLow |
| أولوية أدوات مطوّري البرامج |
الأعلى | مرتفعة | متوسطة | منخفضة | الأدنى |
| المورد الرئيسي | ◉ | ||||
| CSS (مبكر**) | ⬆◉ | ⬇ | |||
| CSS (متأخرة**) | ⬆ | ◉ | ⬇ | ||
| CSS (عدم تطابق الوسائط***) | ⬆*** | ◉⬇ | |||
| نص برمجي (مبكر** أو ليس من الماسح الضوئي للتحميل المُسبق) | ⬆◉ | ⬇ | |||
| النص البرمجي (متأخرًا**) | ⬆ | ◉ | ⬇ | ||
| النص البرمجي (غير متزامن/تأجيل) | ⬆ | ◉⬇ | |||
| الخط | ◉ | ||||
| الخط (rel=preload) | ⬆◉ | ⬇ | |||
| استيراد | ◉ | ||||
| صورة (في إطار العرض - بعد التنسيق) | ⬆◉ | ⬇ | |||
| الصورة (أول 5 صور > 10,000 بكسل2) | ⬆ | ◉ | ⬇ | ||
| صورة | ⬆ | ◉⬇ | |||
| الوسائط (فيديو/صوت) | ◉ | ||||
| XHR (مزامنة) - متوقّف نهائيًا | ◉ | ||||
| XHR/fetch* (غير متزامن) | ⬆◉ | ⬇ | |||
| الجلب المُسبَق | ◉ | ||||
| ملفات XSL | ◉ | ||||
يضبط fetchpriority الأولوية النسبية، ما يعني أنّها ترفع الأولوية التلقائية أو تخفضها بمقدار مناسب، بدلاً من ضبطها بشكلٍ صريح على High أو Low. ويؤدي هذا غالبًا إلى منح الأولوية High أو Low، ولكن ليس دائمًا. على سبيل المثال، تحتفظ لغة CSS المهمة التي تتضمّن fetchpriority="high" بالأولوية "عالية جدًا"/"أعلى"، بينما يحتفظ استخدام fetchpriority="low" في هذه العناصر بالأولوية "عالية". ولا تتضمّن أي من هذه الحالات تحديد الأولوية صراحةً على High أو Low.
حالات الاستخدام
استخدِم السمة fetchpriority عندما تريد منح المتصفِّح تلميحًا إضافيًا حول أولوية جلب مورد.
زيادة أولوية صورة سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP)
ويمكنك تحديد السمة fetchpriority="high" لتعزيز أولوية سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP) أو الصور المهمة الأخرى.
<img src="lcp-image.jpg" fetchpriority="high">
تُظهر المقارنة التالية صفحة "رحلات جوية من Google" التي تتضمّن صورة خلفية LCP محمَّلة بأولوية الجلب أو بدونها. عند ضبط الأولوية على "عالية"، تحسَّنت سرعة عرض أكبر محتوى مرئي (LCP) من 2.6 إلى 1.9 ثانية.
خفض أولوية صور الجزء المرئي من الصفحة
استخدِم fetchpriority="low" لتقليل أولوية الصور في الجزء المرئي من الصفحة التي لا تكون مهمة على الفور، مثل الصور خارج الشاشة في لوحة العرض الدوّارة للصور.
<ul class="carousel">
<img src="img/carousel-1.jpg" fetchpriority="high">
<img src="img/carousel-2.jpg" fetchpriority="low">
<img src="img/carousel-3.jpg" fetchpriority="low">
<img src="img/carousel-4.jpg" fetchpriority="low">
</ul>
على الرغم من أنّ الصور من 2 إلى 4 ستكون خارج إطار العرض، يمكن اعتبارها "قريبة بما فيه الكفاية" لتحسين الوصول إلى high وتحميل هذه الصور أيضًا حتى إذا تمت إضافة سمة load=lazy. وبالتالي، فإنّ fetchpriority="low" هو الحل الصحيح لهذه المشكلة.
في تجربة سابقة مع تطبيق Oodle، استخدمنا هذا الخيار لخفض أولوية الصور التي لا تظهر عند التحميل. قلّت من وقت تحميل الصفحة بمقدار ثانيتين.
خفض أولوية الموارد التي تم تحميلها مُسبقًا
لمنع الموارد المُحمَّلة مسبقًا من التنافس مع الموارد المُهمّة الأخرى، يمكنك تقليل أولويتها. استخدِم هذا الأسلوب مع الصور والنصوص البرمجية وCSS.
<!-- Lower priority only for non-critical preloaded scripts -->
<link rel="preload" as="script" href="critical-script.js">
<link rel="preload" as="script" href="non-critical-script.js" fetchpriority="low">
<!-- Preload CSS without blocking render, or other resources -->
<link rel="preload" as="style" href="theme.css" fetchpriority="low" onload="this.rel='stylesheet'">
إعادة ترتيب أولوية النصوص البرمجية
من المفترض أن تكون سرعة تحميل النصوص البرمجية التي تحتاج إليها صفحتك تفاعلية، ولكن يجب ألّا تحظر الموارد الأخرى الأكثر أهمية والتي تمنع عرض الإعلانات. يمكنك وضع علامة على هذه العناصر باعتبارها async بأولوية عالية.
<script src="async_but_important.js" async fetchpriority="high"></script>
لا يمكنك وضع علامة async على نص برمجي إذا كان يعتمد على حالات DOM محدّدة. ومع ذلك، إذا تم تشغيلها لاحقًا على الصفحة، يمكنك تحميلها بأولوية أقل:
<script src="blocking_but_unimportant.js" fetchpriority="low"></script>
سيؤدي هذا الإجراء إلى حظر المحلّل اللغوي عندما يصل إلى هذا النص البرمجي، مع السماح بإعطاء الأولوية للمحتوى قبل ذلك.
بدلاً من ذلك، يمكنك استخدام السمة defer (التي يتم تشغيلها بالترتيب بعد DOMContentLoaded) أو حتى السمة async في أسفل الصفحة عند الحاجة إلى نموذج DOM المكتمل.
خفض أولوية عمليات استرجاع البيانات غير المهمة
ينفِّذ المتصفح fetch بأولوية عالية. إذا كانت لديك عمليات جلب متعدّدة قد يتم تنشيطها في وقت واحد، يمكنك استخدام الأولوية التلقائية العالية لعمليات جلب البيانات الأكثر أهمية وخفض أولوية البيانات الأقل أهمية.
// Important validation data (high by default)
let authenticate = await fetch('/user');
// Less important content data (suggested low)
let suggestedContent = await fetch('/content/suggested', {priority: 'low'});
ملاحظات تنفيذ أولوية الجلب
يمكن أن تؤدي أولوية الجلب إلى تحسين الأداء في حالات استخدام معينة، ولكن هناك بعض الأمور التي يجب أن تكون على دراية بها عند استخدام أولوية الجلب:
- السمة
fetchpriorityهي تلميح وليس توجيهًا. ويحاول المتصفّح مراعاة تفضيل المطوّر، ولكن يمكنه أيضًا تطبيق الإعدادات المفضّلة لأولوية الموارد على أولوية الموارد لحلّ التعارضات. لا تخلط بين أولوية الجلب والتحميل المُسبق:
- إنّ عملية التحميل المُسبق هي جلب إلزامي، وهي وليست تلميحًا.
- من خلال التحميل المُسبق، يمكن للمتصفح اكتشاف مورد مبكرًا، ولكنه لا يزال يجلب المورد ذي الأولوية التلقائية. وعلى النقيض، لا تساعد أولوية الجلب في قابلية اكتشاف المحتوى، ولكنها تتيح لك زيادة أولوية الجلب أو خفضها.
- غالبًا ما تكون ملاحظة آثار التحميل المُسبق وقياسها أسهل من تأثيرات تغيير الأولوية.
يمكن لأولوية الاسترجاع أن تكمل عمليات التحميل المُسبق من خلال زيادة دقة تحديد الأولويات. وإذا سبق لك تحديد تحميل مُسبَق كأحد العناصر الأولى في
<head>لصورة سرعة عرض أكبر جزء من المحتوى على الصفحة (LCP)، قد لا تحسّن "أولوية استرجاعhigh" سرعة LCP بشكل كبير. ومع ذلك، إذا تم التحميل المُسبق بعد تحميل موارد أخرى، يمكن أن تحسّن أولوية الجلبhighمن سرعة LCP بشكل أكبر. إذا كانت إحدى الصور المهمة هي صورة خلفية CSS، عليك تحميلها مسبقًا باستخدامfetchpriority = "high".تكون التحسينات في وقت التحميل الناتجة عن تحديد الأولويات أكثر صلة في البيئات التي تتنافس فيها المزيد من الموارد على معدل نقل البيانات المتاح للشبكة. يُعد هذا أمرًا شائعًا لاتصالات HTTP/1.x حيث لا يمكن إجراء عمليات تنزيل متوازية، أو على اتصالات HTTP/2 أو HTTP/3 بمعدل نقل بيانات منخفض. في هذه الحالات، يمكن أن يساعد تحديد الأولويات في حل المؤثِّرات السلبية.
لا تطبّق شبكات توصيل المحتوى (CDN) تحديد أولوية HTTP/2 بشكل موحّد، وبالمثل مع HTTP/3. حتى إذا كان المتصفح ينقل الأولوية من أولوية الجلب، فقد لا تعطي شبكة توصيل المحتوى (CDN) الأولوية للموارد بالترتيب المحدد. وهذا يجعل اختبار أولوية الجلب صعبًا. يتم تطبيق الأولويات داخليًا في المتصفِّح وباستخدام البروتوكولات التي تتيح تحديد الأولويات (HTTP/2 وHTTP/3). لا يزال من الأفضل استخدام أولوية الجلب لتحديد أولوية المتصفح الداخلي بشكل مستقل عن شبكة توصيل المحتوى (CDN) أو دعم المصدر، لأنّ الأولويات تتغير غالبًا عندما يطلب المتصفّح موارد. على سبيل المثال، غالبًا ما يتم منع الطلب من الموارد ذات الأولوية المنخفضة مثل الصور، وذلك أثناء معالجة المتصفّح لعناصر
<head>المهمة.قد لا تتمكن من تقديم أولوية الجلب كأفضل ممارسة في تصميمك الأولي. لاحقًا في دورة التطوير، يمكنك تحديد الأولويات التي يتم تعيينها لموارد مختلفة في الصفحة، وإذا لم تتطابق مع توقعاتك، يمكنك تقديم أولوية الجلب لإجراء المزيد من التحسين.
على المطوّرين استخدام ميزة "التحميل المُسبق" للغرض المحدَّد لها، وهو تحميل الموارد التي لم يرصدها المحلل اللغوي مسبقًا (الخطوط وعمليات الاستيراد وصور LCP في الخلفية). سيتأثر موضع التلميح preload عند تحميل المورد مُسبقًا.
تتعلق أولوية الاسترجاع بالطريقة التي يجب أن يتم بها جلب المورد عند استرجاعه.
نصائح لاستخدام عمليات التحميل المُسبق
يُرجى مراعاة ما يلي عند استخدام عمليات التحميل المُسبق:
- يؤدي تضمين تحميل مسبق في عناوين HTTP إلى وضعه قبل كل شيء آخر في ترتيب التحميل.
- بشكل عام، يتم تحميل التحميل المُسبق بالترتيب الذي يصل إليه المحلل اللغوي لأي عنصر بأولوية
Mediumأو أعلى. يُرجى توخّي الحذر عند تضمين عمليات تحميل مُسبَقة في بداية صفحة HTML. - ومن المحتمل أن تعمل عمليات التحميل المُسبق للخط بشكل أفضل في نهاية الرأس أو بداية النص.
- يجب تنفيذ عمليات استيراد التحميل المُسبَق (
import()أوmodulepreloadالديناميكية) بعد علامة النص البرمجي التي تحتاج إلى الاستيراد، لذا تأكَّد من تحميل النص البرمجي أو تحليله أولاً حتى يمكن تقييمه أثناء تحميل العناصر الاعتمادية. - تكون الأولوية تلقائيًا لعمليات التحميل المُسبق للصور
LowأوMedium. رتِّبها بالنسبة إلى النصوص البرمجية غير المتزامنة وغيرها من العلامات ذات الأولوية المنخفضة أو المنخفضة.
السجلّ
تمت تجربة "أولوية الجلب" لأول مرة في Chrome في عام 2018 كتجربة أصلية في عام 2018، ثم تم إجراؤها مرة أخرى في عام 2021 باستخدام السمة importance. وكانت تُسمّى حينها تلميحات الأولوية. تم تغيير الواجهة إلى fetchpriority لـ HTML وpriority لـ Fetch API لـ JavaScript كجزء من عملية معايير الويب. ولتقليل الالتباس، تُعرف الآن باسم أولوية جلب واجهة برمجة التطبيقات.
الخلاصة
من المرجح أن يهتم المطوّرون بأولوية الجلب من خلال الإصلاحات في سلوك التحميل المُسبق والتركيز الأخير على "مؤشرات أداء الويب الأساسية" وسرعة عرض أكبر جزء من المحتوى على الصفحة (LCP). وتتوفّر الآن مقابض إضافية لتحقيق تسلسل التحميل المفضّل لديهم.