Лучшие 15 бесплатных инструментов для тестирования скорости сайта в 2018 году

1. Что может помочь вам скоростной тест сайта?
2. Концепции скорости веб-сайта
3. Время до первого байта (TTFB)
4. Блокировка рендеринга JavaScript и CSS
5. JavaScript
6. CSS
7. HTTP-запросы
8. 1. Тест скорости сайта KeyCDN
9. 2. Google PageSpeed ​​Insights
10. 3. Тест скорости Pingdom
11. 4. GTmetrix
12. 5. WebPageTest
13. 6. Varvy Pagespeed Оптимизация
14. 7. Восходящие тенденции
15. 9. PageScoring
16. 12. Тестер времени загрузки Sucuri
17. 13. Pagelocity
18. 14. YSlow
19. Тест скорости сайта с расширениями Chrome
20. Тест скорости мобильного сайта
21. Резюме

Брайан Джексон

Обновлено 4 марта 2019 г.

Скорость сайта может быть решающим фактором для его успеха. Как обсуждалось в нашем Руководство по доставке контента Более быстрая загрузка веб-сайтов может выиграть благодаря более высокому рейтингу SEO, более высоким показателям конверсии, более низким показателям отказов, увеличению продолжительности посещения сайта, улучшению общего пользовательского опыта и вовлеченности Вот почему так важно воспользоваться многими ** бесплатными инструментами для тестирования скорости сайта , чтобы вы могли достичь оптимальной производительности .

Google хочет ваш сайт для загрузки в Меньше секунды

Что может помочь вам скоростной тест сайта?

Вот лишь некоторые из распространенных способов использования инструментов тестирования скорости сайтов:

• Определение сценариев, шрифтов и плагинов, вызывающих проблемы со временем загрузки (HTML, JavaScript, CSS)
• Проверка минимизации ваших скриптов
• Поиск больших изображений, приводящих к узким местам
• Определение, есть ли у вас блокирующий рендеринг JavaScript или CSS
• Время тестирования до первого байта (TTFB)
• Анализ общего времени загрузки, размеров страниц и количества запросов
• Проверка производительности из разных географических мест
• Проверка скорости рендеринга в разных браузерах
• Анализ заголовков HTTP
• Измерение эффективности вашей сети доставки контента
• Проверка правильности загрузки ресурсов с вашего CDN

Концепции скорости веб-сайта

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

Время до первого байта (TTFB)

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

Узнайте больше о время до первого байта и время до последнего байта.

Блокировка рендеринга JavaScript и CSS

Блокировка рендеринга относится к JavaScript и CSS, которые удерживают вашу страницу от загрузки настолько быстро, насколько это возможно.

JavaScript

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

Пример отсрочки JavaScript, поместив его прямо перед тегом </ body>.

function downloadJSAtOnload () {var element = document.createElement ("script"); element.src = "defer.js"; document.body.appendChild (элемент); } if (window.addEventListener) window.addEventListener ("загрузка", downloadJSAtOnload, false); иначе if (window.attachEvent) window.attachEvent ("onload", downloadJSAtOnload); еще window.onload = downloadJSAtOnload;

CSS

Затем вы также захотите оптимизировать доставку CSS, чтобы она не вызывала задержек при загрузке страницы. Вот несколько способов исправить это:

1. Правильно называйте свои CSS-файлы
2. Уменьшите количество CSS-файлов
3. Используйте меньше CSS в целом

Вот отличная статья о CSS для блокировки рендера Илья Григорик, инженер веб-производительности в Google.

CSS - это ресурс блокирования рендера, передавайте его клиенту как можно быстрее и максимально быстро, чтобы оптимизировать время первого рендеринга!

Минимизация ресурсов означает удаление ненужных символов из HTML, JavaScript и CSS, которые не требуются для загрузки, например:

• Пробельные символы
• Новая строка символов
• Комментарии
• Блок-разделители

