Чем проверить скорость загрузки сайта — 8 лучших инструментов

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

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

Короткий перечень сервисов без подробностей:

Дальше — разбираем особенности каждого из этих инструментов.

1. Google PageSpeed Insights

Google PageSpeed Insights — официальный инструмент от Гугл для проверки скорости загрузки сайта. Один из самых используемых среди веб-мастеров и SEO-оптимизаторов.

В 2018 году этот сервис глобально обновился. Новый интерфейс выглядит так:

Возможности и функции сервиса также изменились.

• Повысились планки метрик: быстрой веб-площадкой теперь может считаться та, которая получает показатель от 90 до 100 баллов. Раньше для максимальной оценки достаточно было 80.
  Итоговое количество баллов складывается из оценок скорости работы веб-портала. Скорость здесь — свойство многослойное, и потому она анализируется по нескольким временным характеристикам.
• Появился отчет «Данные наблюдений»: он будет доступен, если по сайту достаточно статистических данных. Похожий отчет в этом сервисе был и раньше, от него осталась одна из характеристик по источнику — «Первая отрисовка контента», которая оценивает время до того момента, когда на экране пользователя появляется контент страницы. Новая метрика здесь — «Первая задержка ввода»: она отображает время между первым взаимодействием пользователя с веб-ресурсом и ответом страницы на это действие.
• Новый раздел «Имитация загрузки страницы»: сервис имитирует загрузку страницы в условиях 3G и оценивает ряд параметров. Эти параметры принципиально меняют оценку сайта:
  • время загрузки первого контента — когда браузер начал отображать первый элемент на странице;
  • индекс скорости загрузки — время, по истечении которого весь контент страницы становится доступен для просмотра;
  • время загрузки для взаимодействия — за какое время страница полностью прогружается для взаимодействия пользователя;
  • время загрузки достаточной части контента — когда становится виден основное содержимое сайта;
  • время окончания работы ЦП (центрального процессора) — показатель серверных настроек: время, за которое основной поток страницы разгружен, чтобы обрабатывать пользовательские команды ручного ввода;
  • максимальная потенциальная задержка FID — период в миллисекундах, который занимает ответ страницы на действия пользователя.
• Разделы «Оптимизация» и «Диагностика»: перечень работ, которые сервис предлагает провести на сайте, чтобы улучшить показатели.

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

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

Поэтому мы поставили Google PageSpeed Insights в самый топ перечня. Но если этот инструмент вам не подходит или нужна альтернативная точка зрения, всегда можно обратиться к другим полезным сервисам, которые могут проверить скорость работы сайта.

2. Pingdom Tools

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

Сервис оценивает скорость загрузки в миллисекундах и дает общие рекомендации.

С помощью Pingdom можно анализировать время работы веб-ресурса, производительность и взаимодействие с пользователями.

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

Проверять ресурс можно, имитируя обращения к серверу из разных стран (Япония, Германия, Великобритания, США, Австралия и Бразилия).

3. Gtmetrix.com

Простой и удобный сервис, помогающий проверить скорость загрузки сайта в секундах.

Тестовый запрос производится из канадского Ванкувера.

Фишки сервиса: хранит историю (можно сравнить, что стало лучше или хуже) и включает в себя анализ Google PageSpeed Insights и YSlow. Предлагает соответствующие рекомендации по разным типам ошибок (редиректы, оптимизация изображений, использование JavaScript и HTML и другие).

Есть платная версия с бо́льшим количеством функций и расширений.

4. Uptrends.com

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

Так же, как и Gtmetrix, показывает в том числе оценку от Google PageSpeed Insights:

Анализирует содержимое веб-ресурса и отображает сведения в виде графиков и таблиц:

5. PR-CY

Комплексный русскоязычный сервис для анализа сайта. В числе бесплатных функций есть и измерение скорости:

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

В платных версиях в инструменте можно задавать до 60 адресов для сравнительного анализа и проверки внутренних страниц (коды ответов сервера, скорость загрузки каждой страницы, метатеги).

6. Web Page Test

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

Сервис проводит три теста и сравнивает число обращений. Так выявляются ошибки в организации кэширования, собираются данные по каждой загрузке:

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

7. Sitespeed

Второй (и последний) русскоязычный сервис, позволяющий проверить скорость загрузки сайта и оценить его доступность:

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

По результатам теста вы получаете рекомендации по улучшению показателей. Также можно получить сформированный отчет на почту.

8. Load Impact

Завершает хит-парад хардкорный Load Impact — один из самых требовательных сервисов проверки скорости загрузки веб-ресурса. Тест этого сервиса по сути проводится по принципу DDOS-атаки. На сайт производится симуляция больше сотни активных соединений и несколько десятков обращений от пользователей.

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

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

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

Скорость загрузки страниц сайта: анализ, проверка, инструменты

О чем статья?

●      Как вес контента и хостинг влияют на скорость загрузки;

●      Какими инструментами можно измерить скорость работы сайта;

●      Что нужно сделать, чтобы ее повысить.

Скорость загрузки сайта – один из факторов ранжирования. Большое время загрузки негативно влияет на позиции в выдаче. И Яндекс, и Google отдают предпочтение быстрым ресурсам. 

От скорости зависит поведение пользователей – чем быстрее сайт загрузится, тем выше вероятность, что посетитель останется и выполнит целевое действие. То есть конверсия и другие, связанные с ней бизнес-параметры — ROI, LTV, продажи – также привязаны к быстродействию.

Оптимальное время загрузки — 2-3 сек. Идеальное — время реакции пользователя, то есть, 0,5 сек. Однако для высоконагруженных веб-приложений оптимальная скорость может отличаться. В таких случаях нужно провести проверку скорости и высчитать среднее время загрузки сайтов конкурентов и ориентироваться на него.

Что влияет на скорость 

Система сайта. Сайт по сути система связанных электронных документов: файлов, изображений, видео, непосредственно кода. Размер документов влияет на скорость. Большой вес — нет быстродействия. Сначала узнайте вес собственного сайта. Для этого: 

• Откройте страницу через Google Chrome, 
• Зайдите в инструменты разработчика с помощью кнопки F12 
• Перейдите на вкладку Networks
• Отключите кэш (disable cache) и посмотрите значение в нижнем левом углу. 

В нашем случае это 1,0 Mb, transferred

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

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

В примере видим, что для кабельного соединения тестируемый ресурс может весить еще больше, чем сейчас. Для мобильного интернета 3G (780 кб/сек) он должен быть не более 192 kb, иначе скорость загрузки составит 4,17 сек.

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

Как проверить скорость 

Google Page Speed Insights. Один из самых популярных SEO-инструментов для анализа сайтов. Он может определить скорость загрузки десктопной и мобильной версий и дать рекомендации по ее увеличению. Он показывает, как быстро страница загружалась у реальных пользователей, а также по итогам имитации с помощью инструмента Lighthouse. Поисковик считает быстрым тот ресурс, который получил 90-100 баллов.

Page Speed Insights измеряет скорость загрузки сайта по шести параметрам.

• Первая отрисовка контента – показывает время между началом загрузки страницы и появлением первого блока текста или изображения.

• Индекс скорости загрузки – т.е. скорость появления контента на странице.

• Отрисовка крупного контента – время, которое требуется на отрисовку большого блока текста или изображения.

• Время загрузки для взаимодействия – страница полностью готова к работе с посетителем.

• Сумма всех периодов от первой отрисовки контента до загрузки для взаимодействия, когда скорость выполнения задач была выше 50мс.

• Совокупное смещение макета – процент, на который смещаются при загрузке видимые элементы области. 
  

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

Чтобы проверить скорость загрузки страниц на мобильных устройствах, можно воспользоваться другим инструментом от Google – Test My Site.

SpeedTest.me. Сервис, который показывает, как загружается сайт в разных регионах мира. В нашем примере скорость загрузки в России составила 2,16 сек. 

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

В примере мы рассчитали следующие показатели: 

• Page size (размер страницы) — 909,8 Кб; 
• Load time (время загрузки) — 2,55 сек.; 
• Requests (количество запросов) — 71; 
• Faster than (доля сайтов, которые медленнее тестируемого) — 60%; 
• Performance grade (уровни производительности) — 69. 

Если performance grade меньше 100, ищите и устраняйте проблему. Что-то «съедает» производительность. 

Сервис указывает на проблемы и присваивает им рейтинг: 0 — худшее значение, 100 — лучшее. В примере основная проблема — отдельные JS-скрипты. Они замедляют быстродействие. 

Есть аналитика распределения ссылок и размера файлов. 

WebPageTest.  Здесь для проверки нужно выбрать локацию и браузер. В примере локация — Амстердам, браузер — Google Chrome. Сервис делает три проверки скорости. Он показывает время загрузки первого варианта страницы — то, что сразу увидит пользователь, и время полной загрузки сайта. В примере 3,544 сек и 3,692 сек соответственно. 

Процентное соотношение размеров и запросов между системами сайта:

Как увеличить скорость 

• Уменьшите количество запросов. На запросы и ответы уходит время. Сократив их количество, мы увеличим скорость работы сайта. Для этого загружайте все файлы, которые возможно, статично без использования запросов к базе данных. Дополнительно объедините CSS и JS в отдельные файлы. В этом помогут плагины Gulp, Grunt, WebPack. 

• Оптимизируйте CSS и JavaScript. На скорость загрузки сайта сильно влияет размер и количество CSS и JS файлов, поэтому сожмите их с помощью онлайн-инструментов 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. Технологии позволяют создать легкие версии страниц, которые весят в десять раз меньше. Это помогает быстро загружать страницы, в том числе и на мобильных устройствах.

Шпаргалка 

• Рассчитайте скорость загрузки — это важный фактор ранжирования. Рекомендуемое время загрузки — 2 сек. Для высоконагруженных приложений рассчитайте время загрузки самостоятельно — взяв среднюю скорость загрузки сайтов конкурентов. На скорость влияют вес сайта и хостинг. 

• Оценивайте вес сайта с помощью инструментов вебмастера Google Chrome. Желательный вес сайта узнайте через инструмент Performancebudget.io. В нем рассчитывается максимальный размер файлов сайта, который подходит для желаемого времени загрузки под каждый тип интернет-соединения. 

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

• Проверьте скорости загрузки. Проверка производится с помощью специальных сервисов: SpeedTest.me, ToolsPingdom.com, WebPageTest. Они подсчитают, за сколько времени загрузился сайт, количество запросов, размеры, уровни производительности, распределение ресурсов по весу и запросам. 

• Улучшайте скорость. Сократите количество запросов, по которым обращаются к серверу. Для этого объедините CSS в один файл и скрипты JS тоже в отдельный файл. Оптимизируйте их через инструменты CSS Minifier, CSS Compressor для CSS, и JS Minifier и JavaScript Compression Tool для JavaScript. Размещайте js скрипты перед закрывающим тегом . 

• Оптимизируйте изображения. Делайте из иконок спрайты, сжимайте и оптимизируйте фотографии с помощью Kraken.io и TinyPNG. Используйте фотографии только требуемого размера. 

• Настройте Турбо-страницы от Яндекс и AMP от Google для загрузки легкой версии страниц.

Материал подготовила Светлана Сирвида-Льорентэ.

Скорость загрузки сайта – как ее проверить и увеличить

Даже сейчас, когда скорость интернета у большинства провайдеров превышает 100 Мбит/сек, а мобильные операторы развивают 5G, вопрос о скорости загрузки сайта остается актуальным. Этот параметр существенно влияет на конверсию, показатель отказов, посещаемость и другие важные для бизнеса KPI. Потому что при прочих равных условиях человек выберет тот сайт, который быстрее загружается и не заставляет его ждать. Об этом нам говорят логика, личный пользовательский опыт и многочисленные исследования на тему, которые можно найти в сети. Вот, например, исчерпывающая подборка кейсов с цифрами, как компании экспериментировали со скоростью загрузки.

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

В  статье мы расскажем:

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

1. Клиенты уходят к конкурентам — им проще вернуться в поисковик и выбрать следующий сайт.
2. Задержка загрузки на 0,1 секунду уменьшает конверсию на 7% (согласно исследованию Akamai).
3. Снижается вероятность, что пользователи вернутся на сайт. Google говорит, что из-за негативного пользовательского опыта вероятность повторной покупки снижается на 60%. Правда, речь про мобильные версии.
4. Скорость загрузки влияет на ранжирование сайта в поисковиках. Если сайт долго грузится, робот поисковой системы может не успеть его полностью проиндексировать.

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

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

Есть много онлайн-сервисов, которые позволяют проверить быстроту загрузки страниц — достаточно ввести нужный URL. Рассмотрим три самых интересных, на наш взгляд. Для примера будем использовать сайт https://shop.googlemerchandisestore.com/.

1. PageSpeed Insights

Это бесплатный инструмент от Google. С его помощью можно узнать, как быстро загружаются страницы на компьютере или мобильных устройствах. Если кратко, то сервис берет ключевые метрики об опыте реальных пользователей по всему миру из Chrome User Experience Report и сравнивает их с вашими. В результате вы видите среднюю скорость загрузки своей страницы и уровень оптимизации, а также долю загрузок, которые проходили на медленной, средней и высокой скорости.

Если страница показывает не самые лучшие результаты (как в нашем примере), сервис дает конкретные советы, как ее оптимизировать.

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

Кстати, рекомендации PageSpeed Insights можно увидеть в отчете Google Analytics «Ускорение загрузки», если кликнуть на ссылку в соответствующем столбце:

Вообще, группа отчетов «Скорость загрузки сайта» (Site Speed reports) в GA — полезная штука. Если раньше вы не уделяли должного внимания этим отчетам, рекомендуем периодически их просматривать, чтобы отслеживать показатели в динамике и вовремя реагировать на проблемы.

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

Допустим, ваша целевая аудитория находится в Германии. Если вы посмотрите на отчет выше, то увидите, что одна из важных страниц вашего сайта в этой стране грузится очень медленно (19,24 сек.), при этом у нее 140 просмотров. Чтобы ускорить загрузку, нужно оптимизировать страницу. Если же в этом регионе или у этого провайдера скорость интернет-соединения слишком мала для вашего сайта, можно создать альтернативные страницы, адаптированные для низкой пропускной способности.

2. Pingdom Tools

Это один из самых информативных и популярных сервисов для проверки скорости. У него есть бесплатная и платная десктоп-версии, а также мобильное приложение с 14-дневным trial.

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

Кроме того, в бесплатной версии Pingdom Tools вы можете:

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

3. GTmetrix

По функционалу этот сервис очень похож на Pingdom Tools, разве что предоставляет информацию в более удобном и организованном виде. Бесплатная версия показывает браузер и локацию сервера, используемого для тестирования, производительность страницы (PageSpeed и YSlow), время загрузки, количество запросов и общий размер страницы. Учитывая, что сервис сохраняет историю проверок, этих метрик будет достаточно, чтобы анализировать скорость загрузки вашего сайта в динамике.

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

После проверки сайта вы можете прикинуть, сколько заработаете, если ускорите загрузку. Например, с помощью калькулятора от Google или Sharpe Digital.

Как ускорить загрузку страниц

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

1. Страницы большого размера

