وردپرس مقاله ای را در بخش توسعه دهندگان خود منتشر کرد و در آن پیشنهاد اصلاح رفتار پیش فرض بارگذاری تنبل وردپرس را مطرح کرد. آزمایش نشان داد که تغییر پیشنهادی ، معیار عملکرد Core Web Vital را تا 33٪ بهبود داده است.
پیشنهاد بهبود وب هسته های مهم در وردپرس
در این پیشنهاد آمده است كه كنترل دقیق دانه ویژگی بارگذاری تنبل در اختیار توسعه دهندگان تم است.
با این وجود ، مشخص شد که با اصلاح نحوه اضافه شدن بارگذاری تنبل به طور پیش فرض ، نتایج قابل توجهی در معیار اصلی Core Web Vital به نام Largest Contentful Paint (بهبود بزرگترین محتوای رنگ) ایجاد می شود.
این پیشنهاد بهبود را به این ترتیب توصیف می کند:
“به جای بارگیری تنبل همه تصاویر و فریم ها به طور پیش فرض ، اولین تصویر محتوا (همچنین با توجه به تصاویر برجسته) یا iframe محتوا نباید با تنبل بارگذاری شود.
این پیش فرض حساس تری نسبت به آنچه در اجرای فعلی استفاده می کند ، است که به طور متوسط و در مقیاس منجر به عملکرد بهتر LCP در خارج از جعبه می شود ، در حالی که پهنای باند لازم را پایین نگه می دارد. “
تنبل بارگیری و بزرگترین رنگ محتوای
Lazy loading روشی است برای سرعت بخشیدن به بارگیری صفحه با تأخیر در بارگیری عناصر صفحه وب مانند تصاویر و فریم هایی که در حال حاضر نیازی نیست.
تبلیغات
ادامه مطلب در زیر
با استفاده از بارگذاری تنبل ، می توان عناصر مانند تصاویری را که در صفحه مرورگر بازدید کننده سایت قابل مشاهده نیستند ، با استفاده از یک ویژگی HTML به نام ویژگی بارگیری به تأخیر انداخت.
تصویر یک عنصر HTML صفحه وب است.
ویژگی HTML کدی است که یک عنصر HTML را مانند تصویر اصلاح می کند.
ویژگی بارگذاری با تغییر دادن تصویر به مرورگر برای تأخیر در بارگیری تصویر ، تصویر را اصلاح می کند.
ویژگی بارگذاری به مرورگر می گوید که بارگیری تصویر را به تعویق بیندازد ، و مرورگر را برای بارگیری عناصر مهم صفحه که بلافاصله برای بازدیدکننده وب قابل مشاهده است آزاد می کند.
این امر باعث تعامل سریعتر صفحه برای بازدید کننده سایت می شود.
Large Contentful Paint (LCP) سرعت بارگیری تصویر و سایر عناصر را در نمای بازدیدکنندگان سایت (صفحه مرورگری که بازدید کننده می بیند) اندازه گیری می کند.
یک تصویر معمولاً به صورت HTML در این کد کد می شود:
اضافه کردن بارگذاری تنبل یک موضوع ساده برای افزودن ویژگی HTML تنبل است:
چگونه وردپرس 5.9 می تواند بزرگترین رنگ محتوای را بهبود بخشد
توسعه دهنده ای که پیشنهاد بهبود LCP را منتشر کرد ، خاطرنشان کرد که از وردپرس 5.5 ، کد اصلی ویژگی بارگذاری تنبل را به طور پیش فرض به تمام تصاویر و فریم ها اضافه کرده است.
تبلیغات
ادامه مطلب در زیر
اما این ایده آل نیست زیرا تصاویر بالای صفحه ، مانند آرم ها و تصاویر برجسته ، باید بارگیری شوند تا صفحه وب قابل استفاده شود.
وردپرس بارگذاری تنبل را مانند این اجرا کرد زیرا هیچ راهی برای حذف دقیق مهمترین تصاویر از دریافت ویژگی بارگذاری تنبل وجود نداشت.
دلیل این امر این است که همه مضامین به طور متفاوتی کدگذاری می شوند و به همین دلیل بهتر است توسعه دهندگان مضمون این نوع محرومیت گرانول را انجام دهند.
در حالی که اجرای فعلی تنبل پیش فرض وردپرس ایده آل نبود ، افزودن بارگذاری تنبل به این روش بهبودی نسبت به اضافه نکردن ویژگی بارگذاری است.
آنچه پیشنهاد شده نشان دهنده یک بهبود آشکار است همانطور که نتایج آزمون ذکر شده در زیر نشان می دهد.
چگونه وردپرس بزرگترین رنگ محتوای را بهبود می بخشد
آنچه تیم توسعه دهنده وردپرس پیشنهاد کرده این است که اضافه کردن ویژگی بارگذاری تنبل به اولین تصویر یا iframe در کد را حذف کند.
توسعه دهنده این روش را در 50 تم محبوب وردپرس مورد آزمایش قرار داده و کشف کرده است که افزودن آن به اولین تصویر یا عنصر iframe باعث بهبود متوسط نمره LCP Core Web Vital ها به طور متوسط 7٪ می شود.
سپس توسعه دهنده با افزودن بارگذاری تنبل به دو عنصر ، میزان بهبود LCP را آزمایش کرد. افزایش عملکرد به طور متوسط 2٪ کاهش یافته است ، و این امر باعث می شود که بدون بارگذاری تنبل از بیش از یک عنصر ، LCP بهتر بهبود نمی یابد.
اینها برخی از یافته ها است:
“حذف اولین تصویر محتوای ناشی از تنبلی ، منجر به بهبود LCP متوسط 7٪ (1787 میلی ثانیه در مقایسه با 2،020 میلی متر با رفتار اصلی فعلی) و بایت تصویر متوسط 0٪ افزایش (368 کیلوبایت در مقایسه با 369 کیلوبایت با رفتار اصلی فعلی) ) mit حذف اولین تصویر محتوا به وضوح منجر به بهبود LCP می شود در حالی که بیت های تصویر ذخیره شده به طور محسوسی پس نمی روند.
حذف دو تصویر اول محتوا از تنبلی باعث بهبود LCP متوسط 5٪ (1927 میلی ثانیه در مقایسه با 2،020 میلی متر با رفتار اصلی فعلی) و بایت تصویر متوسط 2٪ افزایش (378 کیلوبایت در مقایسه با 369 کیلوبایت با رفتار اصلی فعلی) ) mit حذف دو تصویر محتوای اول نتایج بدتری برای هر دو معیار ارائه می دهد تا اینکه فقط تصویر اول را حذف کنید ، یعنی بهتر است فقط از بارگذاری تنبل برای تصویر محتوای اول صرف نظر کنید ، و بنابراین هیچ آزمایش اضافی با تعداد بیشتری از تصاویر که تنبل نیستند – بارگیری لازم است. “
تبلیغات
ادامه مطلب در زیر
نتایج جدید بارگذاری تنبل وردپرس
- 5٪ از مضامین در گروه آزمون نمره LCP را کسب کردند که 10٪ بدتر تا 21٪ بدتر بود.
- 42٪ از مضامین نمرات LCP را از 10٪ به 33٪ بهتر ارتقا دادند.
- آزمایش نشان داد که مزایا برای اکثر موضوعات مورد آزمایش بهتر است.
طبق پیشنهاد وردپرس:
“در حالی که میانگین LCP بهبود در تمام مضامین فقط 7٪ است ، اما تعداد قابل توجهی از مضامین برنده قابل توجه تر هستند ، در حالی که ضررهای قابل توجه حداقل است.”
گوگلر یک افزونه اثبات مفهوم می سازد
یک متعهد اصلی وردپرس اثبات پچ مفهوم (POC) را به صورت افزونه ایجاد کرده است ، احتمالاً برای اشکال زدایی و آن را در GitHub منتشر کرده است.
بنابراین انتشار رسمی افزونه وردپرس نیست نه توصیه می شود سریع عجله کنید و آن را نصب کنید.
انتشارات رسمی افزونه در مخزن افزونه وردپرس ارسال می شود.
چه زمانی بارگذاری تنبل تصفیه شده وارد می شود؟
جدول زمانی برای بهبود رفتار بارگذاری تنبل در حال حاضر برای وردپرس 5.9 تنظیم شده است.
وردپرس 5.9 در حال حاضر قرار است در دسامبر 2021 منتشر شود.
پیشنهاد بهبود ویژگی بارگذاری تنبل اکنون در حال بحث و بررسی است و تاکنون با نظر مثبت در نظرات مواجه شده است.
تبلیغات
ادامه مطلب در زیر
بنابراین ، مگر اینکه یک مسئله پیش بینی نشده در حال حاضر پیش بیاید ، بسیار ممکن است که اواخر امسال امتیازات بهبود یافته بزرگترین رنگ محتوای به سایت های وردپرس برسد.
استناد
ایاطلاعیه پیشنهادی وردپرس
تصفیه پیاده سازی Lazy-loading Core WordPress
صفحه GitHub وردپرس برای بهبود بارگذاری تنبل
ویژگی Lazy-loading را در اولین تصویر محتوای / iframe حذف کنید