Это ускоряет время загрузки, так как уменьшает количество кода, запрашиваемого с сервера. Вы можете использовать такой инструмент, как Дэн CSS и JavaScript Minify удалить все ненужные символы. Или, если вы используете WordPress, вы можете использовать плагин, как Autoptimize который минимизирует все ваши HTML, JavaScript и CSS для вас.

HTTP-запросы

Когда ваш браузер получает данные с сервера, он использует HTTP (протокол передачи гипертекста). Это запрос / ответ между клиентом и хостом. В целом, чем больше HTTP-запросов делает ваша веб-страница, тем медленнее она будет загружаться .

Есть много способов уменьшить количество запросов, таких как:

• Объединение ваших CSS и JavaScript файлов
• Вставьте свой JavaScript (только если он очень маленький)
• Использование CSS-спрайтов
• Сокращение ресурсов, таких как сторонние плагины, которые делают большое количество внешних запросов

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

Примечание. Также важно понимать, что при запуске инструментов, подобных этим, первый раз поиск DNS обычно будет медленнее . Если вы сравниваете общее время загрузки, иногда лучше запускать тесты несколько раз и получать среднее значение результатов.

1. Тест скорости сайта KeyCDN

KeyCDN построен быстро и легко инструмент тестирования скорости сайта который вы можете использовать, чтобы получить подробную информацию о том, как работает ваш сайт. Если на выбор предлагается 14 мест по всему миру, и у вас есть возможность сделать результаты своих тестов частными или общедоступными. Тест включает в себя разбивку водопада и визуальный предварительный просмотр веб-сайта внизу. Вы можете быстро увидеть, сколько было выполнено HTTP-запросов, полный размер запрашиваемой страницы и время загрузки .

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

2. Google PageSpeed ​​Insights

Google PageSpeed ​​Insights это инструмент для тестирования скорости сайта, который оценивает ваш сайт по шкале от 1 до 100. Чем выше число, тем лучше оптимизирован ваш сайт. Все, что выше 85, означает, что ваш сайт работает хорошо. PageSpeed ​​предоставляет вам отчеты как для настольной, так и для мобильной версии вашего сайта. Вы можете просмотреть рекомендации по улучшению, такие как минимизация CSS или оптимизировать ваши изображения ,

PageSpeed ​​Insights измеряет, как страница может улучшить свою производительность:

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

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

Команда PageSpeed ​​Insights также недавно запустила новый инструмент для тестирования скорости сайта: подумай с гуглом », Который вы можете проверить. Одна приятная особенность - это красивые отчеты, которые она генерирует. Может быть отлично подходит для отправки клиентам.

3. Тест скорости Pingdom

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

Анализ страницы предлагает большой обзор с дополнительной информацией, такой как анализ размера, размер на домен (вы можете легко сравнить размер активов CDN с вашим доменом ), количество запросов на домен и тип контента, который имел наибольшее количество запросов.

Инструмент тестирования скорости Pingdom также позволяет вам проверить скорость вашего сайта из четырех основных мест, включая:

• Даллас, Техас, США,
• Мельбурн, Австралия
• Сан-Хосе, Калифорния, США
• Стокгольм, Швеция

Результаты теста скорости Pingdom предоставят вам информацию о производительности, аналогичную Google PagesSpeed ​​Insights, в которой указано, где можно внести улучшения. Результаты также разбивают размер страницы по типу контента, размеру страницы по домену, запросам по типу контента и запросам по домену.

4. GTmetrix

GTmetrix идет в мельчайших подробностях, так как он проверяет как PageSpeed, так и YSlow метрики , присваивающие вашему сайту оценку от F до A. Его отчеты разделены на пять различных разделов, включая PageSpeed, YSlow, разбивку водопада, видео и историю.

С бесплатной регистрацией вы можете тестировать из семи разных мест. Они также позволяют вам выбрать браузер Chrome и Firefox. Вы можете протестировать и сравнить производительность веб-сайта с различными типами соединений (например, «Кабель против коммутируемого доступа»), чтобы увидеть, как это влияет на загрузку вашей страницы. Другие расширенные функции включают в себя воспроизведение видео, чтобы проанализировать, где происходит ваше узкое место, а также возможность запуска Adblock plus. С отключенными объявлениями вы можете увидеть, как они влияют на загрузку вашего сайта.

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

