Как проверить скорость загрузки сайта?

Google Analytics

Корпорация Google предоставляет расширенное средство для проверки и увеличения отклика на веб-запросы любого ресурса. Для новичка работа с сервисом Google Analytics может показаться слегка трудной, но достаточно прочитать пару кратких справочных материалов и несколько раз использовать инструмент и комфортная работа с ним обеспечена. Данный сервис позволяет следить за следующими показателями:

1. Скорость загрузки ресурса, вычисляемая для определенной выборки просмотров страниц. С помощью данной выборки можно проанализировать, как изменяется скорость загрузки веб-страниц в зависимости от местоположения пользователей, операционной системы, браузера, разрешения дисплея и целого ряда иных параметров.
2. Быстрота выполнения/загрузки для единичного запроса или действия. Например, можно определить скорость загрузки графического элемента (изображения, GIF-файла и т.п.) или время отклика на нажатие кнопки.
3. Эффективность обработки документа на сайте и скорость предоставления этого файла пользователю.

Какие же действия необходимо выполнить для использования функционала Google Analytics?

1. Необходимо завести аккаунт Google и авторизоваться в системе.
2. Создать учетную запись для сайта, если ее нет.
3. Выбрать соответствующее представление.

Интерфейс Google Analytics

1. Во вкладке “Отчеты” кликнуть по пункту “Поведение”.

Вкладка “Отчеты”, пункт “Поведение” в Google Analytics

В подменю “Время загрузки страниц” получаем все необходимые сведения с возможностью указания дополнительных параметров, установки фильтров и сортировки результатов по массе критериев.

Подпункт “Время загрузки страниц в Google” Analytics

В этом пункте приведена информация, которая поможет оптимизировать работу ресурса, зачастую не требуя от пользователя особых навыков или знаний. Этого можно добиться, если потратить немного времени и установить, при каких условиях (браузер, страна, используемая ОС, глубина просмотра и т. д.) скорость выше, а при каких – ниже.

Дополнительные параметры подпункта “Время загрузки страниц”

Вкладкой ниже в подпункте “Ускорение загрузки” приведен перечень страниц с предложениями по оптимизации данных страниц посредством сервиса PageSpeed Insights. Также в предлагаемой таблице есть показатель “Уровень скорости загрузки страниц”, который показывает, насколько можно повысить скорость загрузки той или иной страницы. Чем меньше этот показатель, тем больших результатов в повышении скорости загрузки страницы можно добиться.

Подпункт “Ускорение загрузки” в Google Analytics

Для новичков в Google Analytics присутствует подробное руководство по работе с ресурсом с удобным и функциональным поиском по ключевым словам.

Поиск по ключевым словам в Google Analytics

Обновление алгоритмов Google PageSpeed Insights

В июле Гугл запустил новый алгоритм — Speed Update, благодаря чему скорость загрузки стала фактором ранжирования поисковика. Ноябрьские обновления PSI (PageSpeed Insights) кардинально изменили сервис. Теперь он работает на базе аналитики Lighthouse, встроенного в браузер Google Chrome. Это инструмент с открытым исходным кодом, созданный для улучшения и контроля качества веб-страниц.

Если раньше PSI оценивал ресурс по соблюдению определенных условий и выполнению задач, то теперь для получения высокого балла принимается во внимание только скорость

Важно, за какое время на странице появляется первый контент и его основная часть, сколько секунд нужно для полноценного взаимодействия пользователя с ресурсом, общий индекс скорости и другие характеристики

В PageSpeed Insights добавлена функция раскадровки, состоящая из десяти слайдов, на которых вы можете увидеть очередность появления контента страницы. Кроме того, теперь сервис дает советы по использованию на ресурсе новых форматов картинок, — JPEG 2000, WebP и JPEG XR — которые весят меньше своих предшественников.

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

Скорость загрузки и AdWords

Среди современных решений большим спросом пользуется сервис контекстной рекламы AdWorbs, который предоставляет удобный интерфейс и дополнительные инструменты создания рекламных объявлений.
С некоторых пор сервис также учитывает время загрузки, так что протестировать скорость соединения сайта следует до начала работы.
Разработчики используют специальную метрику, которая присваивается ключевым словам и сказывается на показателях качества. Например, ключевые слова, которые относятся к объявлениям с целевыми страницами на одном домене, будут оцениваться одинаково.
Для расчета времени используются средние значения между целевыми страницами домена, после чего они сравниваются с показателями других сайтов.
Для достижения большей точности скорости тест проводится несколько раз, а средняя величина просчитывается без учета худшего показателя. Сейчас оценивается только загрузка html-кода, но в будущем планируется внедрение более строгого контроля.

