LCP (أكبر عنصر مرئي محمَّل)

LCP (Largest Contentful Paint) مقياس من مقاييس [Core Web Vitals](/glossary/core-web-vitals) يقيس الزمن الممتدّ منذ بدء تحميل الصفحة وحتى انتهاء عرض أكبر عنصر محتوى مرئي داخل نافذة العرض. وعادةً ما يكون هذا العنصر صورةً رئيسية، أو كتلة نصية كبيرة، أو صورة ملصق فيديو، أو صورة خلفية. وتُحدِّد Google ثلاث فئات للأداء: **جيد** (٢٫٥ ثانية أو أقل)، **يحتاج تحسيناً** (من ٢٫٥ إلى ٤٫٠ ثوانٍ)، و**ضعيف** (أعلى من ٤٫٠ ثوانٍ). ويُقاس LCP عند المئين الخامس والسبعين لتحميلات الصفحة، أي إنّ النتيجة تعكس تجربة معظم المستخدمين الفعليين، لا أسرع الاتصالات فحسب.

يُعدّ LCP المؤشر الأهم على سرعة الصفحة المُدرَكة. فبينما تقيس مقاييس أخرى الجاهزية التقنية أو الاستقرار البصري، يلتقط LCP اللحظة التي يرى فيها الزائر المحتوى الرئيسي — أي اللحظة التي يعتبر فيها أنّ الصفحة قد "حُمِّلت". وبطء LCP يجعل الزوّار يحدّقون في صفحة غير مكتملة، ممّا يرفع معدّلات الارتداد ويُضعف التفاعل. وتستخدم Google مقياس LCP إشارةً ترتيبية في خوارزمية البحث، وهذا يعني أنّ النتيجة الضعيفة لا تضرّ تجربة المستخدم فحسب، بل تُقلّل ظهورك في نتائج البحث المجاني مباشرةً. وبالنسبة إلى الناشرين الذين يعتمدون على زيارات البحث، قد يكون تحسين LCP هو الفارق بين الظهور في الصفحة الأولى وبين الانزواء في صفحات لا يصل إليها أحد.

تُحسِّن FlipLink مقياس LCP في كلٍّ من الموقع التسويقي والكتب التفاعلية المنشورة. ويُعطي عارض الكتاب التفاعلي الأولوية لعرض صفحة الغلاف والصفحة المزدوجة الأولى، ضماناً لظهور أكبر عنصر مرئي قبل تحميل الأصول الأثقل. وتوفّر [شاشة التحميل المخصّصة](/features/custom-loading-screen) ردّ فعل بصرياً فورياً — حيث يظهر عنصر نائب يحمل علامتك التجارية في أقل من ثانية واحدة — في حين تجري تهيئة موارد عرض Three.js في الخلفية. ويطبّق محرك [تجربة الصفحة وتخطيطها](/features/page-experience-and-layout) في FlipLink ضغطاً محسَّناً للصور، وتحجيماً متجاوباً للصور، وعرضاً تدريجياً، للحفاظ على LCP ضمن العتبة التي توصي بها Google والبالغة ٢٫٥ ثانية على الحاسوب المكتبي والجوّال معاً. وعند [تضمين](/glossary/embed) الكتب التفاعلية في مواقع خارجية، يضمن التحميل الكسول ألّا يُنافس التضمين عنصر LCP في الصفحة المضيفة.

يتطلّب فهم LCP وضعه في سياق مقاييس الأداء ذات الصلة: - **LCP جيّد**: ٢٫٥ ثانية أو أقل. تشعر بأنّ الصفحة فورية. ومعظم المستخدمين يرون المحتوى قبل أن يفكّروا في المغادرة. - **يحتاج تحسيناً**: من ٢٫٥ إلى ٤٫٠ ثوانٍ. يلاحظ المستخدمون تأخّراً. وتبدأ معدّلات الارتداد بالتصاعد. - **LCP ضعيف**: أعلى من ٤٫٠ ثوانٍ. الزوّار مرشَّحون لمغادرة الصفحة قبل ظهور المحتوى الرئيسي. ويتغيّر عنصر LCP بحسب الصفحة. ففي صفحة منتج، يكون عادةً صورة المنتج. وفي تدوينة، قد يكون اللافتة الرئيسية أو أوّل فقرة نصية. وفي صفحة كتاب تفاعلي، يكون صورة الغلاف. وتحديد العنصر الذي يُمثّل LCP في كل صفحة هو الخطوة الأولى نحو التحسين.

