اعتبارات أداء HTML العامة

قياس أوقات استجابة الخادم

إذا لم تكن الاستجابة في ذاكرة التخزين المؤقت، يعتمد وقت استجابة الخادم بشكل كبير على المستضيف وحزمة تطبيقات الخلفية. صفحة ويب تعرض استجابة يتم إنشاؤها ديناميكيًا - مثل استرجاع البيانات من قاعدة بيانات مثال — قد يحتوي على TTFB أعلى من صفحة الويب الثابتة التي يمكن عرضها على الفور بدون وقت حوسبة كبير في الخلفية. يتم عرض مؤشر تحميل التحميل ثم جلب جميع البيانات من جهة العميل يؤدي إلى نقل الجهد بدءًا من بيئة خادم يمكن التنبؤ بها بشكل أكبر إلى بيئة غير متوقعة واحد من جانب العميل. عادة ما يؤدي تقليل الجهد من جانب العميل إلى تحسين المقاييس التي تركز على المستخدم.

إذا واجه المستخدمون مشكلة بطء "تحويل النص إلى كلام" في الحقل، يمكنك عرض المعلومات عن المكان الذي تم فيه قضاء الوقت على الخادم من خلال استخدام Server-Timing عنوان الاستجابة:

Server-Timing: auth;dur=55.5, db;dur=220

يمكن أن تتضمن قيمة العنوان Server-Timing مقاييس متعددة، بالإضافة إلى المدة لكل مرحلة. يمكن بعد ذلك جمع هذه البيانات من المستخدمين في الحقل باستخدام واجهة برمجة تطبيقات Navigation Timing وتحليلها لمعرفة ما إذا كان المستخدمون يواجهون التأخير. في مقتطف الرمز السابق، يتضمّن عنوان الاستجابة توقيتَين:

الوقت اللازم لمصادقة المستخدم (auth)، والذي استغرق 55.5 مللي ثانية.
وقت الوصول إلى قاعدة البيانات (db)، والذي استغرق 220 مللي ثانية.

ملاحظة: يمكنك العثور على مزيد من المعلومات حول عنوان استجابة Server-Timing في دليل تحسين TTFB.

قد تحتاج أيضًا إلى مراجعة البنية الأساسية للاستضافة والتأكد من لديهم موارد كافية للتعامل مع عدد الزيارات التي يتلقّاها موقعك الإلكتروني. ألبوم مُشترَك إن المستضيف غالبًا ما يكونون عرضة لارتفاع TTFB، فضلاً عن أن التي توفّر أوقات استجابة أسرع قد تكون أكثر تكلفة.

الضغط

يجب أن تكون الردود المستندة إلى النص مثل صور HTML وJavaScript وCSS وSVG ضغطها لتقليل حجم النقل عبر الشبكة من أجل والتنزيل بسرعة أكبر. خوارزميات الضغط الأكثر استخدامًا هي gzip و بروتلي. ينتج عن Brotli تحسُّن بنسبة من 15% إلى 20% تقريبًا باستخدام gzip.

غالبًا ما يتم إعداد الضغط تلقائيًا من قبل معظم موفري استضافة الويب، ولكن هناك بعض الأشياء المهمة التي يجب مراعاتها إذا كنت في وضع يسمح لك بتكوين أو اضبط إعدادات الضغط بنفسك:

استخدِم Brotli متى أمكن ذلك. وكما ذكرنا سابقًا، تقدم Brotli حلاً تحسن ملحوظ عبر gzip، ويتم دعم Brotli في جميع في المتصفّح. استخدم Brotli عندما يكون ذلك ممكنًا، ولكن إذا كان موقعك على الويب يُستخدم من قِبل عدد المستخدمين على المتصفحات القديمة، فتأكد من استخدام gzip كإجراء احتياطي ذلك أنّ أي ضغط أفضل من عدم ضغطه على الإطلاق.
حجم الملفات مهم: لا يتم ضغط الموارد الصغيرة جدًا، والتي تقل عن 1 كيبيبايت. جيدًا، أو أنه في بعض الأحيان لا يضغط على الإطلاق. الفعالية مهما كان نوعها ضغط البيانات على وجود كمية كبيرة من البيانات التي تعمل خوارزمية الضغط لإيجاد المزيد من وحدات البت القابلة للضغط من البيانات. كلما زاد حجم الملف، كان الضغط أفضل، ومع ذلك، لا تستخدم موارد كبيرة جدًا لدرجة أنها يمكن ضغطها أكثر فعالية. تأخذ الموارد الكبيرة - مثل JavaScript وCSS على سبيل المثال - وقتًا أطول بكثير لتحليله وتقييمه بعد فك ضغطها، وقد تتغير بشكل متكرر حتى إذا كانت بشكل هامشي، لأنّ أي تغييرات تؤدي إلى تجزئة ملف مختلفة.
فهم الضغط الديناميكي مقابل الضغط الثابت: ديناميكية وثابتة الضغط هي مناهج مختلفة للوقت الذي ينبغي فيه تنفيذ مضغوطًا. يضغط الضغط الديناميكي مورد في الوقت الذي يتم فيه طلب وفي بعض الأحيان في كل مرة يتم طلبه. من ناحية أخرى، الضغط الثابت يضغط الملفات مسبقًا، ولا يتطلب أي ضغط أن يتم تنفيذها في وقت الطلب. يعمل الضغط الثابت على إزالة وقت الاستجابة المتضمن في الضغط نفسه، ما قد يزيد من استجابة الخادم مرة في حالة الضغط الديناميكي. الموارد الثابتة - مثل صور جافا سكريبت وCSS وSVG - يجب ضغطها ثابتًا، بينما يجب أن تكون صور HTML موارد خاصةً إذا تم إنشاؤها ديناميكيًا لعمليات المصادقة مستخدميه — يجب ضغطه ديناميكيًا.

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