Сервисы для измерения скорости загрузки сайта

Дальше — подборка сервисов, которые проверят скорость сайта и дадут рекомендации, что улучшить. Всю подборку можно тестировать бесплатно, регистрация не понадобится.

Lighthouse

Lighthouse запускается прямо из панели разработчика в некоторых браузерах

Инструмент от Chrome, который проверяет скорость загрузки сайта на базе показателей Core Web Vitals. Lighthouse запускается из панели разработчика во всех браузерах на базе движка Chromium — Chrome, Opera, Edge и «Яндекс.Браузер». Вам нужно открыть страницу для проверки, открыть панель инструментов разработчика и перейти на вкладку Lighthouse, она может быть либо отдельным пунктом, либо на вкладке Audits.

Перед проверкой лучше почистить кеш и открывать в приватном режиме, иначе результат может получиться смазанным. Инструмент пока только на английском.

Google PageSpeed Insights

PageSpeed Insights — онлайн-версия инструмента LightHouse

Бесплатный инструмент от Google на базе того же Lighthouse. Отличие лишь в формате — PageSpeed Insights запускается на отдельной странице, а не через панель инструментов разработчика. Проверяет параметры из Core Web Vitals и дает рекомендации по исправлению. Результат можно посмотреть отдельно для десктопной и мобильной версии страницы.

PR-CY

Российский сервис по проверке скорости загрузки сайтов

Сервис от российских разработчиков. Скорее всего, тоже основывается на Lighthouse. Можно выбрать для теста скорости мобильную или десктопную версию сайта, выдает показатели и рекомендации на русском. На платном тарифе можно настроить автоматические проверки несколько раз в день.

Pingdom Tools

Результаты теста скорости сайта от Pingdom

Это англоязычный сервис, русского интерфейса нет. Сервера, с которых идет проверка скорости, расположены в Азии, Европе, Америке и Австралии, русских и украинских нет.

Выдает довольно подробный отчет: есть общая оценка, баллы по важным критериям, коды ответа, вес контента на странице и количество html-запросов по видам контента и доменам. Есть диаграмма-водопад по времени загрузки разных элементов. Можно проверять скорость загрузки сайта бесплатно и без регистрации, за деньги — настроить автоматическую проверку, которая будет идти практически в режиме реального времени.

GTmetrix.com

Отчет по скорости загрузки сайта от GTmetrix

Анализирует сайты с помощью Lighthouse, выдает большой отчет из нескольких частей. Показывает, что сколько занимает в весе страницы, строит водопадную диаграмму по времени загрузки всех элементов.

Можно проверять скорость сайта бесплатно и не регистрируясь, но будет ограничение: нельзя будет изменить сервер проверки, браузер проверки и скорость интернета.

Uptrends.com

Тест скорости сайта с помощью Uptrends

Приятный интерфейс, анализ скорости ведется с помощью Lighthouse. Российских и украинских серверов для проверки нет, есть Азия, Европа, Америка и Австралия.

На бесплатной версии довольно гибко настраивается проверка: можно выбрать тест для мобильной или десктоп-версии, указать браузер, разрешение экрана и примерную скорость соединения. В результатах выдает водопадные таблицы и графики: показывает, сколько весят разные элементы и в каком порядке загружаются.

Web Page Test

Тройная проверка скорости сайта от Web Page Test

По функционалу напоминает предыдущий сервис: можно настроить тестирование по локации, устройству, браузеру и скорости. Немного неуклюжий интерфейс и минимум данных в отчете — водопадная диаграмма по времени загрузки, а также диаграммы по объему обращений на сервер разных элементов и их весу на странице. Из отличий от других сервисов: прогоняет тест сразу трижды, так что можно оценить не только общие показатели, но и эффективность кеширования.

Dotcom-Monitor

Тест скорости сайта из трех локаций от Dotcom-Vonitor

