Ленивая загрузка – это выжидательный подход к работе с ресурсами, когда загрузка ресурса откладывается до момента, пока он фактически не понадобится. В таком случае при работе с критически важными ресурсами экономятся данные, а также снижается конкуренция за эти данные при работе по сети. Такой прием стал веб-стандартом в 2019 году, а сегодня loading=«lazy» для изображений поддерживается в большинстве крупных браузеров. На словах все отлично, но случается ли перебор с ленивой загрузкой?
В этом посте обобщены и проанализированы данные о прозрачности веба, взятые в открытых источниках, а также проделано импровизированное A/B тестирование. Эта работа помогает понять производительность и степень внедрения нативной ленивой загрузки при работе с картинками. Оказывается, ленивая загрузка может быть поразительно эффективна при избавлении от ненужных картиночных байт, но, если с ней переусердствовать – это плохо скажется на производительности. А именно: наше исследование показывает, что при более жадной загрузке изображений в пределах первичной области видимости – в сочетании с более свободной и ленивой загрузкой остальных – достижима золотая середина. Экономится количество загруженных байт и улучшаются показатели Core Web Vitals.
В этом посте обобщены и проанализированы данные о прозрачности веба, взятые в открытых источниках, а также проделано импровизированное A/B тестирование. Эта работа помогает понять производительность и степень внедрения нативной ленивой загрузки при работе с картинками. Оказывается, ленивая загрузка может быть поразительно эффективна при избавлении от ненужных картиночных байт, но, если с ней переусердствовать – это плохо скажется на производительности. А именно: наше исследование показывает, что при более жадной загрузке изображений в пределах первичной области видимости – в сочетании с более свободной и ленивой загрузкой остальных – достижима золотая середина. Экономится количество загруженных байт и улучшаются показатели Core Web Vitals.