Чтобы сократить объем данных, передаваемых в браузер пользователя, используйте сжатие GZIP. Это позволит уменьшить размер веб-файлов на 70% без ухудшения их качества. Проверить, доступен ли этот метод сжатия для вашего сайта, можно с помощью сервиса GiftOfSpeed или GTmetrix.

2. «Тяжелые» изображения

Изображения большого размера и разрешения значительно тормозят загрузку страницы. Чтобы этого избежать, используйте JPEG картинки вместо PNG — они весят в 5 раз меньше, не уступая при этом в качестве. Уменьшить размер изображения вы можете с помощью любого онлайн-оптимизатора: Optimizilla, Compressor, Imagify, TinyPNG и т.д. Или, например, можно прогнать картинку через Photoshop и сохранить ее в специальном формате, предназначенном для веб-сайтов. Главное — не переусердствовать и найти золотую середину между качеством и размером файла.

3. Много запросов от браузера

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

• Удалить лишние изображения, JS-файлы, коды сторонних сервисов.
• Объединить несколько небольших элементов (иконки, кнопки) в один CSS-спрайт с помощью CSS Sprites generator, CssSpritegen, Spritebox или любого другого генератора.
• Использовать кэширование. Каждый раз, когда человек заходит на сайт, его браузер загружает все веб-файлы с сервера. Если включить кэширование, браузер сохранит данные на компьютер пользователя и при повторных визитах будет загружать их уже оттуда. Вы можете подобрать себе кэш-плагин для ускорения работы сайта в зависимости от того, какая у вас CMS. Например, для WordPress подойдут WP Super Cache, W3 Total Cache, Hyper Cache.

4. Перегруженный код JavaScript и CSS

Если код JavaScript и CSS слишком длинный, содержит много лишних элементов (пробелы, комментарии и т.п.), то страница может загружаться с задержками. Чтобы оптимизировать код, вы можете:

• Сократить название функций и почистить код с помощью специальных сервисов, например: JavaScript/CSS/HTML Compressor, CSS Compressor, JSCompress.
• Разместите CSS-файлы в самом начале страницы — так она будет отображаться постепенно, по компонентам.
• Вынесите JS-файлы в конец страницы. Благодаря этому браузер будет сначала загружать контент страницы, а и уже потом скрипты.

5. Большое расстояние между сервером и пользователем

Чем дальше от компьютера находится сервер вашего хостинг-провайдера, тем медленнее загружается сайт. «Сократить» это расстояние помогут сети доставки контента CDN: Amazon CloudFront, Incapsula, Akamai и другие. Когда человек заходит на сайт, CDN загружает веб-файлы со своего сервера, находящегося ближе всего к пользователю. Эта схема прекрасно иллюстрирует принцип работы CDN-сетей:

6. Медленный хостинг

Если вы попробовали все описанные выше советы, а скорость сайта оставляет желать лучшего, проверьте время ответа сервера. Например, это можно сделать в отчете Google Analytics «Скорость загрузки сайта» → «Обзор»:

На скриншоте мы видим, что среднее время ответа сервера 0,8 секунд. Это не очень хорошо, так как в идеале оно не должно превышать 0,2 секунды. Если у вас этот показатель намного больше, возможно, стоит задуматься о смене хостинг-провайдера.

Как регулярно мониторить скорость сайта

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

Если вы собираете данные в Google BigQuery с помощью OWOX BI Pipeline и хотите отслеживать основные технические показатели сайта, заполните форму — и мы пришлем вам шаблон дашборда, который можно скопировать, а также гайд, как его настроить.

Получить шаблон дашборда

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

1. Количество пользователей.
2. Количество сеансов.
3. Количество просмотров страниц.
4. Ошибки JavaScript.
5. Ошибки 404.
6. Среднее время загрузки страниц.
7. Среднее время соединения с сервером.

На втором листе можно узнать подробную информацию по ошибкам JavaScript:

• Общее количество ошибок за выбранный период.
• Количество ошибок на страницу.
• Количество сессий с ошибками.
• Сколько процентов пользователей столкнулись с ошибками.
• На каких страницах и типах страниц происходят ошибки (для отслеживания типов страниц, необходимо внедрить pageType на сайте, а также создать пользовательскую переменную уровня хита hits.page.pageType).
• В каком браузере и его версиях происходят ошибки.

На третьей странице представлена подробная информация об ошибках 404:

• Общее количество ошибок.
• Количество ошибок на страницу.
• Количество сессий с ошибками.
• Количество пользователей, у которых возникли ошибки.
• А также рефералы, после которых возникли ошибки.

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

На четвертой странице информация по десктопу:

На пятой странице данные по планшетам и мобильным устройствам:

Теперь вы знаете, как заставить свой сайт «летать» 🙂 Если у вас остались вопросы или вы знаете другие способы уменьшить время загрузки страниц, пишите их в комментариях.

Использованные инструменты

Тестирование производительности сайта — 15 бесплатных инструментов

Я подобрал 15 инструментов для тестирования производительности и быстродействия сайта. На момент написания статьи все эти инструменты были бесплатными и не предполагали установки какого-либо программного обеспечения для тестирования.

Некоторые инструменты, такие как Webpagetest и LoadImpact, очень сложные, в то время как другие, вроде Redbot или Alertra, всего лишь осуществляют простые проверки быстродействия сайта.

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

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

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

Ещё один замечательный инструмент, позволяющий проверить быстродействие сайта. Он предоставляет оценки Google PageSpeed Grade и Yslow Grades. Я рекомендую этот инструмент, если вы хотите улучшить производительность.

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

Предоставляет прекрасные сервисы мониторинга и включает в себя бесплатный инструмент тестирования производительности веб-страниц. Главный отчёт – это водопад-диаграмма времени загрузки сайта.

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

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

Уделите внимание деталям. Здесь наш сайт получил 69 баллов, но время загрузки было только 0,5с. Это быстрее, чем у 97% всех протестированных сайтов.

Этот инструмент существует уже давным-давно, но он очень полезен, если вам нужно провести тестирование из нескольких местоположений. Доступно больше 100 местоположений на выбор.

Новый сервис с множеством инструментов. Результаты их работы похожи на Google PageSpeed, но размещение и удобство использования на высоте. К каждому плохому результату теста добавляется объяснение.

Feedthebot пригодится для объяснения клиентам проблем, связанных с оптимизацией производительности сайта.

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

Тест производительности сайта из 20 местоположений всего в один клик. Мне нравится этот инструмент, потому что он производит полное браузерное тестирование. Отчёт включает в себя водопад-диаграммы из всех 20 местоположений! Иногда проблемы в работе Сети могут снижать производительность сайт. Но их может быть сложно обнаружить без мониторинга из разных местоположений.

Инструмент SpotCheck от Alertra отлично подходит, чтобы быстро определить работает ли сайт при обращении к нему из нескольких местоположений. Я часто использую его, чтобы быстро проверить сайты, когда клиенты сообщают о проблемах. Обычно если тест Alertra не показывает проблем, то это значит, что проблема изолирована в узком регионе или это что-то, связанное с действиями конкретного клиента.

Это интересная маленькая утилита позволяет посмотреть, что загружается быстрее. Вставьте два URL-адреса в форму и нажмите «Go». Это может быть полезным, если требуется проводить быстрые тесты разных сайтов или продемонстрировать клиенту, насколько быстрее сайт может загружаться с другого хостинга.

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

Круговая диаграмма, показывающая распределение HTTP-запросов по типу контента. Здесь мы видим, что более 40% запросов приходятся на JavaScript, что может быть улучшено слиянием js-файлов.

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

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

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

Быстрые отчёты с водопад-диаграммами – вот чем полезен этот инструмент. Не слишком много деталей, но тест выполняется быстро и бесплатно!

Набор утилит для проверки скорости работы хостинга, DNS и прочего. Его разработчики постоянно обновляет набор инструментов сервиса.

Это не инструмент тестирования. Но если DNS не работает, то сайт может быть недоступен. Проверяйте поддомены, использующиеся для CDN и другого контента, опубликованного на вашем сайте.

Инструмент позволяет управлять несколькими WordPress-сайтами из одного места.

Дайте знать, что вы думаете по этой теме в комментариях. Мы крайне благодарны вам за ваши комментарии, подписки, лайки, отклики, дизлайки!

Данная публикация является переводом статьи «15 Free Website Performance Testing Tools» , подготовленная редакцией проекта.

Скорость загрузки сайта – как проверить и увеличить скорость загрузки страниц

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

Как ускорить работу сайта и привлечь больше клиентов?

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

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

Начнем с основ: чтобы сайт появился на вашем экране, должны произойти две вещи.

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

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

Проверить скорость загрузки Вашего сайта

Что происходит на сервере?

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

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

Однако, как владелец сайта, вы влияете на качество кода. Большинство web-сайтов основаны на системах CMS, которые позволяют редактировать контент. Самым многочисленным представителем этих систем, конечно же, является WordPress, написанный на PHP. Каким-то образом ваш код WordPress (на самом деле плагины и темы, которые вы используете) оказывает наибольшее влияние на скорость ответа сервера.

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

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

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

Что происходит на стороне браузера?

Когда сервер завершает обработку, сгенерированный HTML-код отправляется в браузер пользователя. Теперь его задача — отобразить страницу на основе данных, полученных с сервера.

Помимо HTML-кода, браузеру нужны два других типа данных / файлов. Они будут

• CSS (каскадные таблицы стилей) — они отвечают за внешний вид страницы. CSS содержат инструкции по внешнему виду данного элемента, такие как форма, цвет, размер шрифта и т. Д.
• JavaScript — код, отвечающий за любые динамические действия, не требующие перезагрузки страницы. Это будет, например, анимация или работа корзины в интернет-магазине.

Браузер получает три типа исходного кода, которые необходимо преобразовать в внешний вид и функциональность веб-сайта (HTML, CSS, JS). Только когда это будет сделано, страница загрузится в браузере. Однако между тем, что происходит на сервере, есть важное различие. Браузер интерпретирует код последовательно, что означает, что код может быть частично загружен.

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

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

Действительно ли скорость страницы влияет на позиции в Google?

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

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

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

Почему стоит инвестировать в ускорение работы сайта?

У быстрого сайта есть еще много преимуществ. Ниже приведены некоторые из самых важных:

Ваши клиенты не нервничают

Знаете ли вы это чувство, когда вы заходите на сайт и он долго загружается? Хотите купить этот товар, но ваша корзина зависает или страница не подходит для вас из-за медленной загрузки?

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

Вы уменьшаете показатель отказов

Показатель отказов показывает, сколько пользователей покидают ваш сайт без какого-либо взаимодействия. Чем выше коэффициент, тем больше трафика заканчивается без взаимодействия. Теперь посмотрим на данные, представленные Google:

Посмотрите, как распределяется риск отката (выходов со страницы без взаимодействия) в зависимости от скорости загрузки страницы:

• 1с — 3с — вероятность отскока увеличивается на 32%,
• 1 с — 5 с — вероятность отскока увеличивается на 90%,
• 1с — 6с — вероятность отскока увеличивается на 106%,
• 1с — 10с — вероятность отскока увеличивается на 123%,

Цифры говорят сами за себя, чем медленнее сайт, тем больше людей выйдет с него. Что это значит? К сожалению потеря потенциального покупателя или читателя.

Вы увеличиваете конверсию / скорость продаж

Чем быстрее сайт, тем больше довольных пользователей, которые с большей вероятностью купят или заполнят контактные формы. Другими словами, скорость вашего сайта переводится в деньги.

За границей этот факт очевиден. Посмотрите, как быстро работает сайт Amazon, который считается самым быстрым сайтом в электронной коммерции.

Как проверить скорость: сервисы и их возможности

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

Google PageSpeed Insights

Один из наиболее используемых инструментов. Сервис позволяет определить время разных этапов загрузки определенной страницы.

Основные возможности инструмента:

• демонстрирует оценку скорости по стобалльной шкале. Минимальный показатель хорошей загрузки — 90%;
• формирует отчет, который показывает скорость загрузки контента, отображает время между запросом и ответом страницы;
• имеет раздел «Имитация загрузки». Он проверяет скорость отображения в условиях 3G-соединения;
• предоставляет рекомендации по оптимизации страниц с указанием времени, которое можно сократить.

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

Pingdom Tools

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

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

Web Page Performance Test

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

Load Impact

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

WhichLoadFaster

Данный сервис сравнивает скорость загрузки двух площадок. Он наглядно показывает, какой веб-ресурс быстрее отображает данные и на сколько. После проверки предоставляется информация по каждому сайту. Тестирование проходит быстро. Инструмент в короткие сроки показывает данные по загрузке. Из недостатков — не дает рекомендаций по оптимизации площадки.

GTmetrix

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

Основные плюсы инструмента GTmetrix:

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

Во free-версии функции ограничены. Для комплексной, детальной проверки скорости сайта лучше купить инструмент с большим набором опций. Недостаток сервиса — английский язык, но при этом он прост и понятен в управлении.

Monitis Tools

Проводит проверку скорости, имитируя запросы из разных стран (США, Европа, Азия). После теста инструмент предоставляет информацию по каждой загрузке. В отчете пользователи могут ознакомиться с такой информацией: объем сайта, источник запросов, количество времени, необходимого для соединения и загрузки.

SiteSpeed.me

Русскоязычный инструмент, который использует более 30 серверов для анализа. Он показывает результаты по каждой проверке, подсвечивает лучшие и худшие показатели. В отчете представлена информация о геолокации, объеме веб-ресурса, скорости отображения данных. У этого инструмента всего одна функция — проверка. Он не дает рекомендаций, как оптимизировать площадку и улучшить скорость работы сайта.

PR-CY

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

В полной версии есть функция сравнительного анализа (с 60 адресов). Сервисом также осуществляется проверка внутренних страниц. В настройках можно установить параметры анализа: для десктопных или мобильных версий. После тестирования инструмент предоставляет ряд рекомендаций, как улучшить скорость загрузки страниц.

WebPage Analyzer

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

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

Читайте также

Оптимизация сайта для мобильных устройств

Как ускорить загрузку сайта: эффективные приемы

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

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

Что можно ускорить на стороне сервера?

Когда дело доходит до конфигурации сервера, вы мало что можете сделать, об этом позаботятся хосты. Единственное, что вы можете заметить, это версию PHP. Убедитесь, что он выше 7.1.

Использование более низких версий приведет к гораздо более медленному выполнению кода PHP — сервер вызовет задержку. Поэтому, если вы влияете на выбор хостинга — выбирайте тот, у которого версия PHP выше 7.1.

Помимо серверной версии PHP, вы можете сделать еще несколько вещей:

Использовать сжатие без потерь

Сжатие без потерь — это способ «упаковки» данных на время передачи между сервером и браузером. Самыми популярными инструментами, которые справляются с этим, являются модули Apache (серверное программное обеспечение): GZIP и deflate.

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

Оптимизируйте свой PHP-код

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

Однако, если у вас есть собственный шаблон на WordPress или вы создали сайт с использованием другой технологии, вы можете оптимизировать код, чтобы сервер работал более эффективно.

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

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

Использовать кеш на стороне сервера

Кеш на стороне сервера — быстрый способ решить все проблемы с количеством и качеством кода. Работа механизма кеширования проста. Вы помните, что происходит, когда пользователь заходит на сайт?

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

