Ознакомьтесь с обновлениями продуктов, которые мы анонсировали! Смотрите, что нового.

/

Оптимизация скорости загрузки страниц

Проанализировав результат проверки сервиса "PageSpeed Insights"

Были выполнены следуюшие правки для оптимизации загрузки:

  1. Написан скрипт преобразующий формат изображений JPEG/PNG и тд в облегченный WEBP с жатием без потери качества преобразование ведется контент менеджером, выполнено на __ %

  2. Написан скрипт который автоматически находит самые важные файлы оформления (стили) и заставляет сайт загружать их в первую очередь. Остальные прогружаются позднее

  3. Оптимизирована загрузка веб-шрифтов: добавлено свойство font-display: swap для файлов шрифта Manrope. Теперь текст на сайте отображается сразу (системным шрифтом), не дожидаясь полной загрузки основных файлов, что ускоряет визуальную отрисовку страниц.

  4. Оптимизирована метрика LCP (Largest Contentful Paint) на первом экране: для самого крупного визуального элемента (первом ряду товаров в каталоге) отключена отложенная загрузка («lazy load»). Дополнительно внедрена приоритетная предзагрузка (<link rel="preload">), что заставляет браузер скачивать главное изображение параллельно со стилями, полностью исключая задержку рендеринга контента.

  5. Анализ времени ответа сервера (TTFB) и нагрузки на БД: С помощью «Монитора производительности» проведена диагностика страниц каталога. Выявлена критическая проблема: при загрузке некоторых разделов к базе данных выполняется более 1000 SQL-запросов на один хит, что является отклонением от нормы и главным фактором долгого ответа сервера. Проблема требует более глубокого рефакторинга кода компонентов и оптимизации самих запросов.

  6. Оптимизация и адаптация медиа-контента главных баннеров: Из шаблона компонента вывода баннеров полностью исключена отложенная загрузка (lazy load) для первого слайда, для того, чтобы снизить время отрисовки LCP-элемента на смартфонах.

Проанализировав результат проверки сервиса "https://pagespeed.web.dev/"

Были выполнены следуюшие правки для оптимизации загрузки: 1) 2)

Ткущая проверка через сервис PageSpeed Insights выдает следующие данные

---- Десктопная версия


---- Мобильная версия