ما هو
قبل أن يتمكن المتصفح من عرض أي جزء من صفحة، يجب عليه أولاً تنزيل مستند HTML الخاص بالصفحة بالكامل (أو على الأقل ما يكفي منه للبدء بالعمل) — هذا منفصل عن الصور أو الفيديوهات أو الوسائط الأخرى، التي تُحمَّل بعد ذلك. تنظر هذه الفحوصات تحديدًا في حجم مستند HTML الأولي نفسه، وتضع علامة عليه عندما ينمو بشكل كبير غير معتاد.
تنتفخ مستندات HTML عادة في الحجم عندما يُضمَّن الكثير من المحتوى مباشرة داخل السطر — كتل كبيرة من كود التنسيق، أو سكريبتات، أو محتوى مكرر لُصق مباشرة في الصفحة — بدلاً من الاحتفاظ بها في ملفات منفصلة قابلة لإعادة الاستخدام يمكن للمتصفح تحميلها مرة واحدة وتخزينها مؤقتًا.
لماذا يهم
يستغرق مستند HTML الأكبر وقتًا أطول بشكل قابل للقياس للتنزيل والمعالجة قبل أن يتمكن المتصفح من البدء في عرض أي شيء على الإطلاق، مما يؤخر أول شيء يراه الزائر، وليس فقط المحتوى الثانوي الأدنى في الصفحة. يكون هذا التأثير أكثر وضوحًا على اتصالات الجوال الأبطأ، حيث تضيف كل قطعة بيانات إضافية وقتًا حقيقيًا وملموسًا قبل أن تبدأ الصفحة بالشعور بالاستجابة.
ملف HTML المتضخم غالبًا ما يكون أيضًا عرضًا لمشكلة هيكلية أعمق — محتوى أو كود كان يجب تنظيمه في ملفات منفصلة قابلة للتخزين المؤقت، لكنه مكرر بدلاً من ذلك داخل السطر عبر الصفحة، أو حتى عبر كل صفحة في الموقع.
كيفية الإصلاح
- حدد ما يشكّل الجزء الأكبر من الملف — يمكن لأدوات المطوّر في المتصفح إظهار تفصيل حجم موارد الصفحة، بما في ذلك مستند HTML الأساسي نفسه.
- انقل كتل CSS الكبيرة المضمّنة (كود التنسيق) إلى ملف
.cssمنفصل يمكن للمتصفح تحميله مرة واحدة وإعادة استخدامه عبر الصفحات، بدلاً من تكراره داخل السطر في كل صفحة. - انقل كود جافاسكريبت المضمّن الكبير إلى ملفات
.jsمنفصلة لنفس السبب. - تحقق من وجود محتوى مكرر عن طريق الخطأ في كود الصفحة (نفس الكتلة مكررة أكثر من مرة) وأزل التكرارات.
- إذا كنت على أداة بناء مواقع، عادة ما يُدار هذا نيابة عنك — الصفحة الكبيرة بشكل غير معتاد هنا غالبًا ما تكون بسبب تضمين كود مخصص ثقيل وليس المنصة نفسها، لذا راجع أي كتل كود مخصصة أضفتها.