Ситуация меняется после запуска кеша. Теперь, когда 100 человек посещают ваш сайт за одну минуту, сервер запускает все функции только один раз (от первого лица). Пока первый человек просматривает страницу, сервер сохраняет содержимое сгенерированного HTML-кода в свой кеш.

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

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

Что можно ускорить в браузере?

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

Включить кеширование на стороне браузера

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

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

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

Как включить кеширование на стороне браузера?

Для этого вам нужно снова отредактировать файл .htaccess на сервере. Этот файл содержит инструкции не только для самого сервера, но и для браузеров, которые загружают данные с этого сервера. Добавьте в конец файла следующий код:

Приведенный выше код приводит к тому, что файлы с заданными расширениями будут содержать информацию о возможности сохранения их на диск браузером. Параметр max-age — это время, в течение которого браузер может удерживать файл, значение в секундах. В данном случае 31 536 000 — это ровно один год.

Оптимизируйте свою графику

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

Во-первых, размер графики

Не многие владельцы сайтов обращают внимание на размер и разрешение вставляемых фотографий. Разработчики также не прилагают никаких усилий, чтобы, например, запретить добавление фотографий прямо с камеры — фотография с разрешением 4000 пикселей и более 20 мб на вашем сайте не нужна!

В среднем экран ноутбука имеет ширину примерно 1300-1400 пикселей. Обычно страницы должны иметь ширину 1200 или 1440 пикселей. Почему файлы большего размера? Даже если вы используете разрешение 1080 (широкий), такая фотография будет очень хорошо смотреться на сайте, добавлять графику большего размера нет смысла.

Фотография размером 20 МБ может быть уменьшена до 0,5 МБ без потери качества. Выиграют все, пользователь, сервер и перевод. Подумайте, как ваш сайт может ускориться, если у вас сейчас больше десятка таких фотографий. Есть страницы размером даже в десятки мегабайт, просто ограничение размера фотографий может уменьшить их размер до нескольких мегабайт.

Во-вторых, правильное использование графики

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

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

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

В-третьих, соответствующий графический формат

Существует множество графических форматов, наиболее популярными из которых являются JPG, PNG и SVG. Каждый из них подходит для немного разных графических элементов.

• JPG оптимизирован для фотографий. Файлы JPG представляют собой растровые файлы с потерями, что означает, что они теряют небольшой объем информации при каждом сохранении файла JPG. Файлы JPG работают со сжатием цвета, поэтому они отлично подходят для фотографий. Уменьшение размера файла снижает качество изображения.
• PNG был разработан для использования в Интернете и является наиболее широко используемым форматом сжатия изображений в Интернете. Формат PNG представляет собой растровую графику и был введен как усовершенствование формата GIF. Файлы PNG хорошо работают с графическими изображениями, созданными для Интернета. К сожалению, они могут привести к очень большим размерам файлов. Большим преимуществом PNG является то, что он поддерживает альфа-канал, что означает, что их фон может быть прозрачным.
• SVG — это векторная графика, которая также поддерживает анимацию. Векторная графика отлично подходит, например, для логотипов и других геометрических фигур. Файлы SVG не состоят из пикселей и могут бесконечно масштабироваться без потери качества или увеличения размера файла. Файлы SVG — лучший вариант для создания значков и штриховых рисунков для дисплеев с высоким разрешением.

Стоит придерживаться вышеуказанного использования, это поможет вам сэкономить больше килобайт данных. Например, большая фотография, сохраненная в формате PNG, может занять несколько мегабайт, в то время как сохранение ее в формате JPG уменьшит размер до 0,5 мегабайта — помните об этом!

В-четвертых, Lazy Load

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

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

Оптимизация файлов CSS и JS

Оптимизация файлов CSS и JS — большая часть процесса ускорения страницы. Они несут ответственность за внешний вид (CSS) и различные функции (JS) вашего веб-сайта. Соблюдение нескольких основных правил при их использовании может значительно повлиять на воспринимаемую скорость веб-сайта.

Уменьшите код

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

Объедините файлы CSS и JS

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

Стоит свести к минимуму количество файлов CSS и JS, объединив их в один коллективный файл CSS и один коллективный файл JS. Это приведет к увеличению скорости загрузки (легче отправить один файл большего размера, чем дюжину меньших) и ограничит ресурсы браузера, который будет обрабатывать только один файл.

Общее количество файлов можно организовать уже на этапе реализации веб-сайта (это должен сделать разработчик).

Загружайте файлы CSS / JS как можно позже

На большом количестве страниц все файлы CSS и JS помещаются в раздел HEAD документа HTML. Это означает, что инструкции, содержащиеся в этих файлах, загружаются раньше, чем фактическое содержимое страницы. Такой подход может вызвать задержку в представлении содержимого страницы.

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

Оптимизируйте качество вашего кода CSS / JS

Для CSS вы можете проверить, действительно ли вам нужны все инструкции по стилизации элементов страницы. Очень часто код отвечает за появление элементов, которых нет на странице. Так зачем тратить ресурсы и добавлять этот код?

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

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

Выводы

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

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

КОМПЛЕКСНЫЙ АУДИТ САЙТА

Профессиональный комплексный аудит сайта — глобальный анализ вашего проекта ✔ Подробный отчет с перечнем ошибок и рекомендаций для улучшения ✔ Увеличение конверсий

Получить консультацию

Наш менеджер свяжется с Вами в ближайшее время

Отправить заявку

Влияние производительности сайта на SEO

Современные интернет-пользователи в некоторой степени являются избалованными, поскольку они не привыкли долго ждать и хотят от веб-ресурсов максимальной скорости. Как показывает практика, люди готовы ждать загрузки страниц с интересующей информацией или товарами максимум 5 секунд. Если же скорость загрузки страниц сайта с графической частью и информационным контентом будет низкой, человек вряд ли вернётся на конкретный веб-ресурс. Даже если сайт будет очень красивым, многофункциональным и полезным, но из-за анимированных баннеров, высококачественных фото и прочих «фишек» нужно будет долго ждать его загрузки, количество посетителей будет только уменьшаться.

От чего зависит скорость загрузки веб-страниц и как избежать низкой производительности? Об этом и поговорим дальше.

Что такое производительность сайта

Как правило, производительностью сайта называют параметр, показывающий, за какой промежуток времени загружается страница сайта в конкретной сети и на конкретном веб-сервере. Для этого существует специальная характеристика – TTFB (time to first byte). Чем меньше этот параметр, тем выше производительность веб-ресурса.

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

Данная характеристика крайне важна, поскольку она напрямую влияет на ранжирование сети и веб-ресурса поисковыми системами.

Как измерить производительность сайта

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

Среди наиболее популярных сервисов можно выделить:

• Webpagetest: один из лучших инструментом для проверки быстродействия сайтов и поиска причин медленной загрузки страниц. В результате система показывает водопад-диаграмму, которая наглядно демонстрирует загрузку отдельных компонентов, позволяя понять, какие блоки замедляют сайт.
• GTMetrix: также очень крутой инструмент для проверки производительности веб-ресурсов, предоставляющий оценку Google PageSpeedGrade и YslowGrades.
• Pingdom: прекрасный сервис для мониторинга сайтов, который позволяет бесплатно тестировать быстродействие с выдачей отчёта по каждому HTTP-запросу.
• Gomez: особенно полезный инструмент, когда необходимо протестировать сайт с нескольких местоположений.
• FeedTheBot: относительно новая система с большим количеством инструментов. При проверке производительности веб-ресурса предоставляется объяснение ко всем плохим результатам тестов.
• Google Page Speed Insights: удобный сервис для оценки быстродействия сайта в настольных и мобильных браузерах.

Читайте также статью «Как сделать карточку товара для интернет-магазина правильно?»

Как производительность влияет на SEO

 

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

Важно знать! Как показывает практика, быстродействие даёт от 20 до 40% влияния на ранжирование сайтов. По этой причине низкая скорость загрузки страниц может вредить при СЕО, ухудшая результаты продвижения веб-ресурсов.

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

Читайте также статью «Как сделать интернет-магазин: пошаговая инструкция»

Способы улучшить скорость загрузки страниц

 

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

• обеспечить высокую скорость сканирования HTML, CSS и JS кодов – от этого зависит 60-70% производительности сайта;
• отключить неиспользуемые библиотеки, скрипты, плагины и другие сервисы, которые тормозят загрузку страниц;
• подгонять физические размеры картинок, чтобы они соответствовали отображаемым габаритам на сайте;
• подобрать качественный и надёжный хостинг, который гарантирует быстрый отклик сервера;
• использовать кэш веб-браузера, прописывая данные для возможных ресурсов.

 

Обеспечение быстродействия веб-ресурса – сложный и трудоёмкий процесс, с которым может справиться только профессионал. Если вы хотите повысить производительность сайта, можете обратиться за помощью в веб-студию Dynamics Moscow. У нас работают квалифицированные и опытные специалисты, которые сделают всё возможное, чтобы сократить скорость загрузки страниц вашего интернет-магазина, блога, корпоративного сайта или информационного портала.

Читайте также статью «Как заказать новый сайт?».

повышаем производительность сайта – База знаний Timeweb Community

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

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

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

Распространенные ошибки, которые снижают производительность сайта

Изображения не оптимизированы

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

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

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

Сайт не оптимизирован для мобильных устройств

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

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

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

• Сайты, оптимизированные для мобильных устройств, занимают более высокие позиции в результатах поиска.
• Больше половины запросов в Google выполняются с мобильных устройств.
• Трафик многих рекламодателей состоит преимущественно из посещений с мобильных устройств.
• Пользователи в 5 раз чаще покидают неоптимизированные ресурсы.

Отсутствие метатегов для социальных сетей

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

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

Переадресация (редирект)

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

Переадресацию можно прописать в файле .htaccess, а также добавить в код страницы редирект JS, HTML или PHP. Если перенаправление настроено неправильно, это может привести к цепному перенаправлению. Такие цепные перенаправления приводят к задержкам редиректа, а значит, замедляют скорость производительности ресурса и наносят вред SEO, а также ранжированию сайта.
 
Правильно настроенный 301 редирект поможет вам избежать часто встречаемых проблем:

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

Поэтому при необходимости настройки редиректа уделяйте этому особое внимание.

Неудачный дизайн 

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

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

Лучшие инструменты для проверки показателей сайта

Скорость загрузки страницы влияет на производительность практически во всех сферах — от пользовательского опыта до поисковой оптимизации. Большинство посетителей сайта будут ждать загрузки страницы от 2 до 4 секунд, прежде чем перейти к другому сайту в списке. И нельзя обойти стороной тот факт, что более быстрый сайт будет работать лучше. Но не всегда просто понять, с чего нужно начать. Я рекомендую вам периодически проводить мониторинг сайтов с помощью простых онлайн-инструментов, о которых я расскажу ниже. 

Pingdom

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

SupportPRO Scanner

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

Acunetix  

Acunetix — это инструмент для обнаружения уязвимостей сайтов, в котором инженеры компании внедрили технологию сканирования на предмет безопасности веб-приложений. Она охватывает 360-градусный вид сайта. Этот сервис имеет множество уникальных функций: AcuSensor Technology, SQL-инъекция и межсайтовое скриптовое тестирование, тестирование безопасности приложений Ajax и Web 2.0, механизмы двухфакторной аутентификации и т.д.

GTmetrix

Одним из лучших бесплатных инструментов для тестирования скорости сайта в 2019 году является GTmetrix. Этот инструмент невероятно простой в использовании. Вы просто вводите свой URL и нажимаете «Анализ». При бесплатной регистрации возможно проверить скорость загрузки сайта из семи различных локаций. Этот инструмент позволяет выбрать браузер Firefox или Chrome. GTmetrix имеет и другие уникальные функции: воспроизведение видео для выполнения анализа и выявления проблем при загрузке, возможность запуска Adblock Plus. 

Google PageSpeed Insights

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

Читайте также

Управление скоростью и безопасностью сервера и сайта

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

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

Включите сжатие и минимизируйте файлы

Сжатие файлов и минимизация файлов являются важными действиями, которые помогают получить хорошую скорость загрузки страниц. Если у вас много JavaScript и CSS-файлов, это увеличивает время загрузки страницы, а также время отклика сервера.
Gzip-сжатие — один из способов сжатия и минимизации большого размера HTML, JavaScript и CSS-файлов. Если вы уменьшите длину кода и количество JavaScript и CSS файлов, это автоматически увеличит скорость загрузки страницы.

Сеть доставки контента (CDN)

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

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

Уменьшите количество неиспользуемых плагинов

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

Кэширование сайта

Основная задача кэширования — ускорение работы программы, загрузки сайта и т.д. Время извлечения из кэша меньше, нежели получение информации из какого-то удаленного источника. Чем чище кэш браузера, тем легче работать с ресурсом. Для обеспечения высокой скорости загрузки страниц, закачки приложений и файлов, появления минимум ошибок “Time out” на странице, сбрасывайте время от времени кэш сайта. 

Уменьшите количества переадресаций

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

Заключение

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

Как правильно провести тест скорости веб-сайта (вы делаете это неправильно)

Когда дело доходит до вашего сайта WordPress, важна скорость . Это факт. Почему? Во-первых, скорость веб-сайта — важный фактор в алгоритме Google. Быстро загружающиеся веб-сайты могут рассчитывать на более высокий рейтинг в поисковой выдаче и привлекать больше посетителей. Во-вторых, необходимо учитывать все аспекты пользовательского опыта. Если сайт загружается быстро, посетители с большей вероятностью останутся, прочитают ваш контент и, в конечном итоге, конвертируются.Другими словами, молниеносный веб-сайт открывает все хорошее, чего так жаждут веб-мастера.

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

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

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

Перед запуском теста скорости веб-сайта

Перед запуском теста скорости вы должны проверить, есть ли у вас уже настроенные и запущенные на вашем сайте WordPress следующие две вещи:

1. Кэширование
2. Сеть доставки контента

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

1. Настроить кэширование

Если вы являетесь клиентом Kinsta, наш кеш страницы на уровне сервера уже будет запущен на вашем действующем сайте WordPress. Так что настраивать нечего. Однако помните, что кеширование отключено в наших промежуточных средах по умолчанию для целей разработки и отладки. Чтобы включить кеширование в промежуточной среде, вы можете переключить кнопку «Включить кэш» на странице инструментов вашего сайта в MyKinsta.

Мгновенное сокращение времени загрузки на 37% после перемещения @WPColt в @kinsta! (БЕЗ ПЛАГИНОВ КЭШЕНИЯ) 🚀🚀🚀

— WPColt (@WPColt) 3 января 2018 г.

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

2. Включение сети доставки контента (CDN)

Если вы не знаете, что такое сеть доставки контента, вам следует сначала прочитать наш подробный пост о том, почему вам следует использовать CDN WordPress.В 99,9% сценариев это окажет огромное влияние на скорость вашего сайта. В зависимости от местоположения центра обработки данных, в котором размещен ваш сайт, и местоположения ваших посетителей, мы заметили, что CDN сократил время загрузки более чем на 50%!

Если вы клиент Kinsta, мы включаем бесплатную полосу пропускания CDN во все наши планы хостинга. Вы можете включить Kinsta CDN в два простых шага.

