Google Pagespeed оптимізація для сайту negotiations.com
У середині грудня 2017 року до мене звернувся Келем Коберн із компанії «Negotiation Experts». Це міжнародна компанія, що проводить тренінги персоналу. Її послугами користуються такі великі компанії, як British Petroleum, Shell, Mars, Hilton, Unilever, Sisco, Xerox та інші. Детальніший список компаній тут. Офіси «Negotiation Experts» є у Сіднеї, Нью-Йорку, та Лондоні.
Келем Коберн координує розробку їх веб сайту negotiations.com. Для них важливо мати хороше SEO, в тому числі і в Google PageSpeed Insights.
Їх веб сайт - це класичний WordPress сайт із купленою темою «ElegantThemes Divi». У Google PageSpeed Insights було дуже багато зауважень до їхнього сайту. Повний перелік зауважень та бали можна побачити на цих фото:
Мобільна версія, до оптимізації
Настільна версія, до оптимізації
Загалом в середньому 35 балів для мобільної версії, та 45 для настільної.
Я багато працював, щоб виправити всі ці проблеми, і загалом витратив близько 3 тижнів. Але як результат - тепер сайт має 86 балів у мобільні версії та 93 бали у настільній (із 100 можливих).
Після оптимізації:
Головна сторінка. Мобільна версія
Сторінка із статтею. Мобільна версія
Головна сторінка. Настільна версія
Сторінка із статтею. Настільна версія
Найбільш складним у цій роботі було створити First Screen CSS Cache. Це набір css стилів, що відповідають за вигляд верху сторінки, без прокрутки. В цілому на сайті є 6500 css стилів. За допомогою свого спеціального скрипту я вибрав із них 650 css стилів і розмістив їх у html шапці. Це і є First Screen CSS Cache. Всі інші стилі зараз завантажуються в кінці html. Таким чином вирішується питання "Eliminate render-blocking CSS". Наявність First Screen CSS Cache дає можливість сторінці нормально виглядати під час завантаження, поки основні файли стилів не будуть завантажені у кінці html.
Цього разу я не виносив jQuery у кінець html, оскільки тема сайту «Divi» побудована на jQuery. Результат і без того вийшов чудовим. Його можна покращити ще на 3 бали, якщо купити швидший сервер, і довести час відповіді сервера до < 0.2 секунди.
Ось відгук Келема Коберна про мене на сайті upwork.com :
«Ihor delivered as promised. Ihor transformed our slow pagespeed to 93 in the US, and 86 here in Sydney. Ihor is highly communicative, and he worked well with my team. While it took longer, I'm very happy with the result»
«Ігор виконав свої обіцянки. Він пришвидшив наш pagespeed до 93 балів в США, і до 86 балів тут у Сіднеї. Ігор дуже комунікабельний, і від добре спрацювався із моєю командою. Хоч робота і тривала довше, я дуже задоволений результатом»
Трохи згодом я переналаштував CloudFlare CDN і підвищив швидкість сайту до 93 балів скрізь, в тому числі і у Сіднеї. Після завершення цього проекту Келем запропонував мені продовжити працювати над його сайтами на постійні основі.