5. WebPageTest

WebPagetest очень похож на некоторые из предыдущих упомянутых инструментов, но имеет более 40 мест на выбор и более 25 браузеров (включая мобильные). Он присваивает вам оценку от F до A на основе различных тестов производительности, таких как FTTB, сжатие, кэширование, эффективное использование CDN и т. Д. Этот отчет состоит из шести разделов, которые включают сводку, подробности, анализ производительности, разбивку содержимого, и скриншоты.

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

6. Varvy Pagespeed Оптимизация

Varvy Pagespeed Оптимизация это инструмент, разработанный и поддерживаемый Патриком Секстоном, который также создал GetListed.org, который сейчас известен как Moz Local.

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

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

7. Восходящие тенденции

восходящие тренды довольно простой, но они предлагают более 35 мест на выбор при проведении теста скорости. Их отчет разбит на два раздела: водопад и доменные группы. Группы доменов предлагают уникальную перспективу, поскольку они классифицируют ресурсы на разные источники : сторонние, статистические данные, CDN, социальные сети, рекламные объявления, общая информация о первой стороне и общая информация о третьей стороне.

Дот-монитор предлагает 23 различных местоположения и семь различных браузеров, в которых вы можете запустить тест скорости вашего сайта. Их уникальная особенность заключается в том, что вы можете запускать все географические тесты одновременно . Это может сэкономить вам много времени, так как любой другой инструмент вы должны запускать их индивидуально для каждого места. Затем вы можете нажать на каждый отдельный отчет и / или разбивку водопада.

Их отчеты разделены на пять различных разделов, которые включают в себя сводку, производительность, диаграмму водопада (разбивка), хост и ошибки.

9. PageScoring

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

• Поиск доменов
• Время соединения
• Время перенаправления
• Размер страницы
• Время загрузки

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

Желтые лабораторные инструменты это новый веб -инструмент для тестирования производительности и внешнего интерфейса, разработанный Гаэль Метай , Этот инструмент предоставляет вам много информации и некоторые уникальные функции, которых нет в других инструментах, такие как представление о взаимодействии JavaScript с DOM во время загрузки страницы и другие проблемы с проверкой кода. Получить глобальную оценку на основе следующих квалификаторов.

• Вес страницы
• Запросы
• DOM
• Плохой JavaScript
• Плохой CSS
• Конфигурация сервера

Временная шкала JavaScript показывает, как именно DOM взаимодействует во время загрузки страницы.

И конечно мы не можем забыть Google Chrome DevTools , Это очень простой в использовании инструмент (с расширенными функциями), и вы можете быстро запустить его в любое время в браузере Chrome, используя следующие сочетания клавиш.

• Windows: F12 или также Ctrl + Shift + I
• Mac: Cmd + Opt + I

С последним Обновление инструментов разработчика , они добавили панель с агрегированными данными в график времени водопада. Это позволяет вам легче увидеть, что стоит вам больше всего времени, а затем разбить его по доменам, поддоменам и т. Д. Для запуска этого щелкните панель «Временная шкала» и нажмите Ctrl + R (Cmd + R). ) обновить страницу. Затем вы можете щелкнуть на панели «Сводка» и «Сводная информация».

У нас также есть отличный пост что блокирует DOM и как это исправить. В инструментах разработчика вы можете точно увидеть время DOMContentLoaded и общее время загрузки. Для запуска этого нажмите на панель «Сеть», нажмите «Показать обзор» и нажмите Ctrl + R (Cmd + R), чтобы обновить страницу. Синяя линия будет отображаться для DOMContentLoaded и красная линия для общего времени загрузки. Обычно все, что остается от синей линии или касается нее, является активами, которые блокируют DOM или также называются ресурсами блокирования рендеринга.