Отличается от коллег возможностью выбрать одновременно несколько локаций, откуда будет идти тест. Для настроек теста также выбирается десктоп или мобайл, нужная операционная система, разрешение и ориентация экрана, а также скорость интернета (2G, 3G, 4G). Отчет выстроен на данных Lighthouse.

Скорость загрузки и конверсия

Скорость загрузки сайта напрямую влияет на показатель конверсии. Например, у мобильных сайтов со временем загрузки до 2 секунд конверсия на 15% выше, чем у среднего мобильного сайта. При этом средний мобильный сайт загружается за 15,3 секунды.

Google и Deloitte провели исследование, в котором увеличили скорость загрузки мобильных сайтов в разных сферах на 0,1 секунды. На скриншоте ниже показано, как изменилась при этом конверсия на разных стадиях воронки продаж в сфере розничной торговли. Количество оплаченных заказов при этом суммарно увеличилось на 5,2%.

Исследование показало, как меняется конверсия на разных этапах воронки продаж за счет увеличения скорости загрузки сайта

Вот пара реальных кейсов, где увеличение скорости сайта принесло реальный доход в деньгах:

• Оператор мобильной связи Vodafone улучшил свои Web Vitals на треть, и это привело к росту продаж на 8%.
• Мебельная компания Hoff ускорила мобильную версию сайта на 60%, и конверсия в покупку в мобайле выросла на 15%.

Wrapping Up

Google PageSpeed Insights has evolved quickly. It gained undeniable importance thanks to the Core Web Vitals, which will make a difference in your organic performance very soon.

Google’s tool is reliable, and now you know how to look critically at the performance score and each metric — without forgetting the loading time!

Learning something more about testing web performance helps you understand what the priorities are and what your approach should be. Good luck with the new ranking factor rolling out!

Remember that you can save yourself time and let WP Rocket do the job for you. WP Rocket will automatically apply 80% of web performance best practices. You don’t even have to touch any settings. You’ll see an improvement in speed and your PageSpeed Insights score right away — no technical knowledge required, we promise!

How to Improve a Low Mobile PageSpeed Score

Do you have a low-performance score from mobile? Image optimization could probably be the key to solve your issues.

You’ll solve a bad mobile performance following two overlooked best practices: resizing and serving correct images for mobile devices and optimizing images’ sizes (not just dimensions!).

Here are a couple of practical examples:

Let’s say that you have a slider containing a big and large image — around 2000 pixels. The image would be fine from the desktop, where the average width resolution is 1900 or 1400 pixels. On the other hand, the maximum width on mobile is 700 pixels.The image’s dimensions will have a substantial negative impact on mobile. And it will add up to the issue about the 3G connection.

That’s why you should always load the correct size depending on the device and then serve scalable resized images on mobile.

The size of image files can also cause lower mobile performance. If you optimize an image from 1 MB to 500 KB, your page will be faster. The lower your page size is, the faster the page will load. It’s especially true when you have a slower connection.That’s why image optimization will always have a more significant impact on your mobile score than on the desktop one. The worse your connection is, the more critical image optimization is.

Does It Matter to Get a 100/100 Google PageSpeed Score on Mobile?

We’ll be as honest as possible. It’s almost impossible to get a 100 score mobile for the reasons explained above. It’s easier to get such a score on a desktop.

The truth is, there is no difference between the 95 and 100 — both for mobile and desktop. As for the Web Core Vitals performance, your goal should be to get a green score. And the green score starts from 90 — it will be enough.

Don’t stress out! Google is not going to penalize you because you have a 97 score instead of 100. The user experience will be the same — and it’s everything that matters. But… if you still want to score 100% on Google’s Page Speed test, check out our case study and learn the best speed tips!

WebPagetest

Данный онлайн-инструмент позволяет проводить простые и расширенные тесты с указанием массы параметров:

• мобильная или настольная платформа;
• версия операционной системы;
• используемый браузер;
• место нахождения сервера;
• количество тестов;
• выбор ширины интернет-канала;
• отключение загрузки видео, скриптов и прочего содержимого, и многое другое.

Что же необходимо, чтобы проверить скорость ответа сайта?

1. Вставляем адрес ресурса в текстовую форму, указываем скорость соединения (мобильный интернет, 3G, высокоскоростное подключение) и жмем “Start test”.