Шаг 1

Сначала войдите в личный кабинет MyKinsta. Нажмите на свой сайт, а затем на вкладку CDN.

Kinsta CDN

Шаг 2

Затем нажмите «Добавить зону». Через несколько минут CDN будет автоматически развернут, и ваши ресурсы будут обслуживаться из кеша по всему миру. Вот и все.

Включить Kinsta CDN

Если вы используете Cloudflare или заинтересованы в нем, у нас есть подробное руководство о том, как установить Cloudflare на ваш сайт WordPress, и этот пост о наиболее оптимальных настройках. Мы также рекомендуем ознакомиться с нашим сравнением Kinsta CDN и Cloudflare и нашим руководством по автоматической оптимизации платформы CloudFlare.

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

Как правильно запустить тест скорости веб-сайта

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

Место проведения теста скорости имеет значение

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

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

Что бы вы ни делали, будет соответствовать выбранному вами месту .

Вы должны тестировать несколько раз

Мы не будем углубляться в кеширование в этой статье, но просто помните, что именно это делает ваш сайт WordPress загружаемым очень быстро (как кэширование с вашего хоста WordPress или плагина, так и с вашего CDN).

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

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

У нас есть сайт разработки, созданный в Kinsta с включенной Kinsta CDN. Сначала мы протестировали его через Pingdom и получили следующий результат.

Тест скорости

Если вы посмотрите на пример ниже, первый запрос направлен к основному домену, и он загружается непосредственно с сервера Kinsta. Ниже вы можете увидеть, что остальные запросы загружаются из Kinsta CDN (xxxx.kinstacdn.com).

Если вы посмотрите на запрос к серверу Kinsta , вы увидите заголовок под названием x-kinsta-cache .Когда он еще не работает из кеша, он зарегистрирует MISS . Название этого заголовка может незначительно отличаться в зависимости от вашего хостинг-провайдера.

Сеть Kinsta CDN запрашивает ниже, аналогичным образом. Найдите заголовок под названием x-cache . Когда он еще не работает из кеша, он зарегистрирует MISS . Опять же, название заголовка может незначительно отличаться в зависимости от вашего провайдера CDN. Например, когда вы используете Cloudflare, заголовок HTTP называется cf-cache-status .

Анализ скорости веб-сайта

Чтобы правильно протестировать скорость, вам нужно видеть, что все загружается из кеша (как с вашего хоста WordPress, так и с CDN). Когда это так, заголовки x-kinsta-cache и x-cache зарегистрируют HIT (как показано ниже). Этот обычно требует многократного выполнения теста скорости . Мы обнаружили, что обычно магическим числом является два или три. Некоторые инструменты для проверки скорости, такие как Pingdom, также ограничивают время между каждым тестом (обычно парой минут).Так что вам, возможно, придется запустить тест скорости, вернуться позже, запустить его снова и т. Д.

Хост WordPress и кеш CDN

Также возможно, что ваш хост WordPress зарегистрирует HIT с кешем перед вашим CDN. Вы можете быстро просмотреть тест и найти большую желтую полосу. Это указывает на TTFB (время ожидания), которое действительно сильно возрастает, когда страница или ресурс не доставлены из кеша.

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

Тест скорости с кешем

Помимо запросов к вашему хостинг-провайдеру и CDN, у вас, скорее всего, также будут внешние запросы к таким вещам, как Facebook, Google Analytics, Google Fonts и т. Д. Устранение неполадок — это проблема на другой день. 😉 Ознакомьтесь с нашей публикацией о том, как определять и анализировать внешние службы на вашем сайте WordPress, нашим полным руководством по Pingdom и нашим подробным руководством о том, как изменить шрифт в WordPress.

Подпишитесь на информационный бюллетень

Хотите узнать, как мы увеличили наш трафик более чем на 1000%?

Присоединяйтесь к 20 000+ других, которые получают нашу еженедельную рассылку с инсайдерскими советами по WordPress!

Подпишитесь сейчас

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

1. Пингдом
2. Google PageSpeed ​​Insights
3. Инструмент проверки скорости веб-сайта Google для мобильных устройств
4. Скорость сайта Google Analytics
5. WebPageTest
6. GTMetrix
7. Тест скорости веб-сайта KeyCDN
8. DareBoost
9. Анализатор веб-страниц
10. Y Медленная
11. Инструменты разработчика Chrome
12. Ударная нагрузка
13. Реликвия сайта
14. дотком-монитор
15. Новая реликвия

Одна из самых важных вещей, когда дело доходит до тестирования скорости веб-сайта, — выбрать один инструмент и придерживаться его .У каждого свой набор различных показателей, поэтому вы не можете сравнивать результаты тестирования одного инструмента с другим. Не существует правильного или неправильного инструмента, вы должны просто сосредоточиться на улучшении. Гэри Иллис, аналитик трендов для веб-мастеров из Google, хорошо подводит итог.

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

— Гэри 鯨 理 ／ 경리 Illyes (@methode) 12 июля 2018 г.

1. Pingdom

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

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

Инструмент для проверки скорости веб-сайта Pingdom

Pingdom также дает вам рейтинг скоростных характеристик из 100 возможных. Этот рейтинг разбит на двенадцать критериев, каждому из которых присваивается индивидуальная оценка. Опять же, это полезно для определения « быстрых побед », на которые вы можете нацелиться, чтобы мгновенно и ощутимо повысить скорость вашего сайта. Можно набрать 100 баллов. Однако не стоит слишком зацикливаться на оценках, поскольку они не так важны, как простое улучшение вашего сайта для его ускорения.

Pingdom хранит результаты всех тестов, выполненных на вашем веб-сайте, что позволяет вам исторически отслеживать улучшения скорости с течением времени.

2. Google PageSpeed ​​Insights

Google с 2010 года заявляет, что скорость страницы является важным фактором ранжирования для SEO. Чтобы помочь вам повысить скорость вашего сайта, у Google есть собственный инструмент тестирования скорости, Google PageSpeed ​​Insights, который измеряет производительность страницы для мобильных и настольных устройств.

Инструмент Google PageSpeed ​​Insights

Рейтинг PageSpeed ​​составляет от 0 до 100 баллов и основан на Lighthouse.Чем выше оценка, тем лучше, а оценка 85 или выше указывает на то, что страница работает хорошо. На странице отчета представлена ​​полезная разбивка шагов, которые можно предпринять для повышения производительности. PageSpeed ​​Insights также предоставляет вам дополнительные предложения по работе с мобильными устройствами. Ознакомьтесь с нашими мыслями о том, можно ли набрать 100/100 баллов на PageSpeed ​​Insights.

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

3. Инструмент проверки скорости веб-сайта Google для мобильных устройств

По данным Google, люди в 5 раз чаще покидают сайт, если он не оптимизирован для мобильных устройств. Вот почему они выпустили свой инструмент для тестирования скорости мобильного сайта. Этот инструмент на самом деле основан на Google PageSpeed ​​Insights и больше ориентирован на маркетологов и агентства, чтобы лучше предоставлять простые для понимания отчеты по оптимизации.

Инструмент для проверки скорости веб-сайта Google Mobile

Вы можете получать отчеты прямо на вашу электронную почту или переслать информацию своему веб-мастеру или разработчику.Однако помните, что оценка 100/100 может быть возможна не во всех сценариях, в зависимости от того, как настроен ваш сайт WordPress. Имея множество многоцелевых тем и сайтов с десятками внешних скриптов, у вас просто будет почти невозможное время, пытаясь достичь наивысшего результата. Что совершенно нормально. И точно не по вине разработчика.

4. Скорость сайта Google Analytics

Google Analytics также может измерять скорость сайта. Он находится на панели инструментов GA в меню «Поведение».Он собирает информацию с помощью фрагмента кода, включенного в веб-страницу. В их отчетах о скорости сайта измеряется три аспекта задержки:

.

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

Тайминги скорости сайта Google Analytics

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

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

5. WebPageTest

WebPagetest был создан Патриком Минаном, инженером Chrome в Google. Это проект с открытым исходным кодом, который позволяет запускать бесплатный тест скорости веб-сайта из разных мест по всему миру с использованием реальных браузеров (IE, Chrome и т. Д.).Это отличный инструмент для более опытных пользователей, которым необходимо получить дополнительные данные из тестов скорости.

WebPageTest

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

6.GTmetrix

GTmetrix — еще один популярный инструмент для анализа скорости и, возможно, самая известная из всех альтернатив Pingdom. Он прост в использовании, и новички могут быстро освоить его. Инструмент обеспечивает всесторонний анализ, сочетая производительность и рекомендации, предоставленные Google PageSpeed ​​Insights и YSlow. Это означает, что GTmetrix представляет собой универсальный магазин для всех ваших потребностей в оптимизации скорости.

Инструмент для проверки скорости веб-сайта GTmetrix

Чтобы упростить усвоение данных верхнего уровня, GTmetrix отображает сводку вверху страницы, в которой указано общее время загрузки страницы, размер страницы и количество запросов.Инструмент также отображает список ваших запросов в виде каскадной диаграммы, что позволяет с легкостью определять проблемные области и узкие места. Также можно загрузить диаграмму водопада, чтобы вы могли провести дальнейший анализ.

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

Обязательно ознакомьтесь с нашим подробным руководством, в котором мы расскажем, как использовать инструмент проверки скорости GTmetrix.

7. Тест скорости веб-сайта KeyCDN

Бесплатный инструмент для проверки скорости веб-сайта

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

Инструмент для проверки скорости веб-сайта KeyCDN

Вы можете запустить как частный, так и общедоступный тест, в котором впоследствии можно будет поделиться или добавить в закладки для дальнейшего использования.Отчет с разбивкой показывает отличный обзор методов запроса (GET / POST), кодов состояния HTTP (например, 200 OK или 404), типов файлов, размера содержимого, времени ожидания / получения, общего времени загрузки и общего количества HTTP запросы, созданные на вашем сайте. KeyCDN также имеет другие бесплатные удобные инструменты веб-тестирования производительности, такие как Ping Test, HTTP / 2 Test, HTTP Check и Traceroute Tool.

8. DareBoost

DareBoost — это универсальный сервис для тестирования скорости веб-сайтов, мониторинга веб-производительности и анализа веб-сайтов (скорость, SEO, качество, безопасность).И хотя это в первую очередь услуга премиум-класса, вы можете использовать их инструмент проверки скорости веб-сайта для получения 5 бесплатных отчетов в месяц, за вычетом нескольких дополнительных функций для платных клиентов. Бесплатные отчеты действительно впечатляют!

Инструмент для проверки скорости веб-сайта DareBoost

В отчете о тестировании скорости DareBoost анализируется более 80 различных точек данных по следующим категориям:

• Политика кэширования
• Количество запросов
• Безопасность
• Доступность
• Соответствие
• Качество
• jQuery
• Отрисовка в браузере
• Объем данных
• SEO

Вы можете быстро увидеть, где ваш сайт WordPress испытывает трудности и нуждается в доработке.Отчетность по безопасности также очень уникальна по сравнению с другими инструментами, которые мы упомянули. Вы можете увидеть, например, что ваш веб-сайт подвергается атаке с использованием clickjacking, отсутствует заголовок политики безопасности контента и даже информация о вашем сертификате SSL. Их дизайн тоже довольно классный! Если вам нужен отчет для вашего босса или агентства, возможно, вам стоит попробовать этот инструмент.

Отчет об испытаниях скорости DareBoost

9. Анализатор веб-страниц

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

Анализатор веб-страниц

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

10. YSlow

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

Yahoo! команда определила 34 фактора, которые влияют на скорость веб-сайта. К сожалению, только 23 могут быть протестированы количественно, поэтому инструмент фокусирует свой анализ на этих областях — на веб-сайте YSlow перечислены эти 23 «правила» с расширенными деталями, которые стоит проверить.После завершения анализа YSlow поставит вам оценку по каждой области — от A до F. Это упрощает определение ваших более слабых областей, на которые вы можете ориентироваться для самых больших шагов вперед с точки зрения скорости сайта.

Раньше это был самый популярный инструмент для тестирования скорости. Но, к сожалению, проект YSlow больше не поддерживается. Их последний коммит был 2 года назад, и на их странице GitHub более 100 открытых проблем. Тем не менее, есть еще некоторая полезная информация, которую предоставляет расширение, но мы рекомендуем использовать более новый и активно поддерживаемый инструмент проверки скорости веб-сайта.

11. Инструменты разработчика Chrome

Сетевая панель Chrome DevTools является частью Chrome. Это очень популярный инструмент среди разработчиков, поскольку он легко доступен и отлично подходит для локальной отладки и тестирования. Вы можете легко запустить сетевую панель в Chrome, нажав Command + Option + I (Mac) или Control + Shift + I (Windows, Linux). Затем вы можете сгенерировать каскадный анализ своего сайта и проанализировать эффективность каждого из ваших активов.

Chrome DevTools, сетевой водопад

Еще одна замечательная функция, добавленная в Chrome 60, — это возможность блокировать запросы.Это может быть очень полезно при попытке определить, сколько накладных расходов сторонняя служба или скрипт несет на вашем сайте.

Запрос блокировки в Chrome Devtools

Команда Google также интегрировала Lighthouse в Chrome Devtools. Lighthouse — это автоматизированный инструмент с открытым исходным кодом для улучшения качества веб-страниц. У него есть аудит производительности, доступности, прогрессивных веб-приложений и многого другого. Вы можете запустить его на вкладке «Аудит». Он имеет аналогичную систему оценок 0 из 100. Вы можете погрузиться в свои запросы, посмотреть, какие скрипты могут блокировать рендеринг, экономить на сжатии изображений и т. Д.Затем вы можете легко поделиться ссылкой с другими.

Аудит веб-производительности Chrome Devtools

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

12. Ударная нагрузка

Load Impact — один из лучших инструментов для тестирования масштабируемости вашего сайта. Они предлагают бесплатный тест производительности веб-сайта (5 отчетов в месяц), анализирующий последствия наличия 25 одновременных пользователей на вашем веб-сайте и влияние этого скромного трафика на скорость на сайте.

Ударная нагрузка

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

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

Хотите больше? Load Impact удобно отображает статистику верхнего уровня, такую ​​как использование полосы пропускания, сделанные запросы и количество запросов в секунду. Если вам нужны дополнительные данные, подумайте о переходе на один из премиальных планов Load Impact — это позволяет вам проверить влияние гораздо большего количества одновременных пользователей.Премиум-планы доступны от 89 долларов в месяц.

13. Реликвия Зоны

Site Relic — еще один полностью бесплатный инструмент для проверки скорости веб-сайта, который появился недавно. Это позволяет вам легко проверить время загрузки вашего сайта как на мобильном, так и на настольном ПК в 9 различных регионах. Вы также можете просматривать свой TTFB сразу во всех регионах.

Реликвия сайта

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

Тест скорости Site Relic

14. дотком-монитор

dotcom-monitor имеет множество бесплатных и полезных инструментов. Одним из них является их инструмент для проверки скорости веб-сайта. Он позволяет мгновенно проверить скорость вашего сайта в 25 точках по всему миру. Вы можете выбирать между различными браузерами, такими как Internet Explorer, Firefox, Chrome, iOS, Android, Windows Phone и Blackberry.

