Головна/WordPress Fullstack/Блупринти/DevOps & Швидкість/Оптимізація швидкості та Core Web Vitals до 90+
До карток розділу «DevOps & Швидкість»
DevOps & Швидкість(ТЗ 3 из 54)
ТЗ: Оптимізація швидкості та Core Web Vitals до 90+
DevOps & Швидкість5 шагов • +25 XP

ТЗ: Оптимізація швидкості та Core Web Vitals до 90+

Технічна специфікація з оптимізації повільного сайту WordPress: дворівневе кешування (Redis / FastCGI), оптимізація медіа (WebP/AVIF), мінімізація CSS/JS та виведення показників Core Web Vitals у зелену зону.

+5 XP за шаг
Выполнено 0 из 5 шагов (0%)
Трудозатраты~8 рабочих часов
Фриланс вилка~$360 – $600 (€320 – €560)
Оценка веб-студии~$760 – $1,280 (€720 – €1200)

ТЗ заказчика (исходный бриф):

«Сторінки повинні відкриватися менш ніж за 2 секунди на 4G без поломки слайдерів, кошика чи фільтрів.»
Ключевые требования:
  • •Повний первинний аудит через Google PageSpeed Insights та Query Monitor
  • •Налаштування Redis Object Cache для усунення зайвих запитів до MySQL
  • •Автоматична генерація форматів WebP/AVIF із обов'язковими розмірами width/height
  • •Кешування сторінок на рівні Nginx FastCGI Cache або налаштування WP Rocket
  • •Відповідність критеріям Core Web Vitals: LCP < 2.5с, CLS < 0.1, INP < 200мс
Ограничения проекта:
  • •Обхід кешу для авторизованих користувачів, сторінок оформлення замовлення та кошика
  • •Збереження працездатності jQuery та інтерактивних скриптів
Критерии приёмки (KPI):
  • Оцінка PageSpeed Insights для мобільних ≥ 90/100
  • Час відповіді сервера (TTFB) < 200 мс
  • Показник CLS строго 0 на всіх шаблонах

Конфигурация блупринта под условия проекта

Выберите архитектуру и стек — шаги роадмапа, структура файлов и примеры кода переключатся автоматически:

Пошаговое практическое руководство по ТЗ

Подробный разбор архитектуры, код реализации и советы эксперта по каждому этапу:

1
Этап 1 из 5

Крок 1: Первинний аудит та пошук вузьких місць

Практическое руководство:

Проведіть комплексне тестування швидкості в Google PageSpeed Insights та WebPageTest. За допомогою плагіна Query Monitor виявіть повільні SQL-запити, надлишкові транзієнти та важкі виклики хуків PHP.

Важные технические нюансы и подводные камни:

Тестуйте в режимі інкогніто або через зовнішні інструменти, щоб кеш вашого браузера не спотворював реальні показники нових відвідувачів.

2
Этап 2 из 5

Крок 2: Налаштування об'єктного кешування на базі Redis

3
Этап 3 из 5

Крок 3: Оптимізація медіа (WebP/AVIF) та явні розміри

4
Этап 4 из 5

Крок 4 (Сервер): Налаштування Nginx FastCGI Cache

5
Этап 5 из 5

Крок 5: Контрольне тестування та здача проєкту

Инструменты экосистемы Fullstack AI Lab для этого ТЗ

Интеграция

AI-Собеседование

Пройти голосовое или текстовое интервью по технологиям ТЗ

Архитектурные Воркфлоу

43 пошаговых сценария с командами CLI и готовыми конфигами