Интерфейс онлайн-инструмента WebPagetest

После выполнения двух тестов отобразятся их результаты в виде скриншотов, а в это время будет проводиться третий, что предоставит более правдивую информацию по сравнению с единоразовой проверкой.

Результаты проверки сайта с помощью WebPagetest

В таблице приведена информация о времени загрузки контента по его типу (графические элементы, скрипты, мультимедиа), позволяя быстро понять, что именно замедляет страничку.

Слишком большие изображения

«Весомые» картинки — одна из основных причин долгой загрузки ресурса. Изображения, размер которых превышает несколько мегабайт, значительно увеличивают скорость открытия страниц сайта. Пользователи заметят проблемы даже при наличии быстрого интернета.

Автоматически открывающиеся элементы мультимедиа

Аудио- или видеофайлы, запускающиеся при открытии страниц, не только замедляют работу ресурса, но и могут отпугнуть пользователей. Если это будут рекламные материалы, посетители с очень высокой вероятностью покинут сайт.

Проверка скорости сайта поможет выявить имеющиеся проблемы.

Ненужные плагины

Большое количество лишних плагинов, установленных «на всякий случай», также серьезно уменьшает скорость выполнения скриптов и загрузки страниц. Даже деактивированные дополнения оказывают негативное влияние на функции ресурса.

Ошибки оптимизации кода

Отсутствие оптимизации приводит к увеличению размеров файлов. Это значительно снижает скорость загрузки страниц, тест позволяет выявить проблемные материалы.

К самым распространенным ошибкам относятся:

• лишние пробелы;
• некорректные скрипты;
• слишком длинные ссылки;
• присутствие большого количество css-файлов;
• и т. д.

Кроме вышеперечисленных факторов, иногда на сайт влияют характеристики хостинга. Большая нагрузка, DDos-атаки и сбои в работе могут привести к падению скорости загрузки. Эти проблемы не относятся к оптимизации ресурса.

3 шага до получения конкурентного преимущества

бесплатная
регистрация

полный
анализ сайта

рекомендации
по устранению ошибок

Что показывает сервис проверки скорости интернета

Проверка скорости интернета PR-CY показывает, какой объем информации загружается и выгружается с компьютера за определенный промежуток времени. Скорость обозначается в МБ/с, если провайдером заявлена скорость 100 МБ/с, в домашних условиях добиться таких показателей не получится.

При проверке скорости интернета показываются следующие данные:

• Входящая скорость. Данные показывают, с какой скоростью файлы из интернета загружаются на ваш компьютер;
• Исходящая скорость. Демонстрирует, на какой скорости пакет данных определенного объема будет выгружен в сеть;
• Пинг. Время, требуемое для соединения с сервером.

На окончательные результаты теста влияют следующие факторы:

• Как далеко компьютер или смартфон физически находятся от сервера провайдера;
• Нагрузка на сервер в момент проведения теста;
• Используемое оборудование для выхода в сеть;
• Особенности настройки роутера и пр.

Какие фреймворки самые быстрые

JavaScript Framework помогает в расстановке приоритетов — что и когда загружать на странице. Почти 76% всех сайтов используют эти платформы для создания эффективных, безопасных и стандартизированных страниц, так что исследователи решили найти самый быстрый фреймворк.

Сначала они изучили, как часто программисты использовали платформы из выборки:

Самым популярным по использованию JS-фреймворком оказался React — его используют 25,3% сайтов. Еще популярны TweenMax (10,3%) и RequireJS (9,5%).

Затем исследователи хотели выяснить, какие фреймворки JavaScript связаны с показателем FCP (First Contentful Paint) — временем, когда пользователь начинает видеть отрисованный полезный контент на странице. Результаты разделили по размеру страниц: маленькие (<1,264,374 байт), средние (1,264,374 и 4,019,332 байт) и большие (> 4,019,332 байт).

Для небольших страниц RightJS вышел на первое место:

Для средних по размеру страниц лучшие результаты показали Wink и Gatsby:

Самое быстрое время FCP на больших страницах было у страниц с Gatsby и Riot:

Выбор фреймворка JavaScript может значительно повлиять на время загрузки FCP. Для страниц среднего размера JS-фреймворк Wink, который оказался лучшим, загружается на 213% быстрее, чем самый медленный фреймворк Meteor.