يخضع قياس LCP لقواعد محدّدة وضعتها Web Performance Working Group. ويُحدَّد أكبر عنصر بحسب حجمه المرئي في نافذة العرض، لا بحسب حجم ملفّه. ومن العناصر التي تُؤخَذ بالحسبان عند احتساب LCP: عناصر `<img>`، و`<image>` داخل SVG، وصور ملصقات الفيديو، والعناصر التي تحمل `background-image` مُحمَّلة عبر CSS، والعناصر على مستوى الكتلة التي تحتوي على نصّ. أمّا العناصر التي تمتدّ خارج نافذة العرض، فلا يُقاس منها إلا الجزء المرئي. ومن الأسباب الشائعة لبطء LCP: الصور غير المُحسَّنة (كأن تُقدِّم صورة بحجم 4MB في حين يكفي WebP بحجم 200KB)، وملفّات CSS وJavaScript التي تَحجب العرض وتُؤخّر بدء رسم المحتوى، وبطء استجابة الخادم ([TTFB](/glossary/core-web-vitals) أعلى من 800ms)، والعرض من جانب العميل الذي يستلزم تنفيذ JavaScript قبل ظهور أيّ محتوى. ومن التحسينات العملية: التحميل المسبق لصورة LCP باستخدام `<link rel="preload">`، وتقديم الصور بصِيَغ حديثة (WebP، AVIF)، واستخدام CDN للأصول الثابتة، وتضمين CSS الحَرِج داخل الصفحة، وتأجيل JavaScript غير الأساسي، وتعيين قيمتَي `width` و`height` بشكل صريح على الصور لمنع إزاحات التخطيط التي قد تُؤخّر LCP.

يُعدّ كلٌّ من LCP و[FCP](/glossary/core-web-vitals) (First Contentful Paint) مقياسَين زمنيَّين، لكنّهما يقيسان لحظتَين مختلفتَين. يَنطلق FCP حين يَعرض المتصفّح أوّل جزء من محتوى DOM — ولو كان مجرّد شريط تنقّل، أو مؤشّر تحميل، أو سطر نصّ واحد. أمّا LCP فيَنطلق حين يُعرَض أكبر عنصر محتوى. وعملياً، كثيراً ما يَنطلق FCP قبل LCP بمدّة تتراوح بين ثانية وثانيتَين. وقد تَملك الصفحة FCP سريعاً وLCP بطيئاً إذا حُمِّل الرأس والتنقّل بسرعة، في حين استغرقت الصورة الرئيسية ثوانيَ عدّة قبل أن تظهر. ومن منظور تجربة المستخدم، يبقى LCP المقياس الأكثر دلالة، لأنّه يعكس متى تشعر الصفحة بأنّها مكتملة لدى الزائر. ويُفيد FCP في تشخيص ما إذا كان المتصفّح يَشرع في العرض أصلاً، لكنّ LCP هو ما يُحدِّد ما إذا كان المستخدم سيبقى أم سيُغادر.

يقيس LCP اللحظة التي تشعر فيها صفحتك بأنّها قد حُمِّلت لدى الزوّار الفعليين. فأبقِه دون ٢٫٥ ثانية بتحسين الصور، وتقليل الموارد التي تَحجب العرض، وإيلاء الأولوية للمحتوى الظاهر في الجزء العلوي من الصفحة — فترتيبك في نتائج البحث وتفاعل المستخدمين معك يعتمدان على ذلك.