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

Анализ скорости загрузки сайта – это возможность изучения одного из основных факторов ранжирования вашего веб-ресурса. Если скорость загрузки невысокая, то это будет негативно сказываться на позиции в поисковой выдаче. Ни для кого не секрет, что и в Яндекс, и в Google отдается предпочтение более быстрым веб-ресурсом.

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

Какие существуют инструменты для проверки скорости загрузки сайта?

1. Google Page Speed Insights. Позволяет не только определять оптимальную скорость загрузки сайта (десктопную и мобильную версию), но и показывает список рекомендаций по ее улучшению. В Google Page Speed Insights можно увидеть, насколько быстро страницы открываются у пользователей, при этом скорость изучается в соответствии со следующими показателями:

• Поисковая отрисовка контента (время между началом загрузки и открытием первого блока с информацией);
• Индекс скорости возникновения контента на странице;
• Отрисовка крупного контента (больших блоков информации);
• Время открытия данных для взаимодействия (когда страница открывается на 100%);
• Сумма перечисленных выше периодов;
• Совокупное смещение макетов (процент смещения видимых блоков).

2. Speedtest.me. Благодаря данному сервису, можно увидеть, сколько времени web-ресурс открывается в разных регионах.

3. Toolspingdom.com. За счет данного инструмента можно провести анализ скорости сайта и причин его медленной загрузки. Перед тем, как начать тестирование, необходимо выбрать определенный регион. В результате можно рассчитать следующие показатели:

• Page size (размер страницы);
• Load time (время загрузки);
• Requests (количество запросов);
• Faster than (доля сайтов, которые медленнее тестируемого);
• Performance grade (уровни производительности).

При этом данный сервис показывает список проблем, присваивая им рейтинг. Распределяются ссылки и размеры файлов.

4. WebPageTest. В этом случае для начала проверки необходимо выбрать как локацию, так и браузер. Затем выполняются 3 аналитики скорости: время открытия первой страницы, время открытия сайта и пр.

5. Site Speed (часть Google Analytics). Помогает оценивать производительность ресурса, учитывая скорость открытия страниц и длительность синтаксического анализа. В отчете присутствуют индивидуальные советы по оптимизации.

6. PR-SY. Подходит для проведения тщательного аудита. Показывает список ошибок, которые оказывают влияние на производительность. Предоставляет рекомендации по улучшению работы сайта.

Что влияет на скорость загрузки?

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

1. Откройте страницу Google Chrome.
2. Кликнете по кнопке F12, чтобы зайти в инструменты разработчика.
3. Откройте вкладку Networks.
4. Выключите кэш и изучите значения, которые находятся в нижнем левом углу.

Чтобы получить сведения про необходимый вес веб-ресурса, можно использовать сервис Performancebudget.io. Система проанализирует и рассчитает оптимальное время для заданного типа соединения. Будут представлены варианты распределения веса в зависимости от типов данных.

Стоит сделать акцент и на такой причине медленной работы страницы, как хостинг. Часть провайдеров размещает веб-ресурсы клиентов на виртуальном хостинге. Когда количество сайтов превышает допустимые значения, их скорость открытия уменьшается. Причина – повышенная нагрузка на сервис. По этой причине при выборе хостинга необходимо учитывать технические требования web-ресурса.

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

Вашими помощниками в данном вопросе могут быть следующие рекомендации:

• Уменьшение числа запросов. Известный факт, что на вопросы и ответы необходимо много времени. Если сократить их количество, оптимальная скорость загрузки сайта увеличится. Для этого можно загружать файлы статично (без использования запросов к базе данных), дополнительно объединить CSS и JS в отдельные файлы (с помощью плагинов Gulp, Grunt, WebPack);
• Оптимизация CSS и JavaScript. Их размер и количество можно уменьшить с помощью таких инструментов, как CSS Minifier и CSS Compressor для CSS; JS Minifier и JavaScript Compression Tool для JS. Скрипты JS рекомендовано переносить после кода перед закрывающим тегом;
• Оптимизация изображений. Ни для кого не секрет, что фотографии занимают значительную долю в размере файла. По этой причине их рекомендовано сжать в формате png, jpg, svg (используются инструменты Kraken.io и TinyPNG). Благодаря сервису iconizr для svg и css.spritegen.com для png, gif, jpeg, получится объединить иконки в спрайт. Кроме этого, в качестве общей рекомендации стоит еще раз напомнить, что не надо размещать на веб-ресурсе фотографии большего размера, чем необходимо.

Использование технологий для мгновенной загрузки контента. Если говорить про Яндекс, то речь идет про Турбо. В Google можно использовать Accelerated Mobile Pages. За счет данных технологий создаются легкие версии страниц, вес которых уменьшается в 10 раз. В результате страницы открываются быстрее (речь идет, в том числе, и про мобильные устройства).

Шпаргалка

• Помните, что анализ скорости загрузки сайта влияет на его ранжирование. Рекомендуемый период времени – около 2-х секунд. Если речь идет про сильно нагруженные приложения, то расчет времени осуществляется самостоятельно. Для этого необходимо использовать среднюю скорость открытия веб-ресурсов конкурентов. Кроме этого, скорость зависит от хостинга и веса файлов;
• Используйте инструменты вебмастера Google Chrome для оценки web-ресурса. В частности, вам поможет такой инструмент, как Performancebudget.io. Он позволяет рассчитывать максимальный вес файлов, чтобы получить необходимое время загрузки при определенном типе интернет-соединения;
• Подбирайте хостинг в соответствии с техническими требованиями вашего ресурса. Рекомендовано отказываться от виртуальных хостингов;
• Регулярно проверяйте скорость открытия страниц сайта. Для выполнения данной работы удобно использовать следующие сервисы: SpeedTest.me, ToolsPingdom.com, WebPageTes. Они позволяют рассчитывать не только непосредственную скорость, но и число запросов, уровни производительности, распределение файлов по весу и пр;
• Постоянно совершенствуйте скорость. Речь идет про сокращение количества запросов, по которым идет обращение к серверу. Для этого необходимо объединять CSS и скрипты JS в отдельный файлы с помощью инструментов CSS Minifier, CSS Compressor для CSS, и JS Minifier и JavaScript Compression Tool для JavaScript. Кроме этого, JS скрипты стоит размещать перед закрывающим тегом;
• Оптимизируйте изображения. Используйте такие сервисы, как Kraken.io и TinyPNG; создавайте из иконок спрайты, публикуйте фотографии необходимого размера;
• Настраивайте Турбо-страницы для Яндекс и AMP для Google, чтобы гарантировать сайту мгновенную загрузку.