Возможно, некоторые JS-фреймворки больше подходят страницам определенного размера и лучше на них работают. Например, Riot попал на второе место для больших страниц, но на 15 место для маленьких.

Скорее всего не существует «лучшего» JavaScript-фреймворка для любой страницы. Для сайтов с небольшими страницами RightJS показал себя лучшим, для сайтов с большими страницами подойдет Gatsby.

Чем быстрей загружается сайт, тем лучше конверсия

Чтобы убедиться в этом, изучите следующие результаты исследований:

• Исследование Aberdeen Group показало, что в результате задержки в 1 секунду уменьшается количество просмотров (на 11%), процент удовлетворенности аудитории (на 16%), а также коэффициент конверсии (на 7%).
• Компания Shopzilla увеличила скорость сайта на 5 секунд и тем самым повысила конверсию на 12%
• Сократив время загрузки своих посадочных страниц, компании Mozilla удалось увеличить количество загрузок на 15,4%, что привело к 60 млн дополнительных загрузок.
• 85% мобильных юзеров ожидают, что сайты будут грузиться так же быстро, как и на компьютере. Не получая такого же результата, они покидают сайт.

Скорость движения

Скорость является важнейшим фактором, влияющим на безопасность на дороге. Всегда адаптируйте свою скорость к условиям
движения.

Как правильно выбрать скорость движения

Вы должны полностью контролировать автомобиль
У вас должна быть возможность остановиться перед внезапно возникшим препятствием
Учитывайте скорость движения других участников
Учитывайте состояние транспортного средства и груза
Принимайте во внимание погодные и дорожные условия

Вы не имеете права без причины прибегать к торможению или двигаться чрезмерно медленно. Наиболее безопасная скорость та,
с которой движется основной поток автомобилей. Выделяясь из основного потока вы всегда создаете потенциально опасную ситуацию.

Ограничение максимальной скорости

Следуйте указаниям дорожных знаков. Если знаки отсутствуют, и вы не можете точно определить действующее ограничение
максимальной скорости, то берите за основу:

• 50 км/час, если вы движетесь в населенном пункте
• 70 км/час, при движении вне населенных пунктов

Важное замечание об ограничении скорости

Обозначенная на знаках скорость, к примеру 70 км/час, не означает, что вы должны ехать ровно 70 км/час. Знаки указывают
на ограничение максимальной скорости

Точно так же, как, наливая воду в стакан, вы не ставите себе цели налить его точно до краев, а если на лифте указано
«грузоподъемность 500 кг» это вовсе не означает, что каждый раз в него следует загружать ровно 500 кг груза.

Очень часто неопытные водители стремятся ехать на пределе допустимой скорости, хотя в этом нет никакого смысла,
поскольку экономия времени от такого движения чаще всего ничтожно мала и не оправдывает увеличение опасности.

Ограничение скорости для грузовых автомобилей

Тяжелые грузовые автомобили (полной массой свыше 3,5 тонн) могут двигаться по скоростным шоссе с максимальной
скоростью 90 км/час. На остальных дорогах их скорость движения ограничена 80 км/час.

Утрата ощущения скорости (fartblindhet)

При съезде со скоростного шоссе на полосу торможения или другую дорогу с меньшей скоростью движения зачастую у водителя
возникает эффект утраты ощущения скорости. Автомобиль все еще движется достаточно быстро, но кажется, что его скорость
очень низкая. Неопытные водители, не готовые к такой ситуации, могут потерять контроль над автомобилем и, например, не вписаться
в поворот.

Эффект утраты ощущения скорости тем сильнее, чем дольше вы двигались перед этим с большой постоянной скоростью. Обычно
эффект длится недолго — несколько секунд, после чего восстанавливается нормальное ощущение скорости движения.

Учебник ПДД | Содержание

Консоль разработчика Google Chrome

Проверить скорость загрузки сайта можно также при помощи браузера Google Chrome и консоли отладчика. Для того чтобы выполнить проверку, зайдите на интересующий вас сайт и нажмите клавишу F12. После этого откроется окно разработчика – перейдите на вкладку “Network” и обновите страницу с помощью нажатия клавиши F5. По мере загрузки страницы можно будет увидеть перечень прогружаемых файлов (изображений, скриптов и т.п.), а также количество времени, которое потребовалось на загрузку того или иного элемента.

