Как мы сокращаем время загрузки страницы на 10 секунд

Когда дело доходит до хорошего веб-сайта, скорость и социальная связь просто несовместимы. Мы перенесли наш сайт на Маховик (партнерская ссылка), и это значительно улучшило производительность и стабильность нашего сайта. Но дизайн нашего сайта - с толстым нижним колонтитулом, который продвигал нашу социальную активность на Facebook, Twitter, Youtube и в наших подкастах - замедлил работу нашего сайта до скорости сканирования.

Это было плохо. В то время как отличная страница загружается за 2 секунды или меньше, нашему сайту требовалось более 10 секунд для завершения страницы. Проблема не в WordPress или Flywheel, проблема во всех интерактивных элементах, которые мы загружали из других сервисов ... виджеты Facebook и Twitter, изображения предварительного просмотра Youtube, наше приложение Podcast, я просто не мог контролировать, насколько медленно они загружаются. До нынешнего момента.

Теперь вы заметите, что наши страницы загружаются примерно за 2 секунды. Как мы это сделали? Мы добавили динамический раздел в нижний колонтитул, который загружается только тогда, когда пользователь прокручивает страницу до этой точки. Прокрутите страницу до конца в браузере (не в мобильном устройстве, приложении или планшете), и вы увидите, что изображение загружается:

загрузка

Используя jQuery, мы фактически не загружаем основную часть страницы, пока кто-то не прокрутит ее. Код на самом деле довольно прост:

$ (window) .scroll (function () {if (jQuery (document) .height () == jQuery (window) .scrollTop () + jQuery (window) .height ()) {if ($ ("# placetoload" ) .text (). length <200) {$ ("# дополнительный"). load ('[полный путь к загружаемой странице]');}}});

Когда пользователь переходит к основанию страницы, jQuery go извлекает содержимое страницы по указанному пути и загружает его в выбранный вами div.

Хотя сайт больше не получает выгоду от загруженного на него контента (потому что поисковая система не сканирует его), мы вполне уверены, что скорость страницы поможет нашему ранжированию, обмену и вовлечению в гораздо большей степени, чем если бы кто-то нетерпеливо ждать, пока наша страница загрузится мучительно медленно. Лучше всего то, что на странице все еще есть все элементы, которыми мы хотим взаимодействовать с нашими посетителями ... без ущерба для скорости страницы.

У нас еще есть над чем поработать ... но мы приближаемся!

Как вы думаете?

Этот сайт использует Akismet для уменьшения количества спама. Узнайте, как обрабатываются ваши данные комментариев.