Опубликовано: 24 июня 2026 г.
Nuvemshop (известный как Tiendanube в испаноязычной Латинской Америке) — ведущая платформа электронной коммерции в регионе, обслуживающая более 180 000 онлайн-магазинов. Поскольку продавцы настраивают свои витрины с помощью множества тем и динамического размещения контента, обеспечение быстрой загрузки страниц в таком разнообразии представляет собой уникальную техническую задачу.
- Показатель Largest Contentful Paint (LCP) улучшился на 68% , с 57% до 96% за год, что отражает существенный сдвиг в том, как магазины отображают контент в верхней части экрана для реальных пользователей.
- Показатель успешного прохождения теста Core Web Vitals вырос с 48% до 72% , что означает, что почти 3 из 4 магазинов теперь соответствуют базовому порогу производительности Google.
- Вовлеченность покупателей заметно улучшилась: анализ той же группы бразильских магазинов, работавших в январе 2025 и январе 2026 года, показал, что мобильные посетители, перешедшие из органического поиска Google, продемонстрировали следующее:
- Увеличение коэффициента конверсии (сессия-оплаченный-заказ) на 8,9%.
- Увеличение коэффициента вовлеченности покупателей в корзину на 8,4% (от сессии до корзины).
- Наибольший прирост обеспечили мобильные устройства , что соответствует областям, где улучшения в рамках программы LCP были наиболее значительными.
Эти результаты совпадают с исследованием Deloitte, проведенным по заказу Google (более 30 миллионов сессий по 37 брендам) , которое показало, что улучшение скорости загрузки на 0,1 секунды может увеличить коэффициент конверсии в розничной торговле на 8,4%, что подтверждает правильность наших инвестиций.
Задача: обнаружение LCP в динамических макетах интернет-магазинов.
В начале 2025 года только 48% наших магазинов соответствовали пороговым значениям Core Web Vitals, а 57% имели хорошие показатели LCP. Наша первоначальная гипотеза заключалась в весе изображений или задержке сервера. Мы ошиблись.
Анализ данных PageSpeed Insights, проведенный на тысячах магазинов, показал, что наша платформа позволяет продавцам динамически располагать разделы на главной странице: карусели, баннеры, товарные сетки и пользовательские модули могут отображаться в любом порядке.
Эта гибкость привела к непредвиденной проблеме: нужный элемент не всегда идентифицировался как LCP. В магазинах с каруселями, которые составляли 85% наших витрин, баннер, расположенный ниже в области просмотра, иногда помечался как LCP вместо первого изображения карусели, в зависимости от того, как страница отображалась на разных экранах и устройствах. Это означало, что наши усилия по оптимизации не давали желаемого эффекта: мы оптимизировали элементы, которые на самом деле не являлись элементами LCP.
В отличие от типичных SaaS-платформ, мы не могли просто исправить главную страницу. Нам нужно было решение, которое работало бы со всеми возможными конфигурациями тем, расположением разделов и настройками для продавцов, не нарушая работу существующих магазинов и не ограничивая свободу творчества.
Как динамические макеты влияют на выбор элементов LCP
Анализ данных PageSpeed Insights и мониторинг реальных пользователей показали, что CSS-переходы в каруселях и баннерах задерживались, когда элементы становились видимыми для алгоритма определения LCP браузера. Даже несмотря на то, что пользователи воспринимали загрузку карусели как первую, браузер иногда помечал баннер во второй секции как элемент LCP — потому что видимость этого элемента не задерживалась из-за эффектов перехода.
Мы выявили три основные причины:
- При отображении видимых элементов CSS-переходы задерживались, что приводило к смещению обнаружения LCP в неправильный фрейм.
- Отложенная загрузка применялась к изображениям в верхней части области просмотра, которые должны были загружаться немедленно.
- Отсутствие сигналов приоритета означало, что наиболее важные изображения не загружались первыми.
Мы также обнаружили, что значительная часть измерений LCP приходилась на страницы категорий и товаров, а не только на главные страницы, а это означало, что наши исправления должны применяться единообразно ко всем типам страниц с высокой посещаемостью.
Реализация: устранение трех основных причин в масштабах всей страны.
После выявления причин, исправления оказались простыми. Мы последовательно применяли их ко всем основным темам и типам страниц, но каждое исправление требовало тщательного планирования, чтобы избежать создания новых проблем.
- Удалены CSS-анимации для разделов, расположенных на первой позиции. Разделы, которые отображаются первыми на странице, теперь отображаются мгновенно, гарантируя, что браузер распознает их как LCP-кандидаты без искусственных задержек.
Удалена отложенная загрузка изображений в верхней части области просмотра. Для изображений в первом разделе мы условно удаляем
loading="lazy", чтобы исключить задержку загрузки ресурсов. Мы позаботились о том, чтобы это касалось только первого изображения в разделах, занимающих первую позицию:<!-- Before --> <img src="slide-1.webp" loading="lazy" alt="Featured product"> <!-- After --> <img src="slide-1.webp" alt="Featured product">Добавлены явные сигналы приоритета. Добавив
fetchpriority="high", мы сообщаем сканеру предварительной загрузки браузера, что изображение LCP является ресурсом с наивысшим приоритетом, что позволяет обнаружить и загрузить его раньше, до завершения компоновки и рендеринга. Мы добавили логику валидации, чтобы гарантировать, что сигналы приоритета применяются только тогда, когда элемент действительно находится в позиции, где он может быть кандидатом на роль LCP: добавлениеfetchpriority="high"к слишком большому количеству изображений было бы контрпродуктивным, поскольку, если все имеет высокий приоритет, то ничто не имеет.<!-- Before --> <img src="slide-1.webp" alt="Featured product"> <!-- After --> <img src="slide-1.webp" fetchpriority="high" alt="Featured product">Снижение задержки за счет кэширования на периферии сети. Кэширование эффективно для сокращения времени загрузки, но в электронной коммерции оно сопряжено с реальным риском: предоставление устаревших данных о ценах и наличии товаров напрямую влияет на доверие клиентов и выручку. Мы подошли к этому вопросу тщательно, отслеживая бизнес-показатели наряду с данными о производительности, максимизируя коэффициенты попадания в кэш, при этом гарантируя, что мы никогда не кэшируем контент, который мог бы навредить опыту продавца или покупателя.
Влияние и результаты: улучшение показателя LCP с 57% до 96%.
| Метрическая система (январь 2025 г. – январь 2026 г.) | Относительное улучшение |
|---|---|
| LCP (хороший) | +68% (с 57% до 96%) |
| Основные показатели веб-безопасности (процент успешных проходов) | +50% (с 48% до 72%) |
| Коэффициент конверсии (сессия - платный заказ) — органический трафик Google на мобильных устройствах | +8,9% |
| Вовлеченность в корзину (сессия до корзины) — органический трафик Google на мобильных устройствах | +8,4% |
Эти улучшения вывели Nuvemshop и Tiendanube на первое место по показателям эффективности среди платформ электронной коммерции в Бразилии, Аргентине и Мексике.
Основные выводы и анализ результатов.
Благодаря гибкой архитектуре Nuvemshop мы не могли полагаться на стандартные сценарии оптимизации. Настоящая проблема заключалась не в весе изображений или задержке сервера: браузеры выбирали неожиданные элементы в качестве LCP из-за CSS-переходов, отсутствия сигналов приоритета и отложенной загрузки изображений в верхней части области просмотра.
Решение оказалось простым, как только мы поняли первопричины: удалить переходы из разделов, расположенных на первой позиции, убрать отложенную загрузку изображений в верхней части экрана и добавить явные сигналы приоритета. Мы последовательно применили это ко всем основным темам, типам страниц и более чем 180 000 магазинам на нашей платформе.
Результаты говорят сами за себя: процент успешного прохождения проверки LCP вырос с 57% до 96%, общий процент успешного прохождения проверки Core Web Vitals подскочил с 48% до 72%, а продавцы увидели ощутимые улучшения: увеличение коэффициента конверсии на 8,9% и увеличение вовлеченности покупателей в корзину на мобильных устройствах на 8,4%. Быстрые витрины магазинов — это не просто техническое достижение, они напрямую способствуют успеху продавцов.