12. Тестер времени загрузки Sucuri

Sucuri Load Time Tester обеспечивает быстрый и простой способ проверить производительность ваших сайтов со всего мира. Это даст вам глобальную оценку производительности, от A до F. Тест измеряет, сколько времени требуется для подключения к вашему сайту и полной загрузки одной страницы. Очень важным значением, на которое следует обратить внимание, является «время до первого байта» , которое показывает, сколько времени потребовалось для отправки контента обратно в браузер, чтобы начать обработку страницы.

13. Pagelocity

Инструмент Pagelocity предлагает другой уникальный подход, когда дело доходит до теста скорости сайта. Он дает вам общий балл из 100, состоящий из таких факторов, как социальные сети, SEO, ресурсы и код. Инструмент также предлагает возможность отслеживать ваших конкурентов. Вы можете подписаться на бесплатную учетную запись, чтобы воспользоваться дополнительными функциями. Представление кода особенно уникально, поскольку оно показывает, работает ли ваш сайт по протоколу HTTPS, каков ваш TTFB, и графический интерфейс элементов DOM с гистограммой.

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

14. YSlow

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

1. YSlow сканирует DOM, чтобы найти все компоненты (изображения, сценарии и т. Д.).
2. YSlow получает информацию о размере каждого компонента (Gzip, заголовки expire и т. Д.)
3. YSlow берет данные и генерирует оценку для каждого правила, которая, в свою очередь, дает вам общую оценку.

У YSlow есть 23 различных правила, с которыми он работает для вашего сайта, например, использование CDN и сокращение поиска DNS. GTmetrix предлагает инструмент онлайн-анализа, чтобы проверить ваш счет YSlow. Обязательно ознакомьтесь с нашим подробным руководством по как улучшить свой счет YSlow ,

PerfTool это проект инструмента производительности на стороне клиента с открытым исходным кодом, размещенный на GitHub. Он собирает различную информацию о вашем веб-сайте и отображает ее в удобной форме на странице отчетов. Он объединяет три источника данных в одном: PageSpeed ​​Insights, devperf и W3CJS. В общей сложности это дает вам более 200 различных показателей эффективности.

Одним из больших преимуществ PerfTool является то, что вы можете запускать тесты на нескольких страницах одновременно для отчета Google PageSpeed ​​Insights. Затем сравните результаты эффективности веб-сайта с предыдущих тестов, установите порог оценки и получите подробный отчет о ваших тестах. Это на самом деле может сэкономить вам много времени, если вы тестируете производительность всего сайта, так как вам не нужно тестировать свои страницы одну за другой.

Тест скорости сайта с расширениями Chrome

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

Тест скорости мобильного сайта

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

• WebPagetest
• GTmetrix
• Дот-монитор

Другой способ симуляции теста скорости на мобильном устройстве - использовать Инструменты разработчика Chrome в режиме устройства . Чтобы войти в режим устройства, нажмите на маленький значок телефона в Chrome DevTools или нажмите Ctrl + Shift + M (Cmd + Shift + M). Затем вы можете выбрать, какое устройство вы хотите эмулировать, ориентацию и даже разрешение. Вы также можете изменить регулировку сети, чтобы увидеть, как ваш сайт будет отображаться при обычном соединении 2G или 4G.

Затем вы можете использовать вкладку «Сеть» и разбивку водопада для запуска скоростных тестов.

Резюме

Как вы можете видеть, есть несколько инструментов для тестирования скорости сайта, которые вы можете выбрать. Каждый из них имеет свои уникальные особенности, как указано выше. Рекомендуется регулярно тестировать свой сайт и устанавливать эталонный тест, чтобы со временем вы могли вносить улучшения.

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

• Сжатие ваших изображений и файлов
• Выбор быстрого веб-хостинга
• Оптимизация вашего кода и скриптов
• Используя Сеть доставки контента
• Кэширование
• Сокращение количества HTTP-запросов

Похожие

Комментарии