Оптимізація Core Web Vitals (OpenCart) під Google PageSpeed — Мобільна та ПК версії
Опис замовлення:
Шукаємо досвідченого frontend-розробника/фахівця з OpenCart для оптимізації швидкості завантаження сайту (категорії та картки товарів) під вимоги Google Core Web Vitals.
Про проект:
* CMS: OpenCart.
* Специфіка: Сайт працює в режимі каталогу (кошика та оформлення замовлення немає).
* Об'єм: 2900 позицій.
* Серверна частина: Вже оптимізована (працює на OpenLiteSpeed).
* Стек: Робота ведеться виключно з кодом шаблону, модифікаторами та фронтендом. Без роботи із базою даних.
Що потрібно зробити (Технічне завдання):
1. Відкладене завантаження скриптів (Delay JS):
* Проблема: Сторонні скрипти аналітики (GTM, Google Tag) блокують основний потік на мобільних пристроях приблизно на 4.3 секунди.
* Завдання: Налаштувати відкладений запуск цих скриптів. Скрипти повинні активуватися строго по першій дії користувача (перший скролл, тап по екрану або рух миші).
* Важливо: Збір статистики, аналітика та робота реклами мають зберегтися у повному обсязі.
2. Виправлення метрики CLS (Стабільність верстки):
* Проблема: Сторінка «стрибає» і зсувається під час завантаження картинок.
* Завдання: У файлах стилів або шаблону теми жорстко прописати HTML-атрибути width і heightдля всіх зображень товарів у каталозі (листингах) та картках товару.
* Мета: Зарезервувати місце під зображення в DOM-дереві до їх фактичного завантаження, щоб унеможливити зсув контенту. Перевірити, щоб адаптивність (CSS) не зламалася.
3. Оптимізація критичного шляху (LCP):
* Завдання: Прописати для основного (головного) зображення товару першому екрані тег fetchpriority="high". Це дасть браузеру команду завантажувати головне фото товару у пріоритетному порядку.
Вимоги до виконавця та умови приймання:
1. Без зайвих модулів: Робота виконується чистим кодом/модифікаторами, без встановлення додаткових сторонніх чи платних плагінів оптимізації.
2. Безпека та верстка: Ви несете повну відповідальність за верстку. Після внесення правок візуальне відображення сайту на мобільних та ПК, а також функціонал (фільтри, перемикання фото в галереї, меню) повинні залишитися без змін.
3. Критерій здачі роботи (DoD): Надання скріншота та посилання на живий тест звіту Google PageSpeed Insights (для мобільної версії). Показник продуктивності має бути не нижчим за 75 балів, а метрика CLS — не більше 0.1 (у зеленій зоні).
Правки вносити строго через модифікатори (OCMOD) або копію теми, щоб не затерти оновлення ядра.
У відгуку, будь ласка, вкажіть:
1. Чи був досвід налаштування Delay JS саме для GTM на OpenCart?
2. Термін виконання завдання.
3. Вартість роботи.
-
140 Доброго дня.
Відповідаю на ваші три питання:
1. Досвід з Delay JS для GTM — є. Підхід: JS-обгортка, яка блокує ініціалізацію GTM до першої дії користувача (scroll / click / mousemove). Після спрацювання — стандартний запуск, аналітика та реклама зберігаються повністю.
2. Термін — 3–4 дні.
3. Вартість — 4000 UAH.
По решті задач: CLS закрию через width/height у шаблонах лістингу та картки товару, перевірю що max-width: 100% в CSS не зламає адаптив. fetchpriority="high" пропишу на головне зображення товару. Всі правки — через OCMOD або копію теми, ядро не чіпаю.
Одне уточнення по критерію здачі: три конкретні пункти ТЗ — Delay JS, CLS та LCP — я гарантую. Загальний бал PageSpeed залежить від стану всього сайту, тому до старту варто разом подивитись поточний звіт — щоб розуміти, чи вистачить саме цих правок для ≥75, або є щось іще що потягне вниз.
-
232 Доброго дня! Робив саме таку оптимізацію OpenCart — Delay JS через слухач першої дії (scroll/touch/mousemove), щоб GTM і Google Tag підвантажувались по події і вся статистика лишалась цілою, плюс width/height на зображення каталогу проти CLS і fetchpriority=high на головне фото картки під LCP. Усе чистими модифікаторами, без сторонніх плагінів. Підкажіть тільки, тема стандартна Journal чи кастомний шаблон — від цього залежить, де перехоплювати вивід зображень у лістингу. Зроблю за 2-3 дні, віддам зі скрінами PageSpeed до/після для мобільної.
-
344 1 0 Вітаю! Маю практичний досвід саме з цим набором задач на OpenCart — Delay JS під GTM, CLS і LCP — усе через OCMOD / копію теми, без платних плагінів оптимізації.
По ваших питаннях:
1. Так, Delay JS для GTM на OpenCart налаштовував. Запускаю скрипти строго по першій дії користувача (scroll / tap / рух миші), але додатково ставлю страхувальний таймаут — щоб виконати одразу обидві ваші вимоги: і відкласти запуск, і не втратити жодної сесії. Чистий interaction-only delay непомітно «з'їдає» bounce-трафік (хто зайшов і пішов без взаємодії — у GTM не потрапляє), а таймаут це закриває. Тож збір статистики й робота реклами зберігаються в повному обсязі.
2. Термін: 2–3 робочі дні з тестуванням на мобільних і ПК.
3. Вартість: 4000 грн.
CLS закрию через width / height + aspect-ratio в стилях — місце під фото резервується, але адаптив не ламається.
… Готовий узяти в роботу. Скиньте посилання на сайт — гляну й підтверджу терміни.
-
871 10 0 Виконаю оптимізацію відповідно до ТЗ (Delay JS, виправлення CLS, fetchpriority, через OCMOD без сторонніх модулів). Після внесення змін проведу тестування в Google PageSpeed Insights і за можливості досягну цільових показників. Якщо обмеження пов’язані з іншими елементами сайту, що не входять до ТЗ, повідомлю про них окремо.
-
96760 1276 1 10 Вітаю.Є великий досвід в пришвидшенні сайтів.Готовий до співпраці.
-
1510 10 0 Добрий день! Ми маємо досвід у оптимізації OpenCart під вимоги Google Core Web Vitals. Реалізуємо це через налаштування кешування, оптимізацію зображень, мініфікацію ресурсів та усунення блокуючих скриптів. Це забезпечить високі показники PageSpeed для мобільної та десктопної версій, покращуючи ранжування та користувацький досвід. Готові приступити до аналізу та впровадження технічних рішень.
-
Вітаю, покажіть сайт, щоб розуміти масштаби проблеми
-
ТЗ написано AI (з помилками), виконавці ставлять ставки з AI текстом (не думаючи над реальною роботою). По факту AI проти AI )))
Якщо по факту - треба переписати на реальні вимоги + очікуваний результат, і можна брати в роботу )