Анализ скорости сайта с помощью консоли разработчика Google Chrome

С помощью таких нехитрых манипуляций можно определить как время загрузки страницы в целом, так и узнать, сколько времени отнимает загрузка тех или иных файлов и произвести работы по их оптимизации.

Сайты на каких CMS грузятся быстрее

Исследователи определили движки, которые использовали сайты в выборке, затем сравнили производительность TTFB для каждой обнаруженной CMS.

Weebly и Squarespace выходят на первое место для десктопов.

Что касается скорости загрузки страниц на мобильных устройствах, Squarespace занимает первое место, Adobe Experience Manager и Weebly завершают топ-3. Выходит, топ-3 из анализа десктопа и мобильной выдачи одинаков, разные только лидеры.

По статистике 30% всех сайтов созданы на WordPress. Интересно, что в этом исследовании скорости загрузки WordPress занимает только 14 место по мобильной выдаче. Wix — тоже одна из самых популярных CMS и тоже занимает далеко не первые места в таблице по скорости загрузки на мобильном и десктопе.

Возможно, из-за популярности и простоты использования этих CMS получилось, что на них функционируют много сайтов, и многие из них — медленные. А возможно, что эти движки имеют мало встроенных инструментов для сжатия и ускорения загрузки. В любом случае это не значит, что CMS плохие — у них есть масса других преимуществ.

Данные справедливы для англоязычной выдачи, возможно, в рунете перекос был бы к другим более распространенным CMS.

По данным исследования, самые быстрые страницы из десктопной и мобильной выдачи были на Weebly, Squarespace и Adobe Experience Manager.

Итак, с высокой скоростью загрузки TTFB коррелировало использование CDN на десктопе и количество запросов HTML на мобильных устройствах. Высокую скорость загрузки показывали страницы с наибольшим и наименьшим уровнем сжатия файлов перед отправкой с сервера. Сжатие gzip — самое эффективное для обоих видов выдачи. В оптимизации картинок лучший результат дали адаптивные изображения. Использование формата WebP для ускорения загрузки картинок работает хуже.

Эти и другие выводы в оригинале исследования Backlinko

Is Google PageSpeed Insights Reliable & Accurate?

Yes, Google PageSpeed Insights is now pretty reliable and accurate when measuring the full user experience on your site. Thanks to the different metrics included, it gives you an accurate overview of how users interact with your site.

The tool became more and more reliable thanks to the latest changes.

In November 2018, Google released PageSpeed 5.0. The new version started to use the Chrome User Experience Report dataset (CrUX) mentioned above. It also started to use Lighthouse audits.

Then, in May 2020, Lighthouse 6.0 arrived. New metrics have been added — the same ones that you now see in the PageSpeed Insights tool and capture the overall performance and user experience.

That’s why you can rely on the PageSpeed score and its metrics to understand how your site performs. And, of course, you should follow the PageSpeed Insights recommendations to improve your score.

Since the Google PageSpeed score is now more accurate, an improvement in the grade would usually reflect an improvement in the loading time.

Wait… does it mean that the PageSpeed score doesn’t reflect how fast a website is? The honest answer is: it depends.

Выводы и рекомендации

Сервис выдаёт довольно точные показатели производительности и кучу рекомендаций различной степени сложности воплощения. Не все из них полезны, встречаются и вредные, противоречивые в отдельно взятой ситуации. Поэтому детально и эффективно работать с инструментом могут лишь действительно опытные веб-мастера, понимающие суть происходящего.

Имитация загрузки страниц в PSI происходит с помощью Lighthouse – опенсорсного программного комплекса для оценки качества сайтов. Всё вышеописанное бесплатно.

Узнав оценку своего сайта, не спешите расстраиваться, если она окажется недостаточно высокой. При выдаче попугаев сервис учитывает результаты сотен тысяч других сайтов, их сравнительная средняя производительность влияет на балл вашего. Расслабьтесь, выдохните и выполните неспеша, качественно наиболее очевидные, важные рекомендации PSI. Этого окажется достаточно в большинстве случаев для поднятия скорости до комфортного уровня. Для всех — и людей, и поисковых систем.