Missed the action at the 2018 Chrome Dev Summit? Catch up with our playlist on the Google Chrome Developers channel on YouTube. Watch now.

تحسين مسار العرض الحرج

حتى نتمكن من الحصول على أسرع عرض أول ممكن، يلزمنا تحسين ثلاثة متغيرات:

  • الوصول إلى أقل عدد من الموارد الحرجة.
  • الوصول إلى أقل عدد من وحدات بايت الحرجة.
  • الوصول إلى أقل وقت للمسار الحرج.

المسار الحرج هو أي مورد قد يحظر العرض الأول للصفحة. وكلما قل عدد الموارد على الصفحة، قلت نسبة العمل الذي يحتاج المتصفح إلى تنفيذه للحصول على المحتوى على الشاشة، وقلت نسبة التعارض مع وحدة المعالجة المركزية والموارد الأخرى.

وبالمثل، كلما قل عدد وحدات بايت الحرجة التي يتعين على المتصفح تنزيلها، تمكن بسرعة أكبر من معالجة المحتوى بحيث يظهر على الشاشة. ولتقليل عدد وحدات بايت، يمكننا تقليل عدد الموارد (من خلال خفضها أو جعلها غير حرجة)، وكذلك التأكد من تقليل حجم النقل من خلال ضغط كل مورد وتحسينه.

وفي النهاية يعد طول المسار الحرج وظيفة للرسم البياني للعلاقة بين جميع الموارد الحرجة المطلوبة في الصفحة وحجم وحدات بايت بها: يمكن لبعض تنزيلات الموارد أن تبدأ بمجرد معالجة مورد سابق، وكلما زاد حجم المورد تطلب الأمر مزيدًا من الجولات لتنزيله.

وبمعنى آخر، يتعلق كل من عدد الموارد وحجم وحدات بايت وطول المسار الحرج ببعضهم، إلا أن هناك فرقًا بينهم. على سبيل المثال، قد لا تتمكن من خفض عدد الموارد الحرجة أو الحد من طول المسار الحرج، ولكن يظل خفض عدد وحدات بايت الحرجة تحسينًا لازمًا والعكس صحيح.

التسلسل العام لخطوات تحسين مسار العرض الحرج هي:

  1. تحليل ووصف المسار الحرج: عدد الموارد ووحدات بايت والطول.
  2. تقليل عدد الموارد الحرجة: خفضها وتأخير تنزيلها وتحديدها كغير متزامنة وما إلى ذلك.
  3. تحسين ترتيب تحميل الموارد الحرجة المتبقية: يلزمك تنزيل جميع الأصول الحرجة في أسرع وقت ممكن لتقليل طول المسار الحرج.
  4. تحسين عدد وحدات بايت الحرجة لتقليل زمن التنزيل (عدد الجولات).