Как узнать скорость сайта
Сегодня я расскажу и покажу, как проверить скорость загрузки сайта с помощью онлайн-сервисов и плагинов для WordPress. Но перед этим я уделю внимание ценности быстрых сайтов. Почему проекты, которые загружаются за секунду, имеют большое преимущество у поисковых систем и как можно оптимизировать свой ресурс с помощью нескольких нехитрых методов. Об этом и многом другом в сегодняшней статье.
Почему скорость загрузки сайта так важна?
Содержание
- 1 Почему скорость загрузки сайта так важна?
- 2 Онлайн-сервисы для проверки скорости загрузки сайта
- 3 Заключение
- 4 Что влияет на скорость загрузки сайта
- 5 Онлайн сервисы для проверки загрузки страниц
- 6 Зачем нужна проверка скорости сайта
- 7 10 лучших сервисов проверки скорости загрузки сайта
- 8 1. Google PageSpeed Insights
- 9 2. Pingdom Tools
- 10 3. WhichLoadFaster
- 11 4. Web Page Performance Test
- 12 5. GTmetrix
- 13 6. Load Impact
- 14 7. Monitis Tools
- 15 8. SiteSpeed.me
- 16 9. PR-CY
- 17 Как тестирование скорости сайта может помочь в анализе?
- 17.1 Концепции скорости сайта
- 17.2 Время до получения первого байта (TTFB)
- 17.3 Блокирующий код Javascript и CSS
- 17.4 Список инструментов
- 17.5 7. Varvy Pagespeed Optimization
- 17.6 Тестирование скорости сайта с помощью расширений для браузера Google Chrome
- 17.7 Тестирование скорости мобильных версий сайтов
- 17.8 Заключение
- 18 Проверка скорости сайта: как это делается
- 19 Google PageSpeed Insights
- 20 Яндекс.Вебмастер
- 21 Pingdom
- 22 Sitespeed.ru
- 23 Какой должна быть скорость?
- 24 Проверка скорости загрузки сайта
- 25 Выводы
Чем быстрее загружаются страницы вашего сайта, тем это лучше для пользователей. Вам же не будет приятно, когда вы хотите прочитать какую-то информацию, а пост с нею открывается более 10 – 15 секунд? За это время вы уже можете передумать и просто закрыть вкладку с сайтом. Так мыслят и ваши клиенты. Они хотят видеть результат здесь и сейчас, а слишком долгое ожидание может послужить причиной отказа.
А вот отказы, в свою очередь, могут снижать общие поведенческие факторы вашего проекта. Поисковик будет видеть, что ресурс не особо полезен для пользователей. Яндекс или Гугл даже могут повесить соответствующие фильтры, которые в буквальном смысле убьют сайт – опустят его на самое дно поисковой выдачи.
Каждый раз, когда движок сайта формирует страницы, которые вы видите в браузере – хостинг испытывает определенную нагрузку. Как правило, скорость сайта и уровень нагрузки на хостинг – две взаимосвязанные переменные. То есть, быстрые оптимизированные сайты создают меньшую нагрузку на сервер, чем тяжеловесные – напичканные большим количеством модулей и файлов.
В том же WordPress, если вы переборщите с шаблоном и плагинами, ваш сайт будет падать буквально от сотни гостей, зашедших в одно время. Только представьте, вашему хостингу нужно одновременно сформировать 100 разных тяжеловесных страниц. Конечно, он тут же откажется работать, а ваш провайдер посоветует вам перейти на более дорогой тариф или все же плотно заняться оптимизацией.
Кстати говоря, такую проблему очень хорошо решает кэширование страниц. В ВордПресс можно установить плагин, например WP Super Cache, после чего скорость загрузки вашего сайта многократно возрастет.
Теперь мы переходим к самому сладкому. А именно к сервисам, с помощью которых можно провести анализ скорости загрузки ресурсов.
Онлайн-сервисы для проверки скорости загрузки сайта
Существует большое количество самых разных инструментов, с помощью которых можно провести тестирование вашего сайта. Я начну их перечислять в убывающем порядке. Сначала поговорим о самых известных, чуть позже – о менее популярных.
PageSpeed Insights
Самый известный онлайн-инструмент, с помощью которого воспроизводят тест скорости работы сайтов. Среди вебмастеров он считается эталонным, потому как, помимо простого анализа, сервис показывает вам советы по исправлению.
Скопируйте адрес сайта в поле и нажмите кнопку “Анализировать”. Процесс может занимать от 30 секунд до минуты. После завершения вам будут выведены результаты.
Обычно PageSpeed Insights советует переместить JS-скрипты в нижнюю часть HTML-страницы, потому как они могут в значительной степени замедлять загрузку. Также этот инструмент “любит” давать советы по сжатию изображений, минификации CSS-файлов.
На фрилансе очень часто можно встретить заказы, когда клиент просит выполнить оптимизацию по Google PageSpeed. Вполне оправданное решение, учитывая, что после выполнения всех пунктов, вы можете ускорить свой сайт в 3 – 10 раз.
Сейчас этот инструмент может показывать скорость загрузки не у всех сайтов. Например, в одном из моих проектов, которому нет и 3 месяцев, вкладка PageSpeed не показывает конкретных данных. Есть только данные по оптимизации. Но и этого мне хватает, чтобы определить, какие действия нужны для ускорения.
В общем, если у вас молодой проект и этот сервис не показывает конкретных данных по распределению скорости загрузки, то не отчаивайтесь. Вам будет достаточно второй вкладки, тем более, что данные у обеих не очень-то и разнятся.
Оптимизация = скорость загрузки. Очень простая формула, которую вам нужно запомнить. Конечно, в более сложных вариантах могут влиять и другие факторы. Хостинг, какие-то модули или что-то еще. Но большей части вебмастеров будет достаточно выполнить все рекомендации и привести свой сайт в порядок.
SeoLik
Еще один сравнительно популярный способ проверки ресурсов – SeoLik. Работает по тому же принципу, что и все остальные онлайн-инструменты. Вы вводите адрес, выбираете устройство проверки (мобильный или компьютер), после чего жмете большую цветную кнопку.
Проверить можно как главную страницу, так и любую другую. На выходе сервис предоставит вам данные по оптимизации ресурса. Вот так это будет выглядеть.
Как видите, здесь результаты также представлены по пунктам. Например, если у вас отсутствует кэширование на уровне браузера, то инструмент сразу покажет вам информацию по этому поводу.
На каждый из пунктов можно кликнуть, развернув вкладку. Там будет представлена более подробная информация о проблеме.
Причем вам даже будут предоставлены ссылки-примеры. С их помощью вы сможете быстро определить источник и далее устранить его. Удобно, не правда ли?
PR-CY
Один из старейших инструментов для проверки оптимизации ресурсов.
PR-CY работает точно так же, как и Google PageSpeed. Там даже даются ссылки на советы по оптимизации из гугловской документации.
Как видите, здесь все работает, как в предыдущем варианте. Вы просто вводите адрес, анализируете, после чего получаете результат с подробными разъяснениями.
Каждую вкладку можно раскрыть. В них содержится подробная информация по представленному пункту.
Список из изображений, которые можно сжать, будет доступен прямо в сервисе. Вам нужно будет лишь принять меры.
Уменьшить вес изображений на сайте можно как с помощью плагинов (если мы говорим о WordPress), так и вручную – используя графические редакторы или онлайн-сервисы. Последние не особо актуальны, т. к. в большинстве случаев они очень сильно портят качество картинок.
Pingdom Tools
Наиболее популярный англоязычный сервис, который предоставляет широкую базу данных по скорости загрузки и оптимизации сайтов. Как и во всех других рейтингах, здесь имеется собственная система оценки, пояснения и советы по ускорению, а также некоторая информация по возможной оптимизации отдельных элементов сайта.
Другими словами, это многофункциональный сервис, сродни Google PageSpeed. Однако, в отличие от последнего, вся информация предоставляется в удобном, разбитом на группы виде. Здесь есть подробные данные о каждом килобайте вашего сайта. Страницы, JS или CSS-файлы, их размер и многое другое.
Вы даже сможете увидеть, с каких адресов осуществляется подгрузка каких-то отдельных элементов. Здесь же доступна информация по соотношению картинок, скриптов, CSS и прочих элементов относительно друг друга. Большую часть, как правило, занимают изображения. Если их оптимизировать, то скорость загрузки может многократно возрасти.
Важной особенностью Pingdom является возможность тестирования из разных регионов США. То есть тесты можно произвести с двух устройств, которые находятся в разных точках страны, после чего сравнить их. Хоть разброс и не особо большой – всего 4 возможных местоположения, это позволяет определить скорость загрузки более точно.
Site Speed
Если предыдущие варианты вам не особо понравились, то вы можете попробовать Site Speed – еще один инструмент, который позволяет в подробностях узнать о проблемах оптимизации вашего проекта. Ровно точно таким же образом вы вставляете ссылку, нажимаете кнопочку и получаете результат. Все безумно просто.
Но здесь же отмечу, что сам тест воспроизводится немного в другом ключе. Чтобы убедить вас в этом, я просто покажу выхлоп.
Чтобы сформировать отчет, инструменту понадобилось чуть больше времени в сравнении с PageSpeed и сервисами, которые работают по тому же принципу. Он, кстати говоря, более радужный и положительный, чем предыдущие.
Чтобы узнать подробности, мы должны кликнуть на соответствующие вкладки. Здесь они, к сожалению, не такие полные.
Web Page Analyzer
Старенький сервис, который тем не менее может быть полезен для анализа сайта. С Web Page Analyzer вы точно так же сможете проанализировать свой проект на предмет скорости загрузки и оптимизации для пользователей.
Вся информация предоставляется в виде таблицы. В ней вы сможете видеть скорость загрузки страниц, их размер и прочие данные, которые могут понадобиться вам при оптимизации.
Сейчас Web Page не особо часто используется сеошниками и вебмастерами, потому что есть более совершенные и быстрые альтернативы. Тем не менее некоторые, особо консервативные пользователи, все еще могут отдавать предпочтение этому онлайн-инструменту.
Тем более, что данные здесь также очень подробные и полезные. Вам будет предоставлена вся необходимая информация по конкретному сайту. Включая все ссылки, список изображений и прочих элементов, которые нуждаются в улучшении.
Заключение
С помощью всех вышеописанных онлайн-инструментов вы сможете узнать скорость загрузки сайта, понять, как можно улучшить этот показатель и начать воплощать все рекомендации в жизнь.
Как я и сказал в начале статьи, каждый инструмент предоставляет примерно одну и ту же информацию. Какому из них отдать предпочтение – решайте сами, но я бы остановился на более популярных и подробных. Таких как Google PageSpeed и Pingdom Tools.
Несмотря на то, что последний инструмент является англоязычным, он все еще остается одним из лучших. Данные показываются в удобном виде, любой опытный вебмастер или даже новичок сможет понять, что именно нужно исправлять в своем ресурсе. То же касается и Google PageSpeed.
Если вы хотите стать опытным вебмастером и зарабатывать на своих проектах, то я рекомендую вам курс Василия Блинова “Как создать блог”. Разработка сайта на WordPress, оптимизация его под поисковые системы и монетизация – все эти вещи будут рассмотрены на курсе, который постоянно обновляется и дорабатывается.
iklife.ru
Что влияет на скорость загрузки сайта
Прежде чем мы начнем тестировать сайты обязательно проведите ряд мероприятий, а именно установите любой из плагинов для кэширования страниц и оптимизируйте базу данных, а потом можно уже приступить к проверкам.
Плагин WP Super Cache
Плагин Hyper Cache
Оптимизация базы данных
Скажу сразу, что мой блог seoslim.ru далеко от идеального и не претендует на звание «Мега быстрая загрузка», но до смены дизайна на новый было намного хуже, так как верстальщик постарался на славу и убрал много не нужных плагинов, а также по шаманил с исходным кодом страниц.
Еще стоит добавить, что на скорость влияет и хостинг-провайдер, который вы используете. Он отвечает не только за доступность сайта в любое время дня и ночи, но и за его пропускную способность, правда очень многое будет зависеть от тарифного плана и предоставляемых им услуг.
Посмотреть как изменилась скорость блога после того, как я перешел со старого хостинга на новый «Макхост» вы сможете из статьи «Почему я выбрал хостинг McHost».
А ближайшее будущее я планирую перейти с виртуального хостинга (когда много сайтов расположены на одном и том же сервере) на VPS виртуальный выделенный сервер, вот тогда мой блог точно будет летать. Главное не пропустите это событие!
Онлайн сервисы для проверки загрузки страниц
Как вы уже поняли из подзаголовка, ниже по тексту я покажу вам несколько популярных и не очень онлайн сервисов, с помощью которых любой вебмастер сможет проверить как загружаются страницы его сайта, сравнить свой проект с конкурентами и выполнить ряд рекомендаций по ускорению.
PageSpeed Insights. С помощь этого продукта от поисковой системы Google вы сможете не только определить с какой скоростью загружаются страницы (шкала от 0 до 100), но и понять, удобен ли ваш сайт для пользователей смартфонов.
Все что нужно это пройти специальный тест и посмотреть перечень тех ошибок и рекомендаций по их устранению.
PR-CY. Популярный сервис в Рунете, который имеет в своем арсенале много инструментов для вебмастера. С помощью массовой проверки скорости сайта вы получите возможность не только узнать, время загрузки проекта, его среднюю скорость, но и сравнить одновременно до 10 URL адресов.
Удобно сравнивать, как загружаются другие проекты, например из ТОП-10 выдачи, с которой собираетесь конкурировать.
WebWait. Еще один сервис для тестирования скорости сайта. Здесь, как и в предыдущем можно проверить одновременно несколько проектов, только данные по загрузкам берутся не за одну проверку, а за пять перезагрузок и высчитывается их среднее арифметическое.
Раньше я отдавал предпочтение этому сервису, так как считал его данные самыми достоверными.
PingDom Tools. Популярный ресурс для анализа времени загрузки страниц и нахождения слабых мест. Также может тестировать DNS и сетевое подключение к серверу.
После проверки под статистикой будет сводная таблица, из которой наглядно определите, что именно на сайте замедляет его работу (файлы, скрипты, картинки и др.).
Load Impact. Современный сервис, который протестирует вас сайт на стойкость к тысячным посещениям пользователей.
Принцип проверки прост, система создает небольшую нагрузку на сайт в течение нескольких минут, создавая плавное увеличение запросов.
Это сделано лишь с одной целью, проследить, как на это отреагирует хостинг, потому что такие условия схожи с теми, что возникнут при большом притоке посетителей.
Рекомендую проверить сайт таким способов, кто знает вдруг вы завтра глюкнет Яндекс и к вам на проект хлынет 10000 армия пользователей.
SiteSpeed. Простой сервис для определения доступности и скорости загрузки содержимого веб-ресурса из разных точек мира одновременно. Минимум настроек и непонятного интерфейса.
Достаточно ввести в специальную строку анализируемый URL адрес и дождаться пока соберется важная информация.
Web Page Test. Этот сервис подойдет опытным вебмастерам. Имеет расширенный ассортимент сканируемых параметров: статистика по каждому элементу страницы, как отвечает сервер на каждый из полученных запросов, количество потоков по всем загрузкам, определение места откуда поступил запрос и другие.
Не думаю что такая детальная статистика будет полезна большей части блоггеров и сайтостроителей. Мы же не собираемся каждый байт подсчитывать?
Web Tool Hub. Еще один сервис для измерения скорости работоспособности сайтов. Если поставить галочку «Show advanced information», то будут показаны дополнительные сведения по сайту: размер изображения, CSS и JavaScript файлов.
Меня смутило здесь обилие рекламы и английский язык, хотя данные собираются быстро.
Gomez Networks. Этот сервис предоставляет внушительных размеров отчеты по тестируемым сайтам. Время загрузки страниц, DNS, IP-адрес, время соединения, Secure Sockets Layer, размер содержимого всех элементов.
Перед проверкой сайта, не забудьте отключить блокировку всплывающих окон.
PageScoring. Усовершенствованный сервис тестирования скорости веб-ресурсов. Разработчики убрали все лишнее, оставив только одну строку для ввода адреса домена.
В отчете кроме общего времени загрузки страниц будет подробно расписано, почему получилась такая цифра, сколько времени ушло на поиск домена, соединение с сервером и загрузку.
Monitis Tools. Мощный сервис, одним из инструментов которого является проверка работоспособности сайта. Благодаря таблице вы сможете понять, какие из элементов площадки загружаются дольше всего.
Главной фишкой monitis.com является то, что данные по скорости одновременно собираются из разных уголков планеты: США, Европы и Азии.
Gt Metrix. Если вы хотите точно узнать истинную причину слабой производительности сайта, то этот сервис решит такую проблему.
Metrix берет данные исходя из Google Page Speed и Yahoo, а на выходе предоставляет информацию по решению найденных недочетов.
Присутствует возможность проверить скорость загрузки сайта из разных мест земного шара.
WhichLoadFaster. Самый простой сервис для сравнения и проверки загрузки страниц сайта. Имеет два активных окна, в которые надо ввести доменные имена площадок для сравнительного анализа.
В конце диагностики показывается, какой сайт победил и во сколько раз, он загрузился быстрее.
CloudMonitor. Еще один сервис для анализа сайтов, которой имеет в наличии инструмент для определения скорости загрузки страниц из разных стран: Италии, Германии, Швеции и других.
В таблице отчетов предоставлены, как временные данные по сайту, так и графические.
Web Page Analyzer. Один из инструментов огромного сервиса по оптимизации веб-сайтов. Все что нужно это ввести URL адрес сайта в специальную строку и получаете подробный отчет по содержимому проверяемой страницы и времени загрузки ее элементов.
Не понравилось только то, что на сбор всех данных приходится тратить много времени, возможно в то время пока я делал тест у них были проблемы с сервером, однако факт остается фактом.
На этом у меня все друзья! Теперь вы уж точно знаете обо всех онлайн сервисах, где можно проверить скорость загрузки сайта и окончательно выяснить истинную причину, почему на это уходит столько времени.
Если вы используете для анализа другие ресурсы, обязательно расскажите в комментариях, чтобы я их внес в список. А какой из них нравится вам больше всего, каким данным вы доверяете больше? Всего хорошего, пока!
seoslim.ru
Здравствуйте уважаемые друзья!
В начале ведения блога я писал о том, как ускорить wordpress и как узнать какой плагин грузит блог. Сегодня же напишу, как проверить скорость загрузки сайта. Вы узнаете несколько интересных сервисов в интернете с помощью которых можно легко узнать, насколько быстро загружается ваш ресурс. Итак, давайте сразу к делу.
1. Инструменты Гугла.
Для Google очень важна скорость загрузки сайта, поэтому они сделали специальный инструмент, где можно это протестировать. Перейдите вот сюда, введите адрес своего сайта и нажмите на кнопку «Анализировать».
Гугл оценивает скорость ресурса от о до 100 как для компьютеров, так и для мобильных телефонов. Чем большая здесь цифра, тем соответственно лучше. У моего блога vachevskiy.ru скорость для компьютеров 78, а для мобильных 65:
В самом низу есть полная инструкция того, что можно сделать, чтобы ускорить ваш сайт. Это очень удобно и если вы разбираетесь во всех этих кодах, то можете потратить некоторое время и сделать хотя бы самые важные рекомендации. По крайней мере, оптимизировать изображения думаю, сможет каждый. Я когда-то писал, как уменьшить размер картинки, можете воспользоваться этой инструкцией.
2. Сервис LoadImpact.
Для того чтобы проверить здесь скорость загрузки сайта нужно немного подождать. Сервис создает так называемую ddos-атаку на ресурс, и таким чином определяет, сколько людей он способен выдержать.
Работа LoadImpact очень проста. Он постепенно искусственно увеличивает количество посетителей на блоге. В конце после анализа вы можете увидеть две линии, синюю и зеленую:
В данном случае зеленая линия отвечает как раз таки за количество посетителей, она будет у всех одинакова. А вот синяя линия отвечает за скорость загрузки сайта. Здесь очень важно чтобы эта линия имела как можно меньше изгибов. Если вы видите большие перепады скорости, то, скорее всего, ваш хостинг не способен выдерживать большую нагрузку. У меня Макхост, поэтому проблем никаких нет :smile:.
3. PingDom.
Еще один очень интересный сервис, с помощью которого можно быстро проверить скорость загрузки сайта. Для проверки введите свой домен в указанную строку и нажмите на кнопку «Тест»:
Здесь стоит обратить внимание в первую очередь на саму скорость загрузки, в моем случае это 1, 71 секунд.
Преимущество этого сервиса в том, что он показывает, как быстро загружается каждый отдельный элемент вашего ресурса: файлы стилей, различные скрипты, изображения и так далее.
Вы можете легко посмотреть, какие элементы сайта долго загружаются и оптимизировать их. Файл стилей можно сжать, картинки уменьшить, ненужные скрипты удалить, а нужные переместить в низ сайта (для wordpress это footer.php).
4. Webo.in.
Для анализа скорости загрузки страницы перейдите сюда введите свой домен и нажмите на кнопку «проверить». Потом вас автоматически перекинет на другой адрес, где вы сможете бесплатно заказать проверку своего ресурса. Для этого введите свое имя, e-mail, телефон и нажмите на кнопку «отправить запрос»:
Через минуту к вам на почту придет автоматическое письмо, его можете не читать :smile:. А вот примерно через 15 минут вы увидите еще одно письмо, в котором будет ссылка на страницу с анализом скорости вашего проекта. Переходим по ссылке и получаем вот такой результат:
В этом сервисе мне понравилось то, что он показывает среднюю скорость загрузки среди других сайтов. Вы можете сравнить, насколько скорость вашего ресурса отличается от остальных. Если сервис не врет, то у моего сайта довольно таки неплохие результаты :smile:.
5. Seobuilding.ru
Об этом сервисе я писал здесь и здесь. Хорош он тем, что позволяет проверить сразу несколько ресурсов. Вы можете выбрать несколько своих конкурентов, и сравнить время загрузки. Вот, для примера сравню скорость восьми сайтов своей тематики:
Здесь нужно обратить внимание на последний столбец «скорость», которая измеряется в секундах.
На этом все на сегодня. Теперь вы знаете, как проверить скорость загрузки страницы сайта. Есть, конечно, и другие способы, но думаю этих должно хватить. Я пользуюсь инструментом от Гугла. А какой проект больше всего понравился вам?
vachevskiy.ru
Зачем нужна проверка скорости сайта
Прыть интернет-площадки зависит от множества факторов из серверной и клиентской части. Серверная часть подразумевает особенности хостинга (серверы Nginx и Apache, сжатие, кэширование на стороне сервера) и базы данных – это редиректы, количество HTTP-запросов, сетевые настройки.
Клиентская часть зависит от:
- размера страницы;
- асинхронной нагрузки;
- сжатия графики и расширения файлов;
- скриптов и плагинов;
- масштабирования изображений;
- кэширования на стороне браузера;
- CSS и JavaScript;
- веб-шрифтов.
Скорость загрузки сайта – важная метрика, влияющая на индексацию, ранжирование и конверсию. Поисковым роботам даётся определенный лимит времени на посещение ресурса: чем дольше грузится контент, тем меньше страниц они успеют проиндексировать. Являясь значимым элементом юзабилити, быстродействие влияет на сортировку сайтов в выдаче.
Важно! Поисковикам важны показатели ресурса в комплексе – низкая скорость загрузки сайта может снизить ваши позиции, однако высокая производительность не гарантирует попадание в ТОП. В таком случае вы получите преимущество лишь по сравнению с «тормозящими» аналогами.
Что касается конверсии, здесь всё очевидно: посетители не готовы долго ждать отрисовки страницы. Особенно это касается мобильных пользователей (на них приходится более 50% в Google). Учтите, что скорость 2G/3G/4G ниже показателя оптоволоконной или широкополосной сети. Если сайт грузится дольше 3 секунд, половина аудитории просто закроет вкладку. При этом 88% пользователей не возвратятся на сайт после неудачной попытки.
Читайте также: ТОП-10 хостингов
10 лучших сервисов проверки скорости загрузки сайта
Чтобы стать лидером в поисковой выдаче и не потерять любовь потенциальных клиентов, надо регулярно проверять скорость загрузки сайта при помощи анализаторов. Сервисы не только оценят web-проект, но и выявят слабые места – их оптимизацией вам и предстоит заняться.
Google PageSpeed Insights
Благодаря этому популярному сервису вы за считаные секунды узнаете уровень быстродействия своего сайта для компьютеров и мобильных устройств. Анализатор в реальном времени оценивает параметры FCP (первую отрисовку содержимого страницы) и DC – полную загрузку HTML с построением DOM-дерева. Он вычисляет процент оптимизации и даёт рекомендации по улучшению. Таким образом можно ускорить блог в 2-3 раза.
Для мониторинга необходимо лишь ввести в поле адрес страницы и нажать кнопку «Анализировать».
Pingdom Tools
Это англоязычный инструмент, который имеет собственную систему оценки. После изучения сайта он также даёт советы по усовершенствованию веб-проекта, в отличие от Google PageSpeed Insights вся информация удобно разбита на подгруппы – обнаружить проблемные участки намного легче.
Чтобы проверить скорость загрузки:
- Перейдите в сервис: tools.pingdom.com.
- Укажите в поле URL интересующий вас адрес.
- Выберите «Стокгольм, Швецию» в графе Test from (это максимально близко к нам из предложенных вариантов).
- Нажмите Start Test.
После этого вы узнаете время загрузки, количество запросов к серверу, размер страницы, получите оценку производительности. Кроме того, получите сравнение своего сайта с другими ресурсами.
Под общими сведениями демонстрируются технические характеристики, размер контента, запросы файлов и коды ответов.
Это интересно: Как проверить историю домена
PR-CY
Точность данных и продуманный интерфейс сделали сервис любимым помощником оптимизаторов. Он наглядно демонстрирует, как долго сайт загружается в браузере посетителя, рассказывает об ошибках и способах их исправления. Позволяет провести массовую проверку для сравнительного анализа – до 10 адресов.
Для работы с инструментом перейдите на его главную страницу и введите url. Затем определитесь с уровнем проверки (для компьютера или телефона), нажмите «Анализировать».
Site Speed
Данная платформа сообщит вам о скорости загрузки сайта в разных точках земного шара, а также среднем показателе. Зелёным цветом сервис подсвечивает лучшие показатели, красным – худшие.
Чтобы промониторить сайт, перейдите на sitespeed.me, укажите адрес сайта и нажмите «Отправить».
Web Page Test
Это многофункциональный анализатор, который загружает страницу несколько раз, сравнивая количество обращений. Он определяет скорость загрузки для каждой категории элементов сайта и самую медленную группу запросов – пользователю предоставляется полная статистика обоих тестов. Особенностью Web Page Performance Test является выбор аудита отдельно для компьютера, Android и Apple.
Хотите воспользоваться возможностями сервиса? Откройте его главную страницу, введите в главное поле адрес сайта, после чего выберите из списка нужное вам устройство и браузер, нажмите START TEST.
Актуально: Mobile First Index — что это и как работает
GTmetrix
Это ещё один полезный инструментом для мониторинга. Англоязычный сервис не только вычисляет скорость загрузки сайта, но и подгружает приоритетные рекомендации Google, Yahoo. Он оценивает эффективность, показывает размер страницы, число запросов и время загрузки. Платформа сохраняет историю проверок, поэтому вы в любой момент можете сравнить скорость загрузки после внесения правок.
Чтобы протестировать ресурс, перейдите на gtmetrix.com, укажите адрес и нажмите Analyze.
SeoLik
Принцип работы тот же: зайдите в сервис, укажите url, введите капчу и нажмите на кнопку «Анализировать» (для начала работы придётся пройти авторизацию).
Расширенный анализ доступен раз в сутки. Здесь выставляется общая оценка производительности, а также скорость сайта для ПК и мобильных устройств по отдельности. С детальной информацией по каждому пункту можно ознакомиться в разделе «Юзабилити» и «Мобильность» внизу отчёта.
Web Page Analyzer
Этот простой в использовании инструмент вычисляет скорость иллюстраций, кода, CSS и скриптов.
Для тестирования откройте Web Page Analyzer, введите адрес страницы и нажмите на кнопку «Отправить».
Which Load Faster
Идеальный анализатор для сравнения скорости загрузки двух конкурирующих сайтов. Чтобы воспользоваться функцией, перейдите на главную страницу сервиса, нажмите Got It! После этого введите адреса двух ресурсов и выберете кнопку Go. В результате будет вычислен победитель и то, во сколько раз он быстрее проигравшего сайта.
Читайте также: Сервисы проверки позиций сайта в поиске
internet-marketings.ru
1. Google PageSpeed Insights
Инструмент оценки скорости загрузки страниц от Google. Показывает значение от 0 до 100 как для компьютеров, так и для мобильных устройств. Тут же указывает на слабые места сайта и дает рекомендации по оптимизации скорости.
2. Pingdom Tools
Дает оценку по скорости, показывает количество обращений к серверу и среднее время загрузки. В сводной таблице подробно отображет данные по каждому запросу к серверу (стили, скрипты, изображения и др). Легко оценить, что именно на сайте замедляет загрузку.
3. WhichLoadFaster
Загружаете два сайта для сравнения (себя и конкурента), визуально наблюдаете, кто загружается быстрее (удобно демонстрировать клиентам). В конце загрузки отображается информация, какой сайт выиграл и во сколько раз быстрее он загрузился.
4. Web Page Performance Test
Загружает страницу два раза, сравнивает количество обращений – выявляет, насколько хорошо организовано кеширование, показывает подробную статистику по каждому из тестов. Сохраняет скриншоты, как сайт выглядит на каждой секунде загрузки. Также в удобной форме демонстрирует, какая группа запросов заняла больше всего времени. Сервер находится в Далласе (США).
5. GTmetrix
Еще один полезный инструмент для теста скорости сайта. Отображает много сводной информации, также хранит историю, чтобы можно было сравнить, насколько улучшилась или ухудшилась скорость загрузки. Подгружает рекомендации Yahoo и Google для оптимизации скорости, сортируя их по приоритету. Тестовый сервер находится в Ванкувере (Канада).
6. Load Impact
Сервис тестирует, насколько сайт выдерживает нагрузку (легкий DDOS). Эмулируется несколько десятков пользователей и более сотни активных соединений. Так как тест длится несколько минут, то в это время нагрузки можно использовать и другие инструменты для оценки скорости загрузки страниц в час пик. По окончанию теста можно посмотреть график, как меняется скорость загрузки от количества активных пользователей.
7. Monitis Tools
Анализирует загрузку сайта с разных участков Земли — серверы в США, Европе и Азии. Отображает сводную статистику по каждому тесту.
8. SiteSpeed.me
Посылает запросы к анализируемой страницы с разных датацентров (около 30 серверов) и определяет скорость для каждого из них. Подсвечивает лучшие, худшие и средние показатели по времени и скорости.
9. PR-CY
Массовая проверка скорости сайта. Можно задавать до 10 адресов – сравнивая таким образом время загрузки и размер документа для каждого из ресурсов.
devaka.ru
Как тестирование скорости сайта может помочь в анализе?
Вот лишь несколько способов тестирования скорости сайта с помощью различных инструментов:
- Определение скриптов, шрифтов и плагинов, вызывающих увеличение времени загрузки (HTML, JavaScript, CSS);
- Проверка минимизации скриптов;
- Обнаружение больших изображений;
- Тестирование времени до получения первого байта (TTFB);
- Анализ общего времени загрузки, размера страниц и запросов;
- Проверка производительности для различных географических точек;
- Проверка скорости вывода в различных браузерах;
- Анализ HTTP-заголовков;
- Измерение производительности сети («доставка» контента);
- Проверка, какие элементы корректно загружаются из CDN.
Концепции скорости сайта
Перед началом проверки скорости сайта важно разобраться в концепциях, на основе которых работают эти инструменты. С их помощью вы можете не только проверить скорость своего хостинга, но и измерить производительность CDN.
Время до получения первого байта (TTFB)
Время до получения первого байта (TTFB) — показатель скорости отклика сервера. Это время, которое требуется браузеру, чтобы начать получать информацию после того, как он запросил ее с сервера. При использовании CDN можно значительно уменьшить зависимость своего сайта от загруженности сервера, что в свою очередь должно уменьшить TTFB.
Блокирующий код Javascript и CSS
К блокирующим вывод относятся скрипты Javascript и стили CSS, которые не дают страницам загружаться так быстро, как они могли бы.
Javascript
Google рекомендует удалять или откладывать загрузку скриптов JavaScript, которые замедляют загрузку. Пример откладывания загрузки скрипта JavaScript путем его размещения непосредственно перед тегом </body>:
CSS
Также нужно оптимизировать код CSS, чтобы не допустить связанных с ним задержек при загрузке страниц. Вот несколько рекомендаций для увеличения скорости сайта:
- Надлежащие имена файлов CSS;
- Уменьшение количества файлов CSS;
- Использование меньшего объема кода CSS в целом.
CSS — это блокирующий вывод ресурс, для оптимизации времени отображения он должен загружаться клиентом так быстро, как это только возможно!
Минимизация ресурсов
Минимизация ресурсов означает удаление из HTML, JavaScript и CSS кода символов, которые не требуются для загрузки. Таких как:
- Пробелы;
- Символы новой строки;
- Комментарии;
- Разделители блоков.
Это увеличивает скорость сайта, поскольку уменьшает объем кода, который должен быть запрошен с сервера. Чтобы удалить все ненужные символы, можно использовать такие инструменты, как Dan’s CSS и Javascript Minify. Если вы работаете с WordPress, можно использовать плагин Autoptimize, который минимизирует HTML, JavaScript и CSS.
HTTP-запросы
Когда браузер извлекает данные с сервера, он делает это, используя протокол HTTP (Hypertext Transfer Protocol). Это процесс обмена «запрос / ответ» между клиентом и хостингом. Чем больше HTTP-запросов выполняет веб-страница, тем медленнее она будет загружаться.
Существует много способов, с помощью которых можно уменьшить количество запросов. Например:
- Объединение файлов CSS и Javascript;
- Встроенные скрипты Javascript (только если они небольшие);
- Использование CSS-спрайтов;
- Уменьшение количества используемых ресурсов, таких как сторонние плагины, которые выполняют большое количество внешних запросов.
Список инструментов для тестирования скорости сайта
Ознакомьтесь с приведенными ниже 15 бесплатными инструментами для тестирования скорости сайта. Каждый из них предлагает уникальные функции, отчеты и различные способы предоставления сводных данных.
Примечание: При запуске подобных инструментов в первый раз поиск DNS будет выполняться медленнее. Если вы хотите определить общее время загрузки, лучше выполнить тесты несколько раз и взять среднее значение.
Список инструментов
1. KeyCDN Speed Test
Это быстрый и простой способ тестирования скорости, чтобы получить представление о производительности сайта. Он предлагает на выбор 14 мест для тестирования по всему земному шару. Тест включает в себя разбивку процесса загрузки и визуализацию предварительного просмотра сайта. Можно быстро узнать, сколько HTTP-запросов было выполнено, а также полный размер запрашиваемой страницы и время загрузки.
Это один из немногих инструментов, наравне с PageSpeed, который является адаптивным и отлично работает на мобильных устройствах:
2. Google PageSpeed Insights
Сервис позволяет проверить скорость сайта и выставляет ему по шкале от 1 до 100. Чем больше число, тем лучше оптимизирован ваш сайт. Все, что выше 85, указывает на то, что ресурс работает хорошо.
PageSpeed предоставляет отчеты, как для стационарной, так и для мобильной версий сайта. Можно просмотреть рекомендации по улучшению компонентов.
PageSpeed Insights определяет, насколько страница может быть оптимизирована по таким показателям:
- время начала загрузки: время, прошедшее с момента, когда пользователь запросил новую страницу, и до момента, когда браузер начал отображать контент;
- время полной загрузки страницы: время, прошедшее с момента, когда пользователь запросил новую страницу, и до момента, когда страница была полностью выведена браузером.
Мобильный отчет включает в себя дополнительную категорию под названием «Опыт пользователя«. В эту оценку включается анализ конфигурации окон просмотра, размера целевых элементов (кнопок и ссылок), а также оптимизация размеров шрифтов:
3. Pingdom
Один из наиболее известных инструментов для тестирования скорости сайта. Предоставляемые им отчеты разбиты на четыре раздела, которые включают в себя разбивку процесса загрузки, оценку производительности, анализ страниц и историю.
В анализе страницы приведен подробный обзор с дополнительной информацией: анализ размера, размер каждого домена (можно легко сравнить CDN-элементы с доменными), количество запросов на домен. А также, какой тип контента выполнял наибольшее количество запросов:
4. GTmetrix
Он проверяет как показатели PageSpeed, так и YSlow, присваивая сайту категорию от F до A. Сводный отчет разбит на пять разделов, включающих PageSpeed, YSlow, разбивку процесса загрузки, видео и историю.
При бесплатной регистрации можно проверить скорость загрузки сайта с семи различных локаций. GTmetrix также позволяет выбрать браузер, Chrome или Firefox.
Вы можете проверить и сравнить показатели сайта для различных типов соединений (например, кабель против dial-up), чтобы определить, как это влияет на скорость загрузки страницы. В числе других функций можно отметить воспроизведение видео для анализа и выявления проблем при загрузке, а также возможность запуска Adblock Plus. При отключенной рекламе можно увидеть, как она влияет на загрузку анализируемого сайта:
5. WebPagetest
Предлагает на выбор для тестирования более 40 локаций и 25 браузеров (включая мобильные). Инструмент присваивает сайту категорию от F до А на основе различных тестов производительности, таких как FTTB, сжатие, кэширование, эффективное использование CDN и т.д. Финальный отчет разбит на шесть разделов, включающих в себя общую оценку, детализацию, обзор производительности, проблемы при загрузке контента и скриншоты.
Сервис помогает диагностировать, какие задержки возникают во время первого поиска DNS (о чем упоминалось ранее). WebPagetest содержит также более продвинутые функции, такие как захват видео, отключение Javascript, игнорирование сертификатов:
6. DareBoost
При анализе скорости сайта он учитывает более 100 контрольных параметров. Из них складывается общая оценка от 1 до 100 баллов. Можно сравнить показатели загрузки сайта на стационарных и мобильных устройствах, в Firefox и Chrome, а также для пяти различных географических точек.
Общий отчет разделен по приоритетам. С помощью бесплатной учетной записи можно экспортировать отчет в формат PDF и даже сравнить показатели сайта с другими ресурсами. Инструмент предлагает обширный перечень информации и примеров для каждого из 100 различных контрольных параметров. Кроме оценки скорости сайта отчеты также включают в себя рекомендации по SEO, доступности и качеству кода:
7. Varvy Pagespeed Optimization
Предоставляемый сервисом отчет разбит на 5 разделов, включающих в себя диаграммы ресурсов, анализ CSS, JavaScript, выявленные проблемы со скоростью страницы и используемые сервисы.
Сервис предоставляет документацию и рекомендации о том, как улучшить сайт с помощью оптимизации процесса визуализации, использования кэширования в браузере, отложенной загрузки JavaScript и многого другого:
8. Uptrends
Предлагает более 35 географических точек для тестирования скорости сайта. Предоставляемый отчет состоит из двух разделов: разбивка процесса загрузки и группы доменов. Раздел «Группы доменов» содержит уникальную информацию, так как в нем ресурсы классифицируются по различным источникам: собственные, статистика, CDN, социальные, реклама:
9. dotcom-monitor
Предлагает для тестирования 23 различных географических точки и семь браузеров. Уникальной особенностью этого инструмента является то, что он позволяет запустить все географические тесты и просмотреть отчет по каждому тесту отдельно.
Общий отчет проверки скорости загрузки сайта разбит на пять разделов, которые включают в себя данные о производительности, диаграммы процесса загрузки (разбивка), хостинг и ошибки:
10. PageScoring
Предлагает простой и понятный отчет о производительности. В нем отображается:
- Поиск домена;
- Время соединения;
- Время перенаправления;
- Размер страницы;
- Время загрузки.
После этого можно просмотреть, сколько времени потребовалось для загрузки отдельных элементов страницы:
11. Yellow Lab Tools
Это новый инструмент для тестирования скорости загрузки и качества front-end. Yellow Lab Tools предоставляет много полезной информации и содержит уникальные функции, которых нет в других инструментах. Например, отслеживание того, как взаимодействует JavaScript с DOM во время загрузки страницы.
Сайт получает суммарную оценку на основе следующих критериев:
- Вес страницы;
- Запросы;
- DOM;
- Некачественные скрипты Javascript;
- Некачественные стили CSS;
- Конфигурация сервера.
График JavaScript показывает фактические взаимодействия DOM во время загрузки страницы:
12. DevTools Google Chrome
Это очень простой в использовании инструмент для проверки скорости сайта. Его можно запустить в Google Chrome, используя сочетания клавиш:
- Windows: F12 или Ctrl + Shift + I;
- Mac: Cmd + Opt + I.
В последнем обновлении инструментов для разработчиков в графики процесса загрузки были добавлены панели сводных данных. Это позволяет увидеть, на загрузку какого элемента требуется большего времени. Чтобы увидеть эту информацию, кликните по панели шкалы времени и нажмите Ctrl + R (Cmd + R), чтобы обновить страницу. Затем можно кликнуть по панели «Сводка» и «Сводные данные«:
В инструментах для разработчиков можно увидеть точное время загрузки контента DOM и общее время загрузки. Для просмотра этой информации кликните по панели «Сеть«, нажмите на кнопку «Показать обзор» и Ctrl + R (Ctrl + R), чтобы обновить страницу. Синяя линия будет показывать время загрузки контента DOM, а красная — общее времени загрузки. Обычно все, что находится слева или соприкасается с синей линией — это элементы, которые блокируют DOM (ресурсы блокирующие вывод):
13. Sucuri Load Time Tester
Инструмент предоставит полную оценку производительности по шкале от A до F. Тест измеряет, сколько времени проходит от подключения к сайту или одной странице до полной загрузки. Параметр «время до получения первого байта«, показывает, сколько времени потребовалось для начала обработки страницы:
14. Pagelocity
Инструмент проверки скорости загрузки сайта оценивает ресурс по 100-бальной шкале, которая состоит из таких параметров, как социальные функции, SEO, ресурсы и код. Он также позволяет отслеживать сайты конкурентов. Можно завести бесплатный аккаунт, чтобы воспользоваться дополнительными функциями.
Инструмент показывает, работает ли сайт через HTTPS, каково значение TTFB, и через диаграмму в графической форме отображает время загрузки элементов DOM:
Представление ресурсов позволяет быстро определить, какие элементы составляют общий вес страницы. На приведенном ниже скриншоте теста видно, что объем изображений более чем в 4 раза превышает объем внешних скриптов:
15. YSlow
YSlow выполняет тестирование скорости сайта в три этапа:
- Сканирует DOM, чтобы найти все компоненты (изображения, скрипты и т.д.);
- Получает информацию о размере каждого из компонентов (Gzip, неактуальные заголовки и т.д.);
- Принимает данные и дает оценки по каждому из правил.
YSlow оперирует 23 различными правилами, как показано ниже на примере теста. Можно использовать бесплатное расширение для Chrome или получить результаты YSlow от GTMetrix.
Тестирование скорости сайта с помощью расширений для браузера Google Chrome
Существует много бесплатных расширений для браузера Google Chrome, с помощью которых можно проверить скорость сайта.
Вот некоторые из них:
- Page Load Time;
- app.telemetry Page Speed Monitor;
- Performance-Analyser;
- LoadFocus Load Testing.
Тестирование скорости мобильных версий сайтов
Это позволяют сделать следующие инструменты:
- WebPageTest;
- GTMetrix;
- DareBoost;
- dotcom-monitor.
Другой способ проверить скорость сайта — использовать инструменты для разработчиков Chrome в режиме устройства. Чтобы войти в режим устройства, кликните по иконке телефона в Chrome DevTools или нажмите Ctrl + Shift + M (Cmd + Shift + M). После этого можно выбрать устройство, которое нужно имитировать. Также можно изменить настройки сети, чтобы увидеть, как сайт будет отображаться при 2G или 4G соединении.
Затем на вкладке «Сеть» можно запустить тест скорости:
Заключение
Существует целый ряд инструментов для тестирования скорости сайтов. Каждый из них имеет свои уникальные функции. Весьма полезно регулярно проверять свой сайт, чтобы установить ориентир и постепенно стремиться к нему.
После того, как определите проблемные места вашего сайта, можно начать исправлять их.
Перевод статьи «15 Website Speed Test Tools for Analyzing Web Performance» был подготовлен дружной командой проекта Сайтостроение от А до Я.
www.internet-technologies.ru
Проверка скорости сайта: как это делается
Хорошая скорость загрузки страницы — 0.35–0.38 секунд. Такие результаты показывают сайты в топе выдачи. Чтобы посчитать это время, нужно измерить так называемую «скорость ответа сервера» — как быстро он реагирует на запрос клиента (браузера).
Вебмастеры измеряют скорость загрузки с помощью различных сервисов — платных и бесплатных, простых и «навороченных». В этой статье перечислим самые популярные из них.
Google PageSpeed Insights
Google PageSpeed Insights бесплатно измеряет скорость загрузки и на мобильных, и на стационарных устройствах. Рейтинг определяется по 100-балльной шкале: чем больше баллов, тем лучше. Если ваш сайт получил более 85, значит, все хорошо. Не стремитесь получить 100 баллов. Это не удается даже сервисам Google.
Чтобы проверить сайт, введите URL в строку на странице developers.google.com. Сервис оценит скорость и предложит варианты, как улучшить показатели:
Оптимизировать сайт в режиме реального времени поможет модуль PageSpeed Insights. Правда, в этом случае уже понадобится помощь разработчика.
Яндекс.Вебмастер
Посмотреть скорость ответа сервера на запрос робота «Яндекса» можно с помощью инструмента webmaster.yandex.ru. Он покажет время ответа в миллисекундах:
Как и у Google, у «Яндекса» это бесплатный сервис, которым можно пользоваться без регистрации и глубокого понимания бекенда.
Pingdom
Сервис pingdom.com предоставляет более подробную информацию для тестирования сайтов, чем перечисленные выше. Кроме оценки общей скорости сайта, Pingdom покажет, с какой скоростью загружается каждый элемент страницы:
Сервис собирает статистику скорости за период времени и предоставляет подробный отчет об ошибках. Тип проверки можете выбрать сами: HTTP(S), TCP port, Ping, DNS, UDP, SMTP, POP3 and IMAP.
Самый большой минус Pingdom — то, что сервис платный. Цены начинаются с $9,95 в месяц.
Sitespeed.ru
Еще один популярный инструмент в рунете — sitespeed.ru. Интерфейс простой и понятный: пишешь URL, запускаешь тест, получаешь результат. Сервис дает подробное описание, как справиться с каждой проблемой сайта:
blog.completo.ru
Какой должна быть скорость?
Наверное, вы встречали сайты, которые грузятся слишком долго, и вы открывали другие вкладки и занимались другими делами пока страница полностью загрузится. Вот так быть не должно. Можно выразить все это в цифрах:
- 0,1-0,5 секунды или 100-500 мс — мгновенно, пользователь даже не заметить никаких задержек. Другое дело, что такая скорость загрузки невозможна для современных сайтов, переполненных различными изображениями, скриптами и стилями;
- 1 — 3 секунды — оптимальный вариант, пользователь заметит небольшую паузу, но это не вызовет раздражения и он продолжит работу на сайте. К такому результату нужно стремиться;
- 5-10 секунд и больше — очень плохо, пользователю придется ждать и он может попросту уйти, или, по крайней мере у него останется неприятное впечатление о сайте.
Все что больше пяти секунд уже пора оптимизировать и оптимизировать серьезно. Но сначала поговорим о том, как узнать какая у вас скорость работы сайта.
Проверка скорости загрузки сайта
1. Google Chrome
Самый первый инструмент, который стоит использовать — это ваш браузер. Тут вы можете детально посмотреть с какой скоростью загружается страница у вас и какие элементы создают большую нагрузку. Откройте ваш сайт, например, главную страницу, и нажмите сочетание клавиш Ctrl+Shift+J, затем перейдите на вкладку «Perfomance»:
Браузер предложит вам нажать кнопку F5, чтобы обновить страницу и записать сеанс, после этого отобразиться скорость загрузки:
Внизу страницы мы видим результат, она загружена за 8,1 секунды, это плохо, но первые элементы на странице появились уже в 2 секунды, а значит пользователи не почувствовали много неудобств. Тут вы можете найти множество полезной информации, какие материалы грузились долго можно посмотреть развернув надпись «Network»:
Например, у меня время загрузки для различных стилей составляет около 400 мс, это много. Сворачиваем «Network» и смотрим «Frames». Синий индикатор показывает, когда завершилась загрузка основных компонентов и пользователь увидел первые элементы на странице (DOM Loaded):
Загрузка элементов отображается на графике «Main», синим — HTML код, желтым — скрипты, зеленым — медиа данные, розовым — стили.
Здесь вы можете узнать множество полезной информации о загрузке страницы сайта, но тут есть несколько минусов. Во-первых, слишком сложный интерфейс, во-вторых, это актуально только для вашего интернета, для других компьютеров все может быть по-другому. Поэтому нужно еще использовать онлайн сервисы.
2. Pingdom tools
Pingdom — это отличный сервис, который имеет очень простой интерфейс и позволяет посмотреть насколько быстро загружается каждый элемент вашего сайта и при этом имеет очень простой и понятный интерфейс. Просто введите адрес сайта в строку запроса:
Страница загрузилась за 7.22, почти тот же результат, что и в Google Chrome и при этом со страницы было отправлено 115 запросов различных файлов и общий вес страницы 1,9 мегабайт.
Еще ниже находится полная диаграмма скорости загрузки сайта. По ней вы тоже можете определить какие ресурсы грузятся долго.
Можно отсортировать по «Load Time» в поле «Sort by»:
Дальше, при анализе стоит обратить внимание на шкалу загрузки каждого файла. Обозначения:
- Розовый — время получения IP по DNS;
- Пурпурный — время установки соединения SSL;
- Синий — ожидание подключения к серверу;
- Оранжевый — время передачи данных;
- Желтый — время ожидания ответа сервера;
- Зеленый — время, потраченное на загрузку данных.
Перед тем как что-либо улучшать, нужно проанализировать все. Причем не только для одного элемента, а для всех в общем. Если сайт генерирует более 100 запросов, то оптимизация одного не всегда поможет сильно увеличить скорость, разве что только он не создавал огромных проблем.
На время получения DNS и рукопожатие SSL мы повлиять не можем, и оно выполняется только один раз. Далее подключение к серверу, зависит от нагрузки на сеть, можно оптимизировать только одним путем — использовать https и новый протокол http2, тогда соединение будет выполняться только раз, а все данные будут передаваться в одном потоке.
Затем идет время ожидания ответа сервера. Этот параметр зависит от многих факторов — насколько долго запрос обрабатывается веб-сервером, php, загруженности сети и так далее. Время ожидание в 100 мс — это еще норма, но когда оно составляет 300 мс для статических файлов — это уже проблема. Допустим, на странице загружается 20 картинок, 20*300 — это уже шесть секунд, а возьмите статью, в которой картинок еще больше — 30, 50. Вот вам и время загрузки.
Время получения данных зависит от размера файлов, можно оптимизировать включением сжатия на лету, но это увеличит время ожидания Wait Time, или же сжав все заранее с помощью специальных утилит.
3. Host-tracker
Минус Pingdom в том, что там можно проверить скорость сайта только на заграничных ресурсах. Если нас интересует Россия, то лучшие использовать host-tracker:
Но здесь совой недостаток, загружается только html код страницы и все. Никакие изображения и вообще структура DOM загружены не будут. Например, в Москве, html код страницы загружается за 79 мс, а в Австралии за 2,5 секунды. Например, в Pingdom этот же показатель был примерно 800 мс. Тут не выполняется проверка скорости страниц сайта. Если вы хотите проверить скорость загрузки отдельного ресурса на странице, то вам нужно будет набирать его url отдельно.
4. Проверка скорости в терминале
Проверка скорости сайта в терминале Linux позволит получить больше всего необходимой информации, чтобы принять правильное решение по оптимизации. Мы выяснили, что самую большую проблему после проблемных файлов представляет время ожидания ответа веб сервера. Теперь нужно понять откуда оно берется. Утилита curl позволяет узнать скорость загрузки сайта, замерять время до получения первого байта, по сути, это и есть wait time + connect + dns + ssl + read. Команда выглядит вот так:
curl "https://losst.ru" -s -o /dev/null -w "response_code: %{http_code}n
dns_time: %{time_namelookup}n
connect_time: %{time_connect}n
AppCon time:t%{time_appconnect}n
pretransfer_time: %{time_pretransfer}n
starttransfer_time: %{time_starttransfer}n
total_time: %{time_total}"
Значение каждой переменной:
- time_namelookup — время преобразования домена в IP адрес;
- time_connect — время установки соединения по TCP;
- time_appconnect — время, затраченное на соединение SSL;
- time_pretransfer — время, затраченное на подготовку к передаче данных;
- time_starttransfer — время получения первого байта от сервера;
- time_total — общее время загрузки страницы, только html, без скриптов и изображений.
Фактически здесь выходит, что время ожидания веб-сервера меньше 100 мс. Время отправки данных можно принять за 0, тогда wait time от pingdom будет time_starttransfer — time-pretransfer. Мы можем проверить другой ресурс, например, изображение:
Здесь уже видим тот же wait time до 140 мс. Плохо, учитывая, что у серверов Google этот параметр до 5 мс. Дальнейший анализ нужно продолжить на вашем сервере. Мы посмотрим насколько быстро веб-сервер возвращает результат с помощью tcpdump. Дальнейшую инструкцию можно выполнить только на VPS/VDS, на хостингах у вас это не выйдет. Авторизуйтесь на вашем сервере по SSH и выполните там такую же команду:
$ curl «http://test.losst.ru/wp-content/uploads/2017/07/Snimok-ekrana-ot-2017-07-31-18-56-04-300×169.png» -s -o /dev/null -w «response_code: %{http_code}
dns_time: %{time_namelookup}n
connect_time: %{time_connect}n
AppCon time:t%{time_appconnect}n
pretransfer_time: %{time_pretransfer}n
starttransfer_time: %{time_starttransfer}n
total_time: %{time_total}»
Результат будет совсем другим, моему серверу понадобилось 63 миллисикунды на обработку этого запроса. Из чего можно сделать вывод, что все остальные задержки — проблема работы сети. Мы еще можем отследить как передаются пакеты и заголовки с помощью tcpdump, только нужно отключить SSL, иначе вы ничего там не разберете:
tcpdump -n -S -s 0 -vvvvv -A '(tcp dst port 80 or tcp src port 80) and (dst host ваш_ip or src host ваш_ip)'
Вы можете подробнее почитать как пользоваться tcpdump в отдельной статье. Фактически, этот фильтр означает, что нужно отображать все пакеты, полученные на порт 80 или отправленные с порта 80, при том, что они будут отправлены либо с вашего ip либо на ваш ip. Теперь в другом терминале выполните curl запрос к http версии сайта, в tcpdump вы увидите полный список пакетов и их содержимое:
14:30:08.392357 IP (tos 0x0, ttl 64, id 65431, offset 0, flags [DF], proto TCP (6), length 52)
185.22.173.108.http > 95.133.238.84.landmarks: Flags [.], cksum 0xb483 (incorrect -> 0x6fa7), seq 3071477496, ack 1691128194, win 227, options [nop,nop,TS val 848099696 ecr 5005665], length 0
E..4..@.@……l_..T.P……d…………..
2..p.Laa
14:30:08.402702 IP (tos 0x0, ttl 64, id 65432, offset 0, flags [DF], proto TCP (6), length 2948)
185.22.173.108.http > 95.133.238.84.landmarks: Flags [.], cksum 0xbfd3 (incorrect -> 0x2316), seq 3071477496:3071480392, ack 1691128194, win 227, options [nop,nop,TS val 848099707 ecr 5005665], length 2896
E…..@.@.{~…l_..T.P……d…………..
2..{.LaaHTTP/1.1 200 OK
Server: nginx/1.13.3
Date: Fri, 18 Aug 2017 11:30:08 GMT
Content-Type: text/html; charset=UTF-8
Transfer-Encoding: chunked
Connection: keep-alive
Expires: Fri, 18 Aug 2017 21:30:08 GMT
Pragma: public
Cache-Control: max-age=36000, public
X-Powered-By: W3 Total Cache/0.9.5.4
- 14:30:08.392309 — отправлен запрос на страницу;
- 14:30:08.402702 — получен ответ.
Время отображается в микросекундах, фактически, время ожидания веб сервера составило 10393 микросекунд или 10 миллисекунд. Теперь понятно, что вся проблема в сети и веб сервер работает почти так же идеально, как и у гугла. А вот что делать с сетью это уже совсем отдельная тема, которая выходит за рамки данной статьи.
Выводы
В этой статье мы рассмотрели как проверить скорость загрузки сайта с помощью различных сервисов, а также как понять в почему скорость вашего сайта низкая. То, насколько быстро загружается ваш сайт, определяет насколько комфортно будет вашим пользователям на нем. Так что регулярно выполняйте тестирование скорости загрузки сайта и делайте все возможное чтобы ее увеличить.
losst.ru