Прискорення інтернет-магазину на Python/Django: як підняли PageSpeed з 40 до 91

- Ніша: Інтернет-магазин із великою кількістю візуального контенту. - Платформа: Самописний сайт на Python (Django). Запит клієнта: Прискорити роботу сайту для покращення SEO-показників та зручності користувачів, особливо на мобільних пристроях зі слабким інтернетом.

Всі кейси

Було / Зробили / Стало

Було
Сайт вантажився довго, особливо на смартфонах (показник PageSpeed Mobile був близько 40). Важкі скрипти маркетингу та неоптимізовані банери "забивали" канал зв'язку, а сторінки неприємно "стрибали" під час завантаження картинок
Зробили
Провели глибоку оптимізацію критичного шляху рендерингу, налаштували сучасні формати зображень та переробили логіку завантаження важких скриптів аналітики
Стало
Сайт мивтєво відкривається навіть на 4G. Сторінки завантажуються плавно і стабільно, а показники Google PageSpeed злетіли до "зеленої" зони на десктопі

Результати

  • Швидкість Desktop: Показник ефективності зріс до 91/100
  • Швидкість Mobile: Показник виріс з ~40 до 65 (це відмінний результат для насиченого графікою інтернет-магазину)
  • Покращення UX та SEO: Зникли візуальні "стрибки" макета, що напряму впливає на лояльність користувачів та ранжування в Google

Що впровадили

  • Розумна графіка: Налаштували автоматичну конвертацію важких банерів у легкий формат WebP. Додали відкладене завантаження (Lazy Loading) для контенту нижче екрану та пріоритетне (Preload) для головного банера.
  • Оптимізація рендерингу: Розділили CSS на пріоритетний і допоміжний, додали миттєве відображення тексту (не чекаючи завантаження файлів шрифтів) та "полегшили" CSS-анімації, які гальмували скрол на бюджетних смартфонах
  • Технічна стабільність: Виправили баги кешування зображень (Sorl-thumbnail) та прописали жорсткі розміри картинок, щоб сторінка більше не смикалася при завантаженні.

Головною фішкою стала нестандартна робота з аналітикою (Google Tag Manager, Facebook Pixel). Зазвичай маркетологи вішають ці скрипти так, що вони “вбивають” швидкість ще до того, як клієнт побачить товар. Ми зробили хитро: відклали їх завантаження на 3.5-4 секунди. Тепер процесор телефону спочатку блискавично малює сам сайт для клієнта, а вже потім, непомітно на фоні, підвантажує всю рекламну аналітику. Маркетологи щасливі, а сайт літає

Всі кейси