тест скорости сайта dotcom-monitor

Их отчет о веб-производительности включает:

• Сводка по местонахождению
• 10% самых быстрых элементов
• 10% самых медленных элементов
• Подробная карта водопадов
• Разбивка по элементам хоста, включая DNS, соединение, SSL, запрос, первый пакет и загрузку
• Проверка и диагностика ошибок

15.Новая Реликвия

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

Новая реликвия

На самом деле мы используем два продукта New Relic здесь, в Kinsta, для мониторинга времени безотказной работы и производительности, и это их продукты для мониторинга приложений и синтетические продукты.

раз веб-транзакций New Relic

Одна особенно полезная функция — это раздел плагинов WordPress. Вы можете сразу увидеть, какие плагины и темы имеют наибольшее время отклика.

Время отклика плагина WordPress в New Relic

Если ваш веб-сайт начинает замедляться, вы можете легко увидеть это с помощью New Relic и получить уведомление, чтобы вы могли немедленно принять меры, чтобы узнать, что может быть причиной проблемы. Это также включает просмотр внешних сервисов или рекламных сетей, которые могут замедлять работу вашего сайта.New Relic стал для нас отличным инструментом, гарантирующим, что мы обеспечиваем лучшую поддержку нашим клиентам WordPress.

New Relic внешние сервисы

Скорость веб-сайта важна. 🚀 Чем быстрее это будет, тем выше ваши шансы на успех.Нажмите, чтобы твитнуть

Сводка

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

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

Какие инструменты вы используете для измерения скорости веб-сайта? Делитесь ими в комментариях ниже!

---

Если вам понравилась эта статья, то вам понравится хостинговая платформа Kinsta WordPress. Ускорьте свой сайт и получите круглосуточную поддержку от нашей опытной команды WordPress. Наша инфраструктура на базе Google Cloud ориентирована на масштабируемость, производительность и безопасность.Позвольте нам показать вам разницу в Kinsta! Ознакомьтесь с нашими тарифами

Тест скорости веб-сайта — проверка производительности веб-сайта

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

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

Мы намеревались создать идеальный инструмент для проверки скорости веб-сайта и помощи веб-мастерам и веб-разработчикам в проверке производительности веб-сайта.

И мы сделали это!

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

Скорость веб-сайта влияет на ваш бизнес

• 8% на меньше просмотров страницы после 3-секундной задержки.
• 16% снижение удовлетворенности клиентов после задержки в 1 секунду.
• 32% — вероятность отказов после 3-секундной задержки загрузки страницы.
• 40% ваших клиентов покинут сайт, если страница загружается дольше 3 секунд.

Почему скорость загрузки веб-сайта имеет значение

Исследование Google показывает, что время загрузки страницы с 1 до 5 увеличивает вероятность отказа на 107%. Давайте посмотрим, что влияет на скорость загрузки сайта и почему вам следует уменьшить время отклика сервера.Но сначала нужно проверить скорость страницы.

1. Привлекайте больше клиентов — скорость также важна для загрузки сайта с мобильного устройства. Большинство современных пользователей посещают веб-сайты именно со смартфонов, и вам следует позаботиться о том, чтобы охватить эту аудиторию потенциальных клиентов.
2. Повысьте удобство использования сайта — сложный код страницы приведет к более медленной загрузке. Оставьте громоздкие сайты в прошлом и займитесь оптимизацией кода своего сайта. Поверьте, вы сможете значительно ускорить работу своего сайта.
3. Удержать пользователей — этого недостаточно, чтобы привлечь внимание клиента, потому что его все равно нужно удерживать. Учтите, что если страницы вашего сайта загружаются быстро, то шансы, что пользователь покинет ресурс, в разы уменьшаются. Обратите внимание, что вам тоже не нравятся медленные сайты!
4. Получите больше конверсий — чем быстрее загружается ваш ресурс, тем больше конверсий вы можете получить от покупателей, которые не покинули ваш сайт после просмотра первой страницы.

Хотите узнать, почему ваша страница медленная? Воспользуйтесь нашим инструментом проверки скорости загрузки сайта

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

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

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

Советы по поиску и устранению неисправностей

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

Сравните скорость страницы в Chrome, Firefox и IE

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

Проверьте скорость своего сайта из разных городов мира

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

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

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

Оптимизация сервера

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

Оптимизация клиентов

Вот несколько универсальных советов, которые помогут ускорить работу любого ресурса. В первую очередь обратите внимание на эти факторы.

Наконечники	Пояснение
Оптимизация веб-шрифтов	стоит уменьшить объем трафика шрифтов на вашем сайте.Для этого используйте WOFF2 для современных браузеров. Используйте только популярные форматы, латиницу и кириллицу. Предварительная загрузка позволит вам уведомить ваш браузер, когда загружать файл шрифта. Функция отображения шрифтов обеспечивает гибкий способ управления поведением браузера в случае задержки файла;
Оптимизация изображений	загрузка тяжелых изображений приводит к тому, что сайт становится намного медленнее. Можно использовать специальные программы, которые уменьшат размер картинки. Кроме того, такие сервисы приведут к сжатию без потери качества, поэтому ваши пользователи даже не заметят разницы.Воспользуйтесь этими услугами по оптимизации, чтобы страницы вашего сайта загружались как можно быстрее за счет уменьшения размера изображений на страницах вашего сайта;
Сжатие данных	, как мы упоминали ранее, код вашей страницы должен быть максимально простым и оптимизированным. Уберите громоздкие конструкции, замените их более простыми вариантами. Помните, что сжатие данных вашего сайта ускорит работу ресурса и не потеряет потенциальных клиентов. Используйте статическое сжатие, чтобы сервер предоставлял пользователям последнюю сжатую версию вашего сайта

Использование CDN

Применение CDN — это рекламируемая мера для ускорения вашего ресурса.Не упустите возможность улучшить производительность своей платформы прямо сейчас!

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

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

Наталия Фиалковская

SEO специалист

Наталия — SEO-эксперт Sitechecker. Она отвечает за блог. Невозможно жить без создания ценного контента о SEO и цифровом маркетинге.

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

Одна из основных задач для блоггеров, малого бизнеса, некоммерческих организаций, персональный веб-сайт — это « Время загрузки страницы ».

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

Никто не любит медленный веб-сайт.

Ускорение веб-сайтов имеет важное значение. « Интернет должен быть быстрым » (говорит Google). Google включил скорость сайта в поисковый рейтинг. Насколько быстро ваш сайт загружается в браузере на компьютере и мобильном браузере?

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

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

• Время, затраченное на загрузку страницы
• Размер страницы
• Количество запросов на загрузку страницы
• Y Оценка медленной скорости
• Оценка PageSpeed ​​
• График водопада

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

Uptrends позволяет быстро проверить производительность вашего сайта и предоставить следующие важные показатели.

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

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

• Сингапур
• Амстердам
• Берлин
• Франкфурт
• Лондон
• Лос-Анджелес
• Нью-Йорк
• Сидней
• Париж

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

Как вы можете видеть выше, у вас есть возможность протестировать на настольном и мобильном устройствах из Chrome, Firefox, IE и Phantom JS.

Дотком-Монитор

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

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

Sematext

Sematext Synthetics — это интуитивно понятный, простой в использовании и надежный инструмент мониторинга, который отслеживает доступность ваших API-интерфейсов и веб-сайтов из разных мест по всему миру, измеряет производительность на разных устройствах и в браузерах и выявляет проблемы со сторонними ресурсами.

Вы можете использовать Sematext Synthetics для измерения более 25 показателей производительности веб-сайта, включая самые важные:

• Core Web Vitals
• Скорость страницы и время загрузки
• Количество запросов
• Размеры страницы
• Время до первого байта
• Первая значимая краска
• HTTP-заголовки
• Водопад запроса

Начните работу с Sematext за считанные минуты и получите доступ ко всем функциям, а когда будете готовы, вы сможете выбрать один из трех различных тарифных планов.Есть дешевый план с оплатой по мере использования, который начинается от 2 долларов в месяц, стандартный план — 29 долларов в месяц, а профессиональный — 99 долларов.

Аудит сайта

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

Geekflare Website Audit работает на платформе Google Lighthouse, чтобы протестировать сайт по более чем 40 показателям производительности и лучшим практикам. Вы можете выбрать проверку с настольного компьютера или мобильного телефона.

Некоторые из основных протестированных показателей:

• Время загрузки первого байта
• Время полной загрузки
• HTTP / 2
• Количество запросов и размер страницы
• Минимизация ресурсов
• Сжатие
• Размер изображения
• Интерактивный водопад запросов

и многое другое…

СУКУРИ

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

SUCURI имеет другой инструмент тестирования Security Scan, который вам тоже может понравиться.

GTMetrix

Gtmetrix использует Google Page Speed ​​и Yahoo! Yslow для оценки производительности вашего сайта и предоставляет подробные сведения о запросе в каскадной диаграмме, чтобы вы могли видеть, какой запрос требует настройки.

По умолчанию запускается тест из Канады; однако, если вы сделаете бесплатную регистрацию, вы сможете запустить сканирование из Далласа, Гонконга, Лондона, Мумбаи, Сиднея, Сан-Паулу.

Пингдом

Pingdom позволяет выбрать тест из следующего места.

• Мельбурн
• Нью-Йорк
• Сан-Хосе
• Швеция
• Техас

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

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

Тест веб-страницы

Web page Test — один из самых популярных инструментов для оценки производительности веб-сайтов, позволяющий запускать тест из разных мест по всему миру.

