CodeID - PHP Odessa Conf: Вячеслав Мозговой "Как сделать сайт быстрым и любимым google"
•Download as PPTX, PDF•
0 likes•100 views
Презентация доклада Вячеслава Мозгового на CodeID - PHP Odessa Conf "Как сделать сайт быстрым и любимым Google. Или особенности оптимизации Больших Сайтов". 25 июня прошла первая встреча одесского PHP сообщества на конференции CodeID - PHP Odessa Conf. Больше о конференции и сообществе: http://codeid.com.ua/ https://www.facebook.com/codeidua/ https://twitter.com/Code_ID_UA Группа для общения в LinkedIn: https://www.linkedin.com/groups/13535615 Чат в Telegram: https://t.me/codeidua
Recommended
Recommended
More Related Content
Similar to CodeID - PHP Odessa Conf: Вячеслав Мозговой "Как сделать сайт быстрым и любимым google"
Similar to CodeID - PHP Odessa Conf: Вячеслав Мозговой "Как сделать сайт быстрым и любимым google" (20)
More from CODEiD PHP Community
More from CODEiD PHP Community (11)
CodeID - PHP Odessa Conf: Вячеслав Мозговой "Как сделать сайт быстрым и любимым google"
- 1. Как сделать сайт быстрым и любимым Google Вячеслав Мозговой или особенности оптимизации Больших Сайтов
- 2. ЗАЧЕМ 2 слайд из 33
- 3. СКОРОСТЬ ЗАГРУЗКИ СТАЛА ОДНИМ ИЗ ВАЖНЫХ ФАКТОРОВ РАНЖИРОВАНИЯ В ПОИСКОВИКАХ 3 слайд из 33
- 4. УЛУЧШЕНИЕ UX 4 слайд из 33
- 5. ЭКОНОМИЯ НА ХОСТИНГЕ 5 слайд из 33
- 6. ТИПЫ УСКОРЕНИЯ 6 слайд из 33
- 7. “ФИЗИЧЕСКОЕ” УСКОРЕНИЕ 1. Ускорение генерации 2. Уменьшение веса 3. Ускорение доставки 4. Кэширование 7 слайд из 33
- 8. ВИЗУАЛЬНОЕ УСКОРЕНИЕ 1. Приоритезация загрузки критичного контента 2. Асинхронная подгрузка дополнительного контента 8 слайд из 33
- 9. УЧИМ МАТЧАСТЬ 9 слайд из 33
- 10. WEB FUNDAMENTALS 10 слайд из 33
- 11. WEBSITE PERFORMANCE OPTIMIZATION 11 слайд из 33
- 12. BROWSER RENDERING OPTIMIZATION 12 слайд из 33
- 13. CLIENT-SERVER COMMUNICATION 13 слайд из 33
- 14. СТОИТ ПОСТОЯННО ЧЕРПАТЬ ЗНАНИЯ ИЗ ТЕМАТИЧЕСКИХ РЕСУРСОВ 14 слайд из 33
- 15. ИНСТРУМЕНТЫ АНАЛИЗА 15 слайд из 33
- 16. PageSpeed Insights 16 слайд из 33
- 17. WEBPAGETEST 17 слайд из 33
- 18. Chrome DevTools 18 слайд из 33
- 19. ЕЩЕ НЕСКОЛЬКО ... 19 слайд из 33
- 20. ТАК КАКИЕ ЖЕ, ТАКИ, ОСОБЕННОСТИ? 20 слайд из 33
- 21. ГОТОВЬТЕСЬ СТАТЬ “НЕДО-” СЕО-шником Бэк-эндером (или Фронт-эндером) Админом Контент менеджером ПМ-ом Оратором 21 слайд из 33
- 22. А ТАК ЖЕ К ТОМУ, ЧТО Это придется делать постоянно Вас начнуть недолюбливать) 22 слайд из 33
- 23. 23 слайд из 33
- 24. SEO ДОЛЖНО “ВЫЖИТЬ” ЛЮБОЙ ЦЕНОЙ 24 слайд из 33
- 25. НЕ ВСЕ МОЖНО РЕАЛИЗОВАТЬ ИЗ-ЗА ТЕХНИЧЕСКИХ ИЛИ РЕСУРСНЫХ ОГРАНИЧЕНИЙ 25 слайд из 33
- 26. ДАЛЕКО НЕ ВСЕ ИНСТРУМЕНТЫ И СОВЕТЫ ПОДХОДЯТ ПОД ВАШУ СПЕЦИФИКУ 26 слайд из 33
- 27. МНОГИЕ ВНЕДРЕНИЯ ПРИВОДЯТ К ЗНАЧИТЕЛЬНОМУ УСЛОЖНЕНИЮ И РАСТЯГИВАНИЮ ПО ВРЕМЕНИ 27 слайд из 33
- 28. ОДИН В ПОЛЕ НЕ ВОИН 28 слайд из 33
- 29. ТЕПЕРЬ МОЖНО И ПОРАБОТАТЬ 29 слайд из 33
- 30. СТАВИМ ЦЕЛЬ (Performance budget) 1) On mobile resolution (3G connection): ● <3 Seconds Load Time (at least for everything above the fold) ● <75 Requests per page ● 1.0 MB Transferred data ● Speed Index <5,000 in WebPagetest 2) >90 in PageSpeed Insights 3) 200-500ms Server Response Time 30 слайд из 33
- 31. GO! 1) В первую очередь нужно заморочиться на приоритетные направления 2) Настраиваем автоматические проверки 31 слайд из 33
- 32. ? 32 слайд из 33
Editor's Notes
- UX - увеличение конверсии и СЕО бонус за уменьшение коєфициента отказов
- Примеры: 1. РНР7 и экономия на серверах. 2. Изменение и оптимизация архитектуры, которая приводит к удешевлению хостинга. 3. Уменьшение трафика, за который нужно платить
- Не эффективный JS и/или верстка могут все испортить. Примеры: 1. с видеоплеером и тормозами в ИЕ 2. пример многоэтапной оптимизации опций (в DOM ходить - это дорого) 3. история одной оптимизации Сергея Чикуенка
- Важно понимать с каким протоколом работаешь, так как есть особенности. Пример: 1) Спрайты - антипаттерн в HTTP2
- Аналитики много не бывает. Используйте разные анализаторы, чтобы учесть наибольшее количество факторов.
- Пример компромисса между скоростью и сео: 1) Жесткая оптимизация картинок может привести к потере картиночного трафика. 2) Уникальные картинки и CDN, с которого легко парсить 3) Многие структурные изменения и вынос в асинхрон могут быть запрещены СЕО-шниками 4) Семантика и СЕО дружат далеко не всегда
- Пример: 1) Банально нет денег на сервера 2) Не хватает персонала для реализации всех хотелок
- Примеры: 1) PageSpeed Module https://developers.google.com/speed/pagespeed/module/ и оптимизация/генерация иконок 2) AMP https://www.ampproject.org/
- В Большом проекте Пример: 1) Переезд на HTTPS/HTTP2 растянулся на сезон. 2) Некоторые изменения требуют огромных затрат на контент менеджмент
- WebPageTest и Google Page Speed Insight имеют специальные API и даже NPM модули