23 سپتامبر
PageSpeed Insights اکنون از Lighthouse 8.4.0 استفاده می کند که دارای دو ممیزی جدید است. مهمترین افزودنی به ناشران کمک می کند تا مشکل گسترده ای را تشخیص دهند که بر معیار بزرگترین محتوای رنگ تأثیر منفی می گذارد. این ممیزی جدید به ناشران کمک می کند تا نمرات بهتر Largest Contentful Paint (LCP) را بدست آورند.
بزرگترین رنگ محتوا
یک مشکل قدیمی با Largest Contentful Paint (LCP) وجود دارد که جدیدترین نسخه Lighthouse ، 8.4.0 به تشخیص آن کمک می کند.
مشخص شد که بارگذاری تنبل تصاویر یک روش خوب برای سریعتر دیده شدن بخش اصلی محتوا و تعامل بر روی دستگاه تلفن همراه است.
قبل از بارگذاری تنبل تصاویر زیر تاشو (در نمای صفحه نمایش مرورگر قابل مشاهده نبود) در پس زمینه بارگیری می شد.
تبلیغات
ادامه مطلب را در زیر ادامه دهید
این امر باعث کاهش دید و تعامل محتوایی که در نمای بازدیدکنندگان سایت بود ، می شود.
هنگامی که تصاویری که خارج از نمای نمای تلفن همراه هستند در پس زمینه بارگذاری می شوند ، در واقع جلوه بخشی از قسمت قابل مشاهده صفحه وب را کند می کنند.
با افزودن ویژگی HTML Lazy Load به تصاویر ، مرورگر می داند که تصاویر را (که خارج از نمای دید هستند) تا دیروز بارگیری نمی کند.
این امر باعث افزایش سرعت صفحه می شود.
اما عناصر بارگذاری تنبل که در بزرگترین نمای نمایش Contentful Paint قرار دارند ، تأثیر منفی دارد و این یکی از مواردی است که Lighthouse 8.4.0 به آن می پردازد.
تبلیغات
ادامه مطلب را در زیر ادامه دهید
بار منفی تنبلی بارگذاری همه تصاویر
وردپرس 5.4 بارگذاری تنبل بومی تصاویر را معرفی کرد. قبل از اعمال تغییرات ، توسعه دهندگان پیشرفت سرعت را آزمایش کردند و دریافتند که افزودن ویژگی بار تنبل HTML به همه تصاویر منجر به افزایش سرعت می شود.
با این حال ، این یک اجرای ناقص از ویژگی بار تنبل بود زیرا وردپرس در حال اضافه کردن ویژگی بار تنبل به تصویر برجسته است که عنصری است که به طور کلی در بازدید از یک وب سایت هنگام بازدید از یک صفحه وب وجود دارد.
این امر تأثیر منفی بر معیار Largest Contentful Paint (LCP) گذاشت و اندکی تجربه منفی کاربر را معرفی کرد.
سود حاصل از افزودن بار تنبل از ضررهای ناشی از ضربه به معیار LCP پیشی گرفت ، بنابراین وردپرس این کار را ادامه داد.
اما گوگل متوجه شد که پس از اجرای بارگذاری تنبل در هسته وردپرس ، نمرات Lowest Contentful Paint (LCP) کمی افت کرد.
در مقاله ای که گوگل در Web.dev منتشر کرد آنها در مورد عملکرد عملکرد بارگذاری تنبل زیاد ، داده های وب سایتهای واقعی را مورد بررسی قرار دادند و دریافتند که سایتهایی با بارگذاری تنبل زیاد از نمرات ضعیف LCP رنج می برند.
آنها دریافتند که اجرای بارگذاری تنبل تهاجمی دلیل آن است و متوجه شدند که این موضوعی خاص سایت های وردپرس است.
تبلیغات
ادامه مطلب را در زیر ادامه دهید
گوگل تأیید کرد که نمرات وردپرس برای LCP در حال کاهش است.
نویسندگان به این نتیجه رسیدند:
“… تکنیک بارگذاری تنبل که توسط وردپرس استفاده می شود به وضوح به کاهش بایت های تصویر کمک می کند اما به قیمت تأخیر LCP.”
Lighthouse 8.4.0 LCP Lazy Load Audit را اضافه می کند
ناشران ممکن است نمرات بزرگترین محتوای رنگ (LCP) خود را کاهش داده باشند و دلیل بدتر شدن آنها را درک نکرده باشند. Lighthouse 8.4.0 این مسئله را با افزودن حسابرسی مخصوص تشخیص این مشکل حل می کند.
همه تصاویر موجود در بزرگترین نمای نمای رنگی محتوا ، قسمتی از صفحه وب که بازدیدکنندگان ابتدا مشاهده می کنند ، نباید با تنبلی بارگذاری شوند.
Lighthouse 8.4.0 تشخیص می دهد که آیا عناصری در نمای LCP وجود دارند که بارگذاری تنبلی دارند.
تبلیغات
ادامه مطلب را در زیر ادامه دهید
آ صفحه برنامه نویس Chrome نحوه عملکرد Lighthouse 8.4.0 را توضیح می دهد:
“فانوس دریایی اکنون تشخیص می دهد که آیا بزرگترین عنصر رنگ محتوا (LCP) یک تصویر بارگذاری تنبل بوده است و توصیه می کند ویژگی بارگذاری را از آن حذف کنید.”
صفحه توسعه دهنده رسمی Lighthouse 8.4.0 عملکرد جدید را شرح می دهد:
“تشخیص دهید که عنصر LCP بارگذاری تنبلی دارد. تصاویری که چندین بار بارگذاری می شوند ، بعداً در چرخه عمر صفحه ارائه می شوند که می تواند بزرگترین رنگ پر محتوا را به تأخیر بیندازد. “
حسابرسی جدید Viewport Mobile
Lighthouse 8.4.0 همچنین ممیزی جدیدی را اضافه می کند که در صورت عدم وجود متا برچسب نمایشگر تلفن همراه در قسمت head تشخیص می دهد.
این مهم است زیرا عدم افزودن این متا تگ می تواند منجر به کاهش نمره تأخیر ورودی اول شود.
تبلیغات
ادامه مطلب را در زیر ادامه دهید
مستندات اهمیت این ممیزی جدید را توضیح می دهد:
“در مطالعه اخیر داده ها از بایگانی HTTP ، بیش از نیمی از سایت هایی که نمره 90 یا بالاتر را در Lighthouse دریافت کرده اند ، اما حداقل یک Core Web Vital را شکست داده اند ، دارای مجموعه نمای تلفن همراه نبوده و FID را از دست داده اند. در نتیجه ، بخش عملکرد Lighthouse در حال حاضر توصیه می کند که در صورت عدم وجود یک نمای نمایش مانند زیر اضافه کنید:
<meta name="viewport" content="width=device-width">"
Lighthouse 8.4.0 زنده است
Lighthouse 8.4.0 اکنون در PageSpeed Insights فعال است و در صورت یافتن یک عنصر بارگذاری تنبل در بزرگترین نمای نمایش رنگ محتوا ، هشدار LCP جدید را فعال می کند.
تبلیغات
ادامه مطلب را در زیر ادامه دهید
Chrome Dev Tools دارای Lighthouse 8.4.0 در Chrome 95 است که در حال حاضر برای انتشار در 19 اکتبر 2021 برنامه ریزی شده است.