В каждой локации есть один или несколько браузеров (Chrome, IE, Firefox и т. Д. Охватывают широкий диапазон тестирования.

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

• Время, затраченное на загрузку первого представления
• Время, затрачиваемое на загрузку при повторном просмотре
• Распределение контента по запросу / типу
• Время завершения документа
• Время полной загрузки
• Время первого байта
• Вид на водопад
• Вид подключения
• Запросить детали и заголовки
• CDN подробности

Веб-сайт Pulse

WebSite Pulse позволяет запустить тест из Нью-Йорка, Мюнхена и Мельбурна.

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

• Статус запроса
• Время подключения
• Время первого байта
• Время последнего байта
• Размер запроса

Площадка 24 × 7

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

С помощью Site 24×7 вы можете выбрать для тестирования более 60 точек по всему миру.

Dareboost

Выполняйте углубленный анализ из разных мест с помощью настольных или мобильных браузеров. Dareboost позволяет бесплатно тестировать до пяти сайтов в месяц.

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

Заключение

Я надеюсь, что вышеуказанные БЕСПЛАТНЫЕ инструменты дадут вам представление о том, сколько времени требуется для загрузки вашей веб-страницы по всему миру.

Если он загружается менее чем за 3 секунды, то молодец !

Если нет, то вы можете поработать над очками улучшения. Один из самых быстрых способов повысить производительность сайта — использовать высокопроизводительные CDN, такие как Cloudflare или SUCURI. Платформа хостинга также играет жизненно важную роль.

10 лучших бесплатных инструментов для проверки скорости веб-сайтов на 2021 год

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

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

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

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

Эти инструменты постоянно меняются и обновляются. Итак, 10 лучших бесплатных инструментов для тестирования скорости веб-сайтов 2020 года будут включать в себя несколько новых фаворитов!

Среди лучших бесплатных инструментов для тестирования скорости веб-сайтов в 2019 году — GTmetrix.Этот тестер невероятно прост. Вы просто вводите свой URL и нажимаете «Анализировать». Сильные стороны GTmetrix:

• Общий интерфейс невероятно прост в использовании. Его UX-дизайн прост в использовании и вызывает доверие.
Значения скорости страницы
• даются с контекстом (например, время полной загрузки сравнивается со средним показателем в Интернете 6,7 секунды). Иногда приятно знать, как у вас дела по сравнению с остальной частью Интернета!
Оценки
• разбиты по типам, то есть, если вы не слишком хорошо знакомы с веб-разработкой, вы все равно можете определить, исходят ли проблемы в основном из вашего CSS, Javascript (узнайте о минимизации файлов CSS и JavaScript здесь) или серверной среды, Например.

Вердикт: GTMetrix действительно предлагает обновление уровня Pro, которое, помимо других преимуществ, предоставляет доступ к настройкам страницы, мониторингу и оповещениям. Но сам тест бесплатный, и вы можете легко загрузить данные. GTmetrix — это , также очень удобный , что делает его одним из лучших инструментов для скорости загрузки страниц в 2019 году.

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

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

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

По сравнению с другими 9 записями в этом списке, Google PageSpeed ​​Insights не предоставляет много данных или предложений по устранению проблем.На самом деле, это не совсем настоящий инструмент для проверки скорости страницы . Но есть несколько причин, по которым все же стоит попробовать этот инструмент, созданный Google:

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

Вердикт: Если бы это не был официальный инструмент Google, PageSpeed ​​Insights мог бы не входить в этот список. У него просто нет всех функций, которые есть у других инструментов из нашего списка. Но вы определенно захотите проверить, как Google оценивает скорость вашей страницы, если вы хотите получить высокий рейтинг на их поисковой платформе.В этом случае авторитет инструмента затмевает его полезность.

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

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

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

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

Но Dareboost тоже немного хитрый. Если вы уже использовали эту службу один раз, вам нужно будет зарегистрировать бесплатную учетную запись, чтобы продолжать ее использовать. Обычно оно того стоит; но не удивляйтесь, если вы вернетесь к Dareboost и вам нужно будет создать имя пользователя. Тем не менее, Dareboost определенно предлагает несколько интересных функций:

• Отличная разбивка данных на визуальные представления.Как только вы узнаете, что означают все данные (Dareboost предоставляет несколько щедрых и легко читаемых объяснений), вы действительно сможете увидеть свой прогресс.
• Dareboost также имеет видео разбивку вашего процесса загрузки. Это может показаться немного глупым, но может быть очень полезно увидеть, что видит ваш пользователь при загрузке вашей веб-страницы. Вы можете замедлить даже замедлить видео, чтобы действительно увидеть порядок загрузки (или порядок рендеринга).

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

Современные веб-сайты перегружены изображениями. А поскольку так много людей используют дисплеи высокой четкости и сетчатые экраны, очень трудно обойтись без изображений с низким разрешением. Вот почему сжатие изображений стало повсеместным. И для тестирования этих изображений я рекомендую инструмент анализа изображений для проверки скорости веб-сайта на базе Cloudinary. Этот инструмент:

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

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

Я уже упоминал, что скорость страницы — невероятно важный фактор в том, как Google оценивает ваш сайт. SEO Site Checkup — отличный инструмент, который позволяет вам определять скорость страницы, одновременно анализируя другие факторы поисковой оптимизации. Мне нравится SEO Site Checkup, потому что:

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

2019 Вердикт: SEO Site Checkup — жизненно важный инструмент для любого профессионала в области веб-маркетинга.После выполнения этой диагностики вы сможете лучше определить, куда направить ресурсы и время, чтобы наилучшим образом повысить производительность своей веб-страницы.

Часто скорость вашей страницы определяется не только HTML, Javascript и CSS, которые вы реализовали в интерфейсе. Во многих случаях ваша серверная среда или ваш хост могут иметь прямое влияние на скорость вашей страницы. Инструмент Site 24 x 7 Webpage Analyzer разработан специально для:

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

Вердикт: Site 24 x 7 Webpage Analyzer не так надежен, как многие другие инструменты из этого списка. Но встроенная интеграция с другими системными администраторами может сделать его хорошим дополнением к целостному, доменному подходу к тестированию скорости страницы.

Дотком-инструменты.com предлагает невероятно надежный и тщательный инструмент для тестирования скорости страницы. Большинство других инструментов тестирования скорости страницы будут тестировать только из одного места за раз. Но тест скорости веб-сайта от Dotcom-tools.com проверяет скорость страницы в 24 местах, включая ваше (или как можно более близкое к вашему).

• Наблюдая за тем, как время загрузки меняется от местоположения к местоположению, вы можете увидеть, как разные пользователи воспринимают ваш веб-сайт по всему миру.
• Знание, откуда на самом деле происходит большинство ваших пользователей, может помочь вам контекстуализировать информацию, предоставляемую тестом скорости веб-сайта; рассмотрите возможность сопоставления этих данных, например, с данными из Google Analytics.
• Тест скорости веб-сайта Dotcom-tools.com также предоставляет подробные диаграммы водопада, чтобы вы могли точно увидеть порядок, в котором загружается ваша веб-страница.

Вердикт: Инструмент проверки скорости веб-сайта Dotcol-tools.com — отличный выбор, если вас в первую очередь интересует , анализирующий, как разные пользователи в разных географических регионах воспринимают ваш веб-сайт .

Сайт Uptrends определенно не сутулится в отделе дизайна.Если вам нужен инструмент для тестирования скорости, который будет хорошо выглядеть, когда вы сделаете снимок экрана и отправите его клиенту, UpTrends определенно будет хорошим вариантом. Этот инструмент для тестирования веб-страниц:

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

Вердикт: UpTrends — хороший, хорошо продуманный инструмент для тестирования скорости страницы. Он не предоставляет много функций, недоступных где-либо еще, но может быть хорошим вариантом для клиентов.

Развивайте свою скорость, выигрывайте гонку

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

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

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

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

Похожие сообщения

15 лучших инструментов для измерения скорости веб-сайта или приложения

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

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

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

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

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

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

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

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

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

Самое замечательное в Uptrends — это то, что вы можете выбрать из более 35 различных мест при проведении теста скорости.Окончательный отчет дает вам как оценку по группам доменов, так и каскадную разбивку (каскадные диаграммы позволяют визуально увидеть совокупный эффект последовательно вводимых положительных и отрицательных значений). Затем отчет о группах доменов более подробно описывает ресурсы, разбивая их на разные категории (например, социальные сети, реклама, сторонние ресурсы и т. Д.).

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

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

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

Компания Uptrends, позиционирующая себя как самый мощный в мире инструмент для мониторинга веб-сайтов, поставляется с 30-дневной бесплатной пробной версией. Помимо мониторинга производительности веб-сайта, они также предлагают мониторинг самого веб-сайта, веб-приложений, веб-сайтов на мобильных устройствах и внутренних / внешних серверов.В целом, Uptrends — надежный инструмент, предлагающий аналитические данные на основе местоположения, детальное измерение производительности и обеспечивающий использование различных интернет-протоколов (включая HTTP, DNS и SQL).

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

Согласно странице Github, perftool — это «пакет npm, который используется для отображения информации о веб-страницах: оценка Google PageSpeed ​​Insights, ошибки HTML, информация о том, как исправить проблемы с производительностью, количество ресурсов CSS и т. Д.».

Преимущество PerfTool в том, что он объединяет три источника данных в один. Существует Google PageSpeed ​​Insights (обсуждается ниже), который проверяет базовую производительность сайта, Devperf для предоставления статистики и W3CJS для проверки HTML (проверяет код, чтобы убедиться, что он правильный).

PerfTool предлагает более 200 различных индикаторов производительности, включая такие вещи, как статистика на странице, рекомендации, количество ресурсов, время загрузки и ошибки в коде. Вы можете протестировать несколько страниц одновременно, получив отчет PageSpeed. Имея эту информацию, вы можете сравнить текущую производительность с прошлыми или установить контрольную оценку.

PerfTool особенно полезен, если вы тестируете весь сайт сразу, так как вам не нужно тестировать его страницу за страницей.Помимо Perftool, разработчики Devbridge также публикуют руководство по стилю, чтобы помочь пользователям создавать визуальные библиотеки своего бренда, делиться ими и автоматизировать их. Девбридж ранее работал с AON, Fitch Ratings, Mazak, Чикагским институтом искусств и kCura.

KeyCDN предлагает удивительно быстрый и легкий тест производительности с большим количеством деталей. На выбор предлагается около 14 различных местоположений, и у вас есть выбор сделать свои результаты общедоступными или личными. Отчеты, которые разрабатывает KeyCDN Speed ​​Test, включают разбивку по водопаду и предварительный просмотр веб-сайта.

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

Тест скорости

KeyCDN поддерживает HTTP / 2, что делает его одним из наиболее продвинутых инструментов для повышения производительности веб-сайтов. HTTP / 2 — это расширенная версия HTTP, опубликованная в 2015 году. Кроме того, тест скорости предлагает оптимизацию TCP. TCP или протокол управления передачей — это набор протоколов, которые регулируют отправку пакетов данных в Интернете. KeyCDN Speed ​​Test также имеет 100% покрытие для SSD (твердотельных накопителей), а это означает, что инструмент может тестировать практически на чем угодно.

Помимо HTTP / 2, тест скорости включает защиту источника, RESTful, состояние в реальном времени и мгновенную очистку.Глобальная сеть, которую KeyCDN использует, встроенную в IP Anycast и маршрутизацию, имеет высокую задержку, что означает хорошую производительность, масштабируемость и скорость. Сеть, как упоминалось ранее, идеально подходит для игр и доставки программного обеспечения, а также для рекламы, различных типов веб-сайтов и систем управления контентом (например, WordPress).

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

Прелесть dotcom-monitor заключается в том, что он обеспечивает тестирование из 25 разных мест и в семи разных браузерах. Вы даже можете запускать все глобальные тесты одновременно. С другими инструментами вы можете запускать их только индивидуально из каждого места.После завершения теста вы можете выбрать отдельные отчеты для анализа водопада.

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

Услуга полностью бесплатна и даже позволяет проводить тестирование с помощью облачных сервисов (например, вы можете протестировать свой сайт на Amazon, США, восток) и национальных межсетевых экранов (например, Великого китайского файрвола). Команда dotcom-monitor постоянно разрабатывает новые инструменты, поэтому кажется, что этот инструмент сможет сделать даже больше.

Прямо сейчас отчеты позволяют вам круглосуточно отслеживать эффективность вашего сайта и получать сводные данные по местоположению. Вы можете определить 10% самых быстрых и самых медленных элементов, используя информацию, представленную на легко читаемой диаграмме водопада.Как упоминалось ранее, отчеты также содержат разбивку по хостам. Сюда входят DNS, SSL, первый пакет, соединение, загрузка и т. Д.

DNS или система доменных имен — это, по сути, телефонная книга Интернета, позволяющая искать любое подключенное к ней устройство, в то время как SSL или Secure Socket Layer — это основная технология безопасности в Интернете, обеспечивающая шифрование между отправкой и получением данных.

Кроме того, инструмент позволяет проверять наличие ошибок и выполнять диагностику. Вы можете проверить подключение к сети с помощью теста ping, который измеряет доступность и время отклика в сети.Это позволяет еще быстрее диагностировать ошибки. Компания dotcom-monitor из Миннеаполиса, штат Миннесота, в настоящее время работает над новой платформой для нагрузочного тестирования, чтобы предоставить пользователям еще больше функциональных возможностей.

Разработанный Патриком Секстоном (человеком, стоящим за местной службой листинга Moz Local), Varvy Pagespeed Optimization — это инструмент, который предоставляет отчеты в пяти разделах. Это доставка CSS, проблемы со скоростью страницы, схемы ресурсов, службы и использование JavaScript. Используя всю эту информацию, сайт предоставляет графическое представление того, что можно оптимизировать (например,g., блокировка рендеринга). Целый раздел сайта Pagespeed посвящен SEO, и есть бесчисленное множество полезных советов о том, как сделать ваш сайт более дружественным к SEO.

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

Также есть инструкции по сокращению времени ответа сервера, включению сжатия, включению сохранения активности, минимизации перенаправлений, установлению приоритетов для видимого контента, оптимизации доставки CSS, CDN, предотвращению неверных запросов, отложению JavaScript, минимизации запросов DNS и многому, многому другому.Каждое руководство объясняется в простом, увлекательном стиле с помощью собственных маленьких диаграмм, которые помогут вам в дальнейшем.

Если вы новичок в мире webperf (производительность веб-сайтов), нет лучшего места для начала, чем Varvy. Одним из лучших аспектов сервиса является руководство по оптимизации для мобильных устройств. С тех пор, как в мае 2016 года Google увеличил силу сигнала ранжирования, удобного для мобильных устройств, все большее внимание уделялось доступности мобильных сайтов. Чтобы ваш сайт оставался конкурентоспособным на смартфоне, вам обязательно стоит пройти через руководство Varvy по оптимизации для мобильных устройств.

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

Если ваша цель — быстро и безболезненно проверить производительность вашего веб-сайта, то PageScoring, вероятно, будет вашим лучшим выбором.Как и сами веб-сайты, эти инструменты производительности будут оцениваться по тому, насколько быстро они работают. Исследования показывают, что 50% всех посетителей веб-сайтов ожидают, что сайт загрузится за 2 секунды или меньше, а 40% покинут сайт, если загрузка займет более 3 секунд.

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

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

Еще один простой и быстрый инструмент — Sucuri Load Time Tester.Основываясь на всемирной сети поддержки и тестирования оборудования, Sucuri дает вашему сайту глобальный рейтинг от A до F. Он измеряет, сколько времени требуется пользователю для подключения к вашему сайту и сколько времени требуется для полной загрузки одной страницы. (то есть время до первого байта или TTFB).

Важно помнить, что использование CDN может повлиять на работу инструмента. С CDN время соединения, вероятно, будет низким. Вы не сможете широко использовать этот инструмент с точки зрения производительности, если ваш TTFB и общее время уже не на низком уровне.

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

Собственные серверы

Sucuri довольно высокопроизводительны, они построены в глобальной сети Anycast. (Anycast — это метод адресации и маршрутизации для сетей, в которых данные отправляются на узел в сети на основе близости, стоимости, работоспособности и других показателей).Sucuri предлагает быструю поддержку HTTP / 2, сжатие GZIP, оптимизированную конфигурацию и интеллектуальное кэширование.

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

Использование Sucuri Load Time Tester поможет повысить скорость кэширования и CDN; использование сети Sucuri защитит от распределенных атак типа «отказ в обслуживании», взломов и попыток грубой силы.В качестве дополнительного плюса вам не нужно ничего устанавливать, чтобы использовать Sucuri. Все, что вам нужно, это изменить DNS, который их команда поможет вам настроить.

Одним из лучших инструментов для тестирования производительности веб-сайтов является PageSpeed ​​Insights от Google. Инструмент настолько хорош, что многие другие инструменты в этом списке просто предоставляют информацию, взятую из PageSpeed. Сервис оценивает ваш сайт от 1 до 100, при этом все, что выше 85, считается хорошим. Есть настольная и мобильная версии инструмента.Вместе с отчетом об эффективности вашего сайта он также предоставляет рекомендации (например, по изменению изображений).

PageSpeed ​​измеряет две вещи: время до загрузки верхней части страницы (т. Е. Сколько времени требуется для загрузки верхней половины страницы) и время до полной загрузки страницы. В мобильных отчетах также есть инструмент взаимодействия с пользователем, который вы оцениваете вместе с конфигурацией области просмотра, соответствующими размерами шрифта и размерами для целей касания (например, кнопок и ссылок). Новый инструмент для проверки скорости в сервисе Think With Google представляет всю эту информацию в привлекательной форме.

PageSpeed ​​работает, получая URL-адрес домена дважды, по одному разу с настольного компьютера и мобильного агента. В результате сайт получает рейтинг из 100, на основании которого сайты делятся на «хорошие», «нуждающиеся в работе» и «плохие». В дополнение к настольной и мобильной версиям, PageSpeed ​​имеет расширение Chrome, которое позволяет вам тестировать любую страницу на вкладке «Скорость страницы разработчика».

В целом, Google PageSpeed ​​Insights дает полное представление о скорости сайта и о том, что вам нужно сделать, чтобы ее улучшить.Поскольку этот инструмент принадлежит Google, вы можете быть уверены, что он постоянно совершенствуется.

Стоит отметить одну вещь: этот инструмент дает вам оценку относительной производительности ваших сайтов на основе независимых от сети аспектов производительности страницы (HTML, внутренние и внешние ресурсы, конфигурация). Абсолютный показатель производительности ваших сайтов зависит от вашей локальной сети и состояния оборудования.

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

YSlow тестирует сайт в три этапа. Сначала он сканирует DOM (объектную модель документа, интерфейс приложения, который считывает HTML и другой веб-код для создания страницы), чтобы найти все элементы. Затем он получает информацию о каждом элементе. Наконец, он берет информацию и генерирует оценки по каждому правилу, в результате чего получается общая оценка.

Правила

Yahoo! Для высокопроизводительных веб-сайтов — это набор из 34 правил, влияющих на производительность веб-страниц. Они были разработаны командой исключительной производительности Yahoo !. YSlow использует 23 из этих правил в своем тестировании. Среди них — минимизация HTTP-запросов, использование сети доставки контента, создание внешних JavaScript и CSS, уменьшение количества запросов DNS, работа с несколькими браузерами.

Pingdom Speed ​​Test — один из наиболее известных инструментов в этом списке. Предоставляемый отчет разделен на четыре раздела: каскадная диаграмма, оценка производительности, анализ страниц и история.Анализ страницы далее делится на анализ размера, размера на домен, запросов на домен и типа контента с наибольшим количеством запросов.

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

Функция анализа страницы очень подробна. Он глубоко проникает в код ответа сервера и сообщает вам такие вещи, как скорость и состояние сайта. Из-за наличия разных локаций проблем с маршрутизацией практически нет. К тому же доступность тоже не проблема. Анализ страницы попадает в коды ответа HTTP-сервера (указывают скорость сайта, общее состояние).

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

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

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

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

Оценка содержания веб-сайта проходит по ключевым словам, заголовкам и альтернативному тексту изображений, чтобы сделать сайт более привлекательным. Отчеты включают разбивку ресурсов и советы по кодированию на HTML и CSS. Сюда входит помощь с классами / идентификаторами, тегами, временем до первого байта и анализом PageSpeed.Отчеты представлены с множеством ярких визуальных элементов данных и множеством отзывов о производительности.

Приложение очень простое в использовании и отзывчивое. Он работает на нескольких устройствах и платформах. Приложение адаптивно и доступно на множестве устройств. Онлайн-анализатор веб-сайтов Pagelocity — это работа румына Энди Гонге.

WebPageTest выполняет тест производительности на заданном веб-сайте в более чем 40 различных местах, в 25 браузерах, включая мобильные. Только эти цифры говорят вам, насколько полезной может быть эта услуга.Веб-сайтам дается оценка от A до F на основе времени до первого байта, сжатия, эффективного использования CDN и кеширования, а также других показателей.

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

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

Отчеты богаты и подробны, с диаграммами водопада, проверками PageSpeed ​​и многими полезными предложениями.

Google попадает в этот список дважды просто потому, что это Google. Встроенный анализатор производительности веб-сайтов на вкладке Chrome DevTools очень прост в использовании, но он также имеет множество дополнительных функций. Вы можете запускать DevTools в любое время (F12 или Ctrl + Shift + I в Windows, Cmd + Opt + I) в Chrome.Инструменты разработчика — это набор инструментов для веб-разработки и отладки, встроенных в Chrome.

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

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

Один из новейших инструментов повышения производительности веб-сайтов, предлагаемый Yellow Lab, предоставлен французским экспертом по webperf Гаэлем Метаисом. Инструмент Yellow Labs содержит много информации для пользователей, а также предоставляет множество уникальных функций.К ним относятся виды взаимодействия JavaScript с объектной моделью документа и различные проблемы проверки кода.

Окончательная глобальная оценка, которую дает Yellow Labs, основана на нескольких факторах: вес страницы, DOM, CSS, запросы, JavaScript и конфигурация сервера. Используя инструмент Yellow Labs, вы можете моделировать различные устройства (настольный компьютер, планшет, телефон), чтобы увидеть, как ваш сайт работает на каждом из них. Вы также можете выполнять различные виды тестов, включая интерфейсные (HTML, CS, JS), профилирование JS (для очистки кода JavaScript) и веб-производительность (проверка на соответствие лучшим отраслевым практикам).

Инструменты имеют открытый исходный код и работают путем отправки вашего сайта через PhantomJS. Это позволяет ему собирать показатели и статистику, которые затем дают вам ваш балл. Детали, которые предлагает инструмент разработчикам, позволяют им исправлять ошибки и оптимизировать сайт. Инструмент Yellow Labs полностью бесплатен.

GTmetrix — один из лучших на рынке инструментов для повышения производительности в сети. Он представляет собой очень подробную оценку, основанную на показателях PageSpeed ​​и YSlow. Итоговая оценка варьируется от F до A.Отчет о производительности GTmetrix разделен на пять разделов: PageSpeed, YSlow, водопадная диаграмма, видео и история. Вы можете протестировать свой сайт в семи разных местах всего за бесплатную регистрацию и выбрать между Chrome и Firefox.

Инструменты GTmetrix также позволяют тестировать различные типы подключений (кабельное, коммутируемое и т. Д.) И предлагают расширенные функции, такие как воспроизведение видео и поддержка Adblock. Воспроизведение видео позволяет вам точно увидеть, где возникают узкие места при загрузке вашего сайта, а функция Adblock позволяет увидеть, как ваш сайт ведет себя, когда на нем не отображается реклама.

С бесплатной учетной записью вы получаете еще больше возможностей. Перекрестно проверяя PageSpeed ​​и YSlow, вы можете увидеть полную историю времени загрузки вашего сайта. Кроме того, существует множество вариантов отчетности. Вы можете перенести всю историю тестов в файл CSV.

GTmetrix — один из наиболее часто используемых инструментов для повышения производительности веб-сайтов, на данный момент проанализировано более 222 000 000 страниц. Число растет каждую секунду. Компании, которые участвовали в GTmetrix, включают PayPal, Spotify, GoDaddy, Nike, HP, NBC и Nordstrom, среди прочих.

С GTmetrix у вас есть возможность контролировать свой сайт ежедневно, еженедельно, ежемесячно или даже (с GTmetrix Pro) ежечасно! Вы можете настроить оповещения по электронной почте на основе определенных условий (например, падение показателя PageSpeed ​​ниже определенного порога или время загрузки страницы, достигающее определенного значения и т. Д.).

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

Набор инструментов разработчика, который предоставляет GTmetrix, дает вам возможность имитировать страницы на разных типах устройств с разным разрешением экрана. Вы можете создать набор предустановок для часто используемой опции. В целом GTmetrix обеспечивает мониторинг, визуализацию, масштабирование и панорамирование, аннотации и предупреждения.Версия Pro доступна в бронзе, серебре и золоте (15, 50 и 150 долларов в месяц соответственно).

Улучшения

После того, как вы выбрали, какой инструмент использовать, нужно помнить о некоторых вещах. Во-первых, запуск любого из них приведет к более медленному первому поиску в DNS. Система доменных имен — это в основном список имен всех компьютеров и устройств в сети (например, в Интернете). На DNS ссылаются, когда определенный компьютер подключен к Интернету, и поиск устройства требует времени.

Активно обращайте внимание на новые словарные слова. Недаром этот совет классический: он работает! Иногда во время обучения нам так нравится новое выражение, что забыть его кажется невозможным. Но поверьте, мы не запоминаем каждое слово с первого раза, и иногда вам нужно заглянуть сюда. Чтобы исправить это, возьмите за привычку покупать отличный ноутбук или использовать такой инструмент, как Evernote. Итак, каждый раз, когда вы слышите или читаете новое слово или выражение, старайтесь отмечать его в контексте: то есть записывая все предложение целиком и указывая его значение.Это экономит время, так как вам не нужно пересматривать этот термин и спрашивать себя: «Что это слово (это выражение) уже означает? Подпишитесь на подкасты или каналы Youtube (на английском языке). Вам нравится юмор, политика, блоги, кулинария? Темы охватывая все возможные интересы и воображаемые, для вас обязательно есть подкаст или англоязычный канал на Youtube. Подпишитесь на некоторые из них и слушайте их в машине или смотрите по дороге на работу или с работы, в общественном транспорте. Поначалу вам может быть трудно уловить различные местные акценты, но будьте настойчивы, и вскоре вы начнете понимать то, что услышите (помимо изучения множества новых словарных слов от своих друзей-носителей языка!)

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

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

Для дополнительного удобства вы также можете протестировать скорость своего веб-сайта с помощью ряда возможных расширений Chrome. Они почти всегда бесплатны и могут запускаться прямо из браузера. Также неплохо использовать тесты скорости веб-сайта для мобильных устройств (в конце концов, большая часть всех запросов страниц отправляется со смартфонов). Инструменты разработчика Chrome даже позволяют имитировать потенциальную скорость на различных мобильных устройствах и при разных скоростях соединения (например,г., 2G, 4G). Интересный факт: 70% всех подключений в мире происходит на скорости 3G, и это будет продолжаться до 2020 года.

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

Основатель DYNO Mapper и представитель Консультативного комитета W3C.

Назад

Полное руководство по эффективности веб-сайта

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

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

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

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

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

Что такое производительность веб-сайта?

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

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

Почему важна производительность веб-сайта

Как пользователь Интернета, вы сталкивались со многими медленными веб-сайтами. Хотя это может показаться лишь незначительным раздражением, последствия плохой работы могут сказаться на всем бизнесе.Последствия далеко идущие — от удовлетворенности пользователей до прибыли компании. Давайте поговорим о тестах скорости, с которыми сталкивается ваш веб-сайт, и о том, почему они так важны.

Пользовательский опыт

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

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

Итак, насколько быстро достаточно быстро для хорошего опыта?

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

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

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

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

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

Удержание посетителей

Одна из основных целей дизайна веб-сайтов — привлечь интерес посетителей сразу после загрузки страницы. Но все это не имеет значения, если ваш веб-сайт изначально загружается медленно — пользователям очень легко уйти, когда они почувствуют нетерпение. Исследование, проведенное Akamai Technologies, показало, что две дополнительные секунды времени загрузки более чем вдвое увеличивают показатель отказов страницы, а 53% мобильных пользователей покидают страницу, которая загружается более чем через три секунды.

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

Конверсии и продажи

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

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

Источник изображения

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

Восприятие бренда

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

Конечно, вас беспокоят незначительные неудобства. Что еще хуже, вы можете начать предполагать некоторые вещи о ресторане — если они не могут починить входную дверь, что это говорит о качестве еды, которую они готовят?

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

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

Mobile Experience

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

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

Однако

Mobile-first — это больше, чем просто макет.Мобильные устройства, как правило, имеют меньше вычислительных ресурсов, чем стандартный настольный компьютер, и в результате средняя веб-страница загружается на 87% дольше на мобильных устройствах, чем на настольных компьютерах.

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

SEO

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

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

Что влияет на производительность веб-сайта?

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

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

Вес страницы

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

Из-за того, как построены веб-сайты, многие факторы, замедляющие работу страниц, основаны на интерфейсе, который пользователи видят на странице. Возьмите это у бывшего инженера по производительности Google Стива Содерса, который пишет: «80-90% времени ответа конечного пользователя тратится на интерфейс».

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

Источник изображения

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

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

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

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

Изображения

Большая часть контента, который вы видите на веб-сайтах, представляет собой текст или изображения. Файлы изображений намного больше, чем обычные текстовые файлы HTML, поэтому для их загрузки и отображения в браузере требуется больше времени. Отсюда следует, что изображения с высоким качеством изображения будут препятствовать приемлемой в остальном времени загрузки.К счастью, оптимизировать изображения — легко.

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

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

Наконец, сохраняйте файлы небольшого размера, ограничивая форматы файлов изображений JPG, PNG, GIF и SVG, когда это возможно. Сжатие изображений также может улучшить время загрузки, но это более субъективный процесс — вы хотите, чтобы ваши файлы изображений были достаточно маленькими, чтобы повысить производительность, но достаточно большими, чтобы сохранять достаточное качество. Это потребует некоторых проб и ошибок, но вы обнаружите, что сжатие примерно до 75% исходного изображения дает правильный баланс.

HTTP-запросы

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

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

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

Также будьте осторожны с внешними ресурсами, ресурсами, полученными со сторонних серверов. Можно встраивать внешние ресурсы, такие как изображения, видео и другие носители, а также пакеты внешних шрифтов, отображать рекламу, партнерские ссылки и виджеты — все это требует дополнительных HTTP-запросов к отдельным серверам и может снизить производительность.

Кэширование браузера

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

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

Сжатие файлов

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

Файлы меньшего размера быстрее отправляются и загружаются, поэтому сжатие почти всегда полезно. Сегодня 80% веб-сайтов используют сжатие, в частности, тип сжатия, называемый GZIP.Узнайте, как включить сжатие GZIP на вашем сервере.

CSS и JavaScript с блокировкой отрисовки

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

Код блокировки рендеринга обычно представляет собой CSS или JavaScript, который по умолчанию загружается перед остальным содержимым страницы, даже если этот код не требуется для содержимого верхней части страницы (т. Е. Содержимое отображается впервые при первой загрузке страницы) работать.Разработчики могут удалить или отложить код, блокирующий рендеринг, чтобы создать впечатление лучшей производительности.

Хостинг

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

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

Географическое положение

При всей этой технической терминологии легко забыть, что серверы — это компьютеры, расположенные где-то в мире. Чем больше расстояние между устройством, выполняющим HTTP-запросы, и вашим сервером (-ами), выполняющим запросы, тем больше времени потребуется для отправки и загрузки файлов вашего веб-сайта. Вот почему так важно знать, откуда отправляются запросы на ваши серверы — ваш веб-сайт, скорее всего, будет работать иначе в Вашингтоне, округ Колумбия.К. против Токио.

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

Постоянные перенаправления

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

Как проверить производительность веб-сайта

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

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

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

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

Сайт-грейдер

Website Grader предоставляет совокупную оценку эффективности из 100, которая инкапсулирует эффективность вашего сайта. Факторы оценки включают производительность, а также SEO, мобильность и безопасность.

На основе инструмента Lighthouse с открытым исходным кодом Google, оценка производительности Website Grader составляет 30% оценки вашего веб-сайта и исследует ключевые факторы, такие как размер страницы, количество HTTP-запросов, кеширование и размер изображения.Также есть бесплатный сопутствующий видеокурс, который поможет вам улучшить свою оценку.

PageSpeed ​​Insights

Еще один популярный вариант тестирования для маркетологов, инструмент Google PageSpeed ​​Insights позволяет оценить эффективность вашего веб-сайта как на мобильных, так и на настольных устройствах. Он обеспечивает общую оценку от 0 до 100 и поддерживается Lighthouse — оценка 80 или выше считается высокой.

PageSpeed ​​Insights отличается особой строгостью и поддерживает веб-сайты в соответствии с высокими стандартами производительности.Он также предоставляет подробный, но доступный отчет о важных показателях, а также о возможностях — предложениях по ускорению вашей страницы — и дополнительной диагностике, которая может быть полезна.

Источник изображения

Пингдом

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

.

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

Источник изображения

GTmetrix

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

Источник изображения

WebPageTest

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

Источник изображения

Показатели производительности веб-сайта

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

Время загрузки страницы

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

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

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

Медленный TTFB указывает на проблему с вашим веб-сервером, которую можно решить, обновив или изменив план сервера или используя CDN. Но сначала вам, вероятно, лучше сосредоточиться на показателях, которые имеют дело с интерфейсом, например …

Пора начинать рендеринг

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

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

Время до титула

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

Время до взаимодействия

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

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

Время поиска DNS

Время поиска DNS — это время, необходимое системе доменных имен (DNS) для преобразования доменного имени, введенного пользователем, в соответствующий IP-адрес. Это необходимо сделать, чтобы получить ресурсы с каждого хост-сервера.

DNS-поиск должен быть очень коротким, не более 150 миллисекунд — все, что больше, может заметно повлиять на производительность. Длительное время поиска DNS может быть вызвано вашим провайдером DNS, и в этом случае вы можете рассмотреть возможность использования службы DNS премиум-класса.Это также может быть связано с количеством сторонних ресурсов на вашей веб-странице. Например, если ваша страница содержит контент из двух сторонних ресурсов, DNS потребуется преобразовать три домена (включая ваш собственный) в IP-адреса, увеличивая общее время поиска DNS.

Пользовательские показатели

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

Показатель отказов

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

Продолжительность сеанса

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

Коэффициент конверсии

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

Частота ошибок

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

Инструменты мониторинга производительности веб-сайта

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

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

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

Пингдом

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

Pingdom оценивает свои услуги по шкале и разделяет план на синтетические и реальные услуги по мониторингу пользователей. Синтетический мониторинг начинается с 10 долларов в месяц за 10 проверок работоспособности (то есть проверка доступности вашего веб-сайта) и одну расширенную проверку скорости страницы. Мониторинг реальных пользователей начинается с 10 долларов в месяц за 100 000 просмотров страниц.

Источник изображения

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

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

Uptrends оценивается на пяти уровнях, начиная с плана Starter (15 долларов США.47 в месяц) и бизнес-план (37,06 долларов в месяц) до профессионального плана (216,65 долларов в месяц). Функции сильно различаются в зависимости от плана, что позволяет вам выбрать один из наиболее подходящих и переключаться между планами по мере масштабирования вашего веб-сайта.

Источник изображения

Сайт24×7

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

Планы

варьируются от 9 до 89 долларов в месяц с увеличением разрешенных веб-сайтов, синтетических тестов и просмотров страниц по уровням. Также есть корпоративный план и 30-дневная бесплатная пробная версия.

Источник изображения

TeamViewer

Инструмент удаленного управления TeamViewer (ранее Montis) — наша последняя рекомендация.Он сосредоточен на производительности страницы — вы можете проверять скорость страницы из более чем 30 мест по всему миру и создавать визуальные отчеты для каждой проверки. Проверки производительности можно настроить так, чтобы они выполнялись сколь угодно часто, и вы также можете запрограммировать предупреждения, если производительность упадет ниже установленного порога. Один из недостатков заключается в том, что пользовательский интерфейс не так впечатляет, как у конкурентов.

Цена подписки TeamViewer зависит от количества отслеживаемых URL-адресов — например, 10 URL-адресов стоят 18,55 долларов США в месяц, а 100 URL-адресов обойдутся вам в 153 доллара США в месяц.

Источник изображения

Повысьте скорость вашего сайта

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

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

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

8 лучших инструментов, советов и передовых методов мониторинга веб-производительности

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

Что такое мониторинг производительности в Интернете?

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

Инструменты мониторинга веб-производительности

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

Как быстро должна загружаться ваша веб-страница?

Что касается скорости загрузки страницы, существует несколько отчетов и руководств, в том числе этот от Google, в котором оптимизация страниц для мобильных устройств рекомендуется в качестве первоочередной задачи.Согласно Backlinko, который предоставляет одну из самых последних статистических данных, среднее время загрузки веб-страницы на мобильных устройствах примерно на 87% выше, чем на компьютерах. Также указано, что —

«Средняя скорость загрузки (при полной загрузке) веб-страницы составляет 10,3 секунды на компьютере и 27,3 секунды на мобильном устройстве».

Другие основные показатели, измеряемые Backlinko, следующие:

• TTFB (время до первого байта): 1,2 секунды (настольный компьютер) и 2,594 секунды (мобильный)
• Индекс скорости: 4.782 секунды (настольный компьютер) и 11,455 секунды (мобильный)

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

Основные факторы, влияющие на производительность Интернета

Производительность сервера

Производительность веб-сервера напрямую влияет на производительность вашего веб-сайта. Каждый раз, когда браузер проверяет ваш сервер, он запрашивает у него загрузку или передачу некоторых данных на ваш сайт.Если ваш сервер неисправен, эти запросы обрабатываются дольше. В большинстве случаев за обслуживание серверов отвечает ваш хостинг-провайдер. Если ваш веб-сайт использует общий хостинг и регулярно сталкивается с проблемами ресурсов, вы можете подумать о смене провайдера или выбрать более высокий тарифный план с большим объемом ЦП, ОЗУ и дискового пространства. Если у вас автономная установка, вы можете ознакомиться с этим руководством по мониторингу веб-сервера.

Расположение сервера

Компании, расположенные в разных регионах, должны обеспечивать стабильную работу веб-сайтов во всех регионах.Однако, если ваш веб-сайт размещен в одном регионе (например, в Калифорнии), но получает трафик из других регионов (например, из Европы), взаимодействие с пользователем в этих регионах будет отличаться. Другими словами, в США одна и та же страница может загружаться быстрее, чем в Европе. В таких случаях вы можете рассмотреть возможность внедрения CDN (сети доставки контента). CDN — это сеть дополнительных серверных узлов, разбросанных по всему миру, чтобы обеспечить более быстрое время отклика и сокращение задержки. Эти узлы обычно кэшируют статический контент с вашего веб-сайта, включая файлы CSS и Javascript, изображения и другие компоненты.

Размер страницы

Повсеместная доступность высокоскоростных широкополосных сетей и мобильных сетей 4G позволила компаниям улучшить качество обслуживания клиентов с помощью мультимедийного контента. Большинство веб-сайтов, ориентированных на клиентов, сегодня содержат изображения с высоким разрешением. В результате средний физический размер веб-страниц также увеличился. Однако по мере увеличения веса страницы загрузка может занять больше времени. Чтобы страницы вашего веб-сайта загружались быстрее, все изображения и компоненты должны быть по возможности оптимизированы или сжаты.Помимо сжатия, есть и другие методы оптимизации размера страницы. Например, вместо размещения видеоконтента на своих серверах вы можете использовать любую потоковую службу.

Проблемы со сценариями или кодом

Каждый крупный веб-сайт построен с использованием тысяч строк кода CSS, HTML и JavaScript. По мере развития веб-сайтов плотность и сложность кода также увеличиваются. Часто несколько скриптов выполняются параллельно. В таких ситуациях вызовы веб-сервера, превышающие ожидаемые, могут привести к увеличению задержки.Кроме того, несколько потоков, обращающихся к одному и тому же общему коду или файлам, могут привести к «состоянию гонки», что может сделать веб-сайт уязвимым для угроз безопасности.

Во многих случаях сторонние сценарии также могут влиять на производительность вашей страницы, потому что вызов удаленного сервера для запуска или загрузки сценария займет дополнительное время. Если сторонняя служба испытывает сбой или повышается нагрузка, обработка запросов вашего веб-сайта может занять еще больше времени. Следуя лучшим практикам в разработке приложений (например,g., минимизация файлов JavaScript, CSS и HTML, кеширование браузера и т. д.), а также обеспечение правильной оптимизации всех скриптов по скорости и безопасности поможет избежать таких проблем.

Неисправные плагины CMS

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

Что затрудняет мониторинг веб-производительности?

Сложные веб-архитектуры

Сегодня большинство организаций модернизируют свои традиционные стеки LAMP и MEAN, чтобы использовать микросервисы и контейнеры.Это означает, что современные архитектуры приложений значительно отличаются от того, чем они были раньше. Эти приложения требуют анализа огромного количества данных из разных источников для устранения неполадок. Традиционные инструменты веб-мониторинга для отслеживания доступности и производительности не способны справиться с этой сложностью.

Отсутствие активности

Еще одна серьезная проблема, с которой сталкивается большинство организаций, — это привыкание ИТ-специалистов к традиционным процессам и инструментам, которые, по сути, предлагают реактивный подход к управлению производительностью в Интернете.Другими словами, команды готовы отреагировать на проблему, но могут не иметь инструментов и стратегии для прогнозирования и предотвращения возникновения таких проблем в первую очередь.

Отсутствие интеллектуальных предупреждений

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

5 лучших практик для мониторинга веб-производительности

1. Мониторинг статистики работоспособности веб-сайта
2. Мониторинг ошибок
3. Мониторинг ключевых транзакций
4. Мониторинг зависимостей приложений
5. Мониторинг показателей с помощью метода RED

1. Мониторинг статистики работоспособности веб-сайта

Одна из первых вещей, которую вы должны проверить, — доступен ли ваш сайт в сети и доступен ли он вашим пользователям или нет. Один из способов проверить статус веб-сайта — использовать HTTP-монитор ping, который проверяет ваш веб-сайт в определенные периоды времени.Если вы получите код ответа 200, вы можете быть уверены, что веб-сайт работает. Вы также можете проанализировать время отклика ping, чтобы выявить какие-либо проблемы или всплески.

2. Мониторинг ошибок

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

• 1xx: информационный
• 2xx: успех
• 3xx: перенаправление
• 4xx: ошибка клиента
• 5xx: ошибка сервера

Например, ошибка HTTP 500, которая является одной из наиболее распространенных ошибок, указывает на веб-сервер испытывает некоторые внутренние проблемы, которые приводят к сбоям в обработке запросов.Хотя это мало что говорит вам, но если код ошибки повторяется, вы можете копнуть глубже и устранить такие ошибки.

3. Мониторинг ключевых операций

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

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

4. Мониторинг зависимостей приложений

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

5. Мониторинг показателей с помощью метода RED

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

Метрики

RED — это широко распространенный метод мониторинга трех основных показателей веб-производительности:

• Скорость — Запросы, обслуживаемые приложением в секунду
• Ошибок — Процент запросов, вызывающих ошибку
• Продолжительность — Время, затраченное на запрос

Для более глубокого анализа и устранения неполадок вам могут потребоваться дополнительные метрики из баз данных, внешних API , и больше.Однако, если ваше приложение работает нормально, вам может не понадобиться постоянно отслеживать все такие показатели.

8 лучших инструментов для мониторинга производительности в Интернете

1. GTmetrix
2. WebPageTest
3. SolarWinds Pingdom
4. PageSpeed ​​Insights
5. Uptrends
6. Dotcom-Monitor
7. Site24x7
8. Uptime Robot

1. GTmetrix

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

Вы можете получить бесплатный отчет о производительности своего веб-сайта, чтобы быстро оценить, как GTmetrix может помочь вам измерить производительность вашего веб-сайта. Как видно на скриншоте выше, здесь представлены ключевые показатели, такие как оценка PageSpeed ​​(Google), оценка YSlow (Yahoo), время полной загрузки и общий размер страницы. Эти оценки рассчитываются на основе более чем 25 серверов в семи различных регионах мира, что может помочь вам лучше оценить пользовательский опыт в целевых регионах.

Вы также можете получить подробный и всесторонний обзор использования ресурсов и показателей мониторинга, таких как TTFB, First Paint, RUM (мониторинг реального пользователя), индекс скорости и т. Д. С различными графиками и визуализациями. Еще одна интересная функция — это видео загрузки страницы, которое может помочь вам точно определить проблемы с точки зрения пользователя. Единственным недостатком этого инструмента является то, что он может быть немного пугающим для начинающих пользователей, поскольку нелегко определить, какие параметры наиболее важны для отслеживания производительности веб-сайта.

2. WebPageTest

Если вам нужен бесплатный инструмент для измерения производительности веб-страницы, вы можете воспользоваться WebPageTest. Хотя это бесплатный инструмент, он по-прежнему дает возможность выбирать разные браузеры и расположение серверов, чтобы получить подробные сведения об опыте пользователя. Инструмент запускает тесты немного дольше, но дает вам достаточно возможностей для детализации и выявления проблем, влияющих на скорость вашего сайта. Он также предлагает диаграммы водопадов, которые помогут вам визуально отслеживать время, затрачиваемое на каждый запрос.Простое правило большого пальца для анализа диаграмм водопада — проверка их ширины; более широкая диаграмма указывает на более медленную загрузку веб-страницы. Кроме того, вы также можете создавать собственные метрики в соответствии с вашими требованиями к мониторингу. Поскольку это открытый исходный код, это один из самых настраиваемых инструментов веб-мониторинга на рынке.

3. SolarWinds Pingdom

SolarWinds ^® Pingdom ^® — еще один эффективный инструмент, предлагающий гораздо более простой, но эффективный и быстрый способ оценки вашего веб-сайта.Он предлагает мониторинг статистики работоспособности веб-сайта, скорости страницы, транзакций и реальных пользователей (RUM) с серверами, расположенными в более чем 100 местах по всему миру. Инструмент также поддерживает синтетический мониторинг. Вы можете запустить бесплатный тест веб-сайта с помощью теста скорости веб-сайта Pingdom.

Он дает вам краткую сводку результатов тестирования с рекомендациями по повышению производительности страницы. Вы также получаете сводную сводку кодов ответов, размера контента по типу контента / домену и запросов по типу контента / домену.Кроме того, вы можете проверять запросы файлов по времени загрузки, порядку загрузки, времени ожидания, времени DNS, коду состояния и другим параметрам. Одним из основных преимуществ Pingdom является его интуитивно понятный пользовательский интерфейс, который позволяет новым пользователям максимально эффективно использовать инструмент. С помощью Pingdom легко настроить оповещения по электронной почте / SMS, а также он легко интегрируется со службами уведомлений, такими как Slack и Pagerduty. Кроме того, вы можете установить мобильное приложение Pingdom, которое соединяется со службой мониторинга времени безотказной работы, чтобы помочь вам отслеживать доступность вашего веб-сайта на ходу.Вы можете узнать больше о функциях и ценах Pingdom здесь или подписаться на 14-дневную бесплатную пробную версию.

4. PageSpeed ​​Insights

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

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

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

Uptrends — признанный игрок в сфере веб-мониторинга. Он предлагает интуитивно понятную панель инструментов для отслеживания различного времени загрузки, ошибок, показателей и диаграмм водопада.Вы можете запускать тесты с помощью нескольких браузеров из более чем 200 мест по всему миру. Инструмент также позволяет тестировать производительность веб-сайта на мобильных устройствах. Вы можете смоделировать более медленные мобильные сети (2G, 3G и т. Д.), Используя функцию регулирования полосы пропускания, чтобы проверить, как ваш сайт работает в таких условиях. Однако вам нужно будет подписаться на корпоративные или корпоративные планы, чтобы отслеживать транзакции, API и включать тестирование в нескольких браузерах. Мониторинг реальных пользователей также ограничен, пока вы не подпишетесь на более дорогие планы.

6. Дотком-Монитор

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

7. Зона 24×7

Site24x7 — еще одно мощное решение для мониторинга производительности веб-сайтов, которое предлагает все общие и расширенные функции, такие как мониторинг деформации веб-сайтов, веб-сервисы SOAP, REST API и многое другое.С помощью этого решения вы можете получить подробный обзор статистики работоспособности веб-сайта и производительности ваших веб-приложений, используя тестовые серверы, разбросанные по более чем 90 точкам по всему миру. Вы также можете отслеживать ключевые показатели производительности с помощью интуитивно понятных панелей мониторинга и получать своевременные оповещения, чтобы быстро реагировать и устранять проблемы в режиме реального времени. Хотя решение подходит для непрерывного мониторинга, первоначальная настройка может быть немного сложной, и требуются значительные усилия для точной настройки предупреждений и уведомлений.

8.Робот безотказной работы

Uptime Robot — это простой инструмент для проверки статуса веб-сайта. С платной версией этого инструмента вы можете автоматически пинговать свой сайт каждую минуту, чтобы проверить его статус. Если вы получили код ответа 200, ваш веб-сайт работает. В случае появления кода ошибки инструмент выполняет несколько проверок и в конечном итоге выдает предупреждение. Вы можете получать эти оповещения по SMS, электронной почте или через любые другие сервисы, такие как Slack, Telegram и другие. В отличие от других инструментов, упомянутых в этой статье, он не предлагает никаких рекомендаций или других дополнительных возможностей для устранения проблем с производительностью в Интернете.Однако бесплатная версия этого инструмента может быть идеальным вариантом для небольших организаций, которым нужен простой инструмент для отслеживания доступности веб-сайтов.

Заключение

Как обсуждалось в этой статье, на производительность веб-сайта может влиять широкий спектр факторов, включая многочисленные компоненты, такие как изображения, CSS, JavaScript, базовое оборудование и проблемы с сетью. Современные инструменты веб-мониторинга могут помочь вам отслеживать различные метрики и показатели эффективности, чтобы вы всегда были на вершине эффективности своего сайта.Тем не менее, определение того, какой инструмент лучше всего соответствует вашим требованиям, может оказаться сложной задачей. Мы рекомендуем попробовать бесплатную пробную версию SolarWinds Pingdom. Мы нашли решение простым в использовании, и оно предлагает все основные и расширенные функции для мониторинга веб-производительности. Это также жизнеспособный вариант для тех организаций, которые хотят опробовать решение SolarWinds для полного мониторинга своих облачных приложений, развернутых в гибридной среде.