شبكات توصيل المحتوى (CDN)

شبكة توصيل المحتوى (CDN) هي شبكة موزَّعة من الخوادم التي في ذاكرة التخزين المؤقت للموارد من خادم المصدر، وبالتالي استخدامها من الحافة الخوادم القريبة من المستخدمين فعليًا. التقارب الفعلي من يقلل المستخدمون من مدة الإرسال الكامل (RTT)، في حين أنّ تحسينات مثل HTTP/2 أو يتيح HTTP/3 والتخزين المؤقت والضغط لشبكة توصيل المحتوى (CDN) عرض المحتوى بسرعة أكبر. مقارنةً بما إذا كان سيتم جلبها من خادم المصدر يمكن أن يؤدي استخدام شبكة توصيل المحتوى إجراء تحسين كبير على قيمة TTFB على موقعك الإلكتروني في بعض الحالات.

اختبِر معلوماتك

ما هو نوع عمليات إعادة التوجيه الذي يمكنك التحكّم فيه بالكامل؟

إعادة توجيه متعدّد المصادر.

يُرجى إعادة المحاولة.

إعادة توجيه المصدر نفسه

إجابة صحيحة.

يمكن أن يتضمّن العنوان Server-Timing مقاييس متعدّدة.

صحيح

إجابة صحيحة.

خطأ

يُرجى إعادة المحاولة.

نوع الخادم الأقرب إلى موقعك الجغرافي فعليًا المستخدمين؟

خادم المصدر لموقعك الإلكتروني

يُرجى إعادة المحاولة.

الخوادم المتطورة لشبكة توصيل المحتوى (CDN).

إجابة صحيحة.

التالي: فهم المسار الحرج

الآن، بعد أن تعرّفت على بعض اعتبارات الأداء المعنية باستخدام HTML في موقعك الإلكتروني، فأنت في وضع أفضل لضمان إمكانية تحميل بأسرع وقت ممكن - ولكن هذه ليست سوى بداية تعلم الويب أدائه. تتمثّل النظرية التالية في مسار العرض الحرج . تصف هذه الوحدة المفاهيم الأساسية مثل حظر العرض تحليل الموارد التي تمنع الوصول إلى البيانات، والدور الذي تلعبه في الحصول على القيم الأولية للصفحة العرض في المتصفح بأسرع وقت ممكن.

إنّ محتوى هذه الصفحة مرخّص بموجب ترخيص Creative Commons Attribution 4.0‏ ما لم يُنصّ على خلاف ذلك، ونماذج الرموز مرخّصة بموجب ترخيص Apache 2.0‏. للاطّلاع على التفاصيل، يُرجى مراجعة سياسات موقع Google Developers‏. إنّ Java هي علامة تجارية مسجَّلة لشركة Oracle و/أو شركائها التابعين.

تاريخ التعديل الأخير: 2023-11-01 (حسب التوقيت العالمي المتفَّق عليه)

web.dev
- web.dev
  
  نريد مساعدتك في إنشاء مواقع إلكترونية رائعة وسريعة وآمنة تعمل عبر المتصفحات ولجميع المستخدمين. يُعدّ هذا الموقع الإلكتروني المركز الرئيسي للمحتوى الذي كتبه أعضاء فريق Chrome وخبراء خارجيين لمساعدتك في هذه الرحلة.
مساهمة
- الإبلاغ عن خطأ
- الاطّلاع على المشاكل المفتوحة
محتوى ذو صلة
Follow