Долго загружаются страницы (сайты) в браузере. Почему и что делать?
Сегодня мы постараемся разобраться с одной из самых загадочных и непонятных проблем, когда очень долго и медленно загружаются страницы в браузере на компьютере, или ноутбуке. И если подумать, то причина сразу ясна – медленный интернет. Когда очень низкая скорость соединения с интернетом, то понятно, что сайты будут загружаться медленно. Особенно тяжелые сайты, где много изображений и других элементов. Но нет, проблема с медленной загрузкой страниц возникает у пользователей при хорошей скорости соединения. При проверке скорости результат хороший, файлы и торренты загружаются быстро, а странички в браузере совсем не спешат открываться.
По моим наблюдениям, проблема со скоростью загрузки сайтов наблюдается во всех браузерах: Яндекс.Браузер, Google Chrome, Opera, Mozilla Firefox, Microsoft Edge ну и конечно же в Internet Explorer.
Проблема неоднозначная, так как не понятно насколько медленно открываются сайты, через какой браузер, какие конкретно сайты, какой у пользователя интернет и какая скорость, как работает на другом устройстве, когда появилась проблема и т. д. Очень и очень много нюансов. Которые, вы при желании и необходимости можете описать в комментариях к этой статье. И я постараюсь дать вам более конкретный ответ. Ну а ниже в этой статье я расскажу об очевидных и не очень причинах и решениях данной проблемы.
Сразу оставлю ссылки на решения других, похожих проблем:
Что нужно попробовать и проверить в первую очередь:
- Если проблема только-только появилась, то перезагрузите свой компьютер и роутер (если он есть) .
- Так же первым делом я советую проверить скорость интернета. Смотрите скорость загрузки. Если там, например, меньше 1 Мбит/с, то понятно почему сайты загружаются медленно. Хотя, здесь все очень и очень индивидуально и неоднозначно. Самое понятие «медленно» у каждого свое.
- Попробуйте открыть сайты через другой браузер. Например, через стандартный Microsoft Edge, или Internet Explorer (они как правило не замусорены, так как ими никто не пользуется) .
- Постарайтесь выяснить в чем проблема: в браузере, компьютере, маршрутизаторе, или в подключении к интернету. Есть много вариантов, как все это быстро выяснить. Например, пробуем другой браузер. Проверяем, как открываются сайты на другом устройстве через маршрутизатор. Можно подключить интернет напрямую к компьютеру.
Еще такой момент: если у вас старый и медленный компьютер, или ноутбук, то проблема может быть в этом. Он просто не справляется.
Медленная загрузка сайтов в браузере из-за низкой скорости интернета
Я все же решил рассмотреть этот вариант в первую очередь. Так как скорость подключения непосредственно влияет на скорость с которой будут открываться страницы в интернете. Вполне возможно, что по какой-то причине сильно упала скорость подключения к интернету. Например, какие-то проблемы у провайдера, в вашем маршрутизаторе, помехах (если мы говорим о Wi-Fi сети) и т. д.
Проверить скорость подключения можно на сайте http://www.speedtest.net/ru/. Ссылку на более подробную инструкцию я давал выше. Можно сделать замеры с разных устройств, и подключив интернет непосредственно к компьютеру, или ноутбуку. Без роутера, если он у вас есть.
Например, сейчас я пишу эту статью как раз через 3G модем (который подключен к роутеру, который в свою очередь раздает интернет еще и на другие устройства) и вот такая у меня скорость:
И что я могу сказать, сайты у меня открываются реально медленно. Правда, может быть еще хуже. Но думаю, что даже при 10 Мбит/с страницы в браузере должны загружаться моментально.
В основном, с этой проблемой сталкиваются пользователи, которые подключаются к интернету через 3G/4G модемы. Скорость в сетях 3G/4G может быть очень хорошей, но она очень сильно зависит от загруженности базовой станции и от уровня сигнала. Если модем, или телефон ловит плохо, то скорость будет низкой. Я уже не говорю о 2G сетях (GPRS, EDGE), там все очень медленно.
Выводы: если скорость подключения хорошая, но есть проблема со скоростью загрузки сайтов, значит смотрите эту статью дальше. Если же скорость низкая, то нужно решать эту проблему. Снова же, если интернет у вас через 3G/4G модем, то можно настроить его на лучший примем программой AxesstelPst EvDO BSNL, поднять выше, купить антенну. Если у вас стандартное подключение: кабель — роутер, и скорость низкая только по Wi-Fi, то смотрите статью как увеличить скорость интернета по Wi-Fi через роутер. Если даже при прямом подключении кабеля к компьютеру скорость при проверке не соответствует той, которую обещал провайдер, то можете смело звонить в поддержку своего интернет-провайдера и выяснять этот вопрос.
Что делать, если долго открываются страницы при хорошей скорости интернета
Дальше мы будем рассматривать решения, которые могут помочь лишь при условии, что у вас нормальная скорость подключения к интернету. Ну, скажем, 3 Мбит/с (на загрузку) и выше. Если у вас при проверке показывает например 50 Мбит/с, а сайты еле-еле открываются, то решения описанные ниже должны помочь в решении этой проблемы.
Некоторые варианты:
- Медленная загрузка сайтов из-за переполненного кэша и куки браузера. Ненужные дополнения. Заполненный диск C.
- Вирусы, вредоносные программы.
- Проблемы с сетевыми настройками.
- Медленные DNS-сервера.
- Лишние программы, которые нагружают сеть и компьютер. Антивирусы.
- Медленный VPN-сервер (если вы используете VPN) ?
А теперь подробнее ��
Чистим кэш, куки браузера, проверяем дополнения и свободное пространство диска С
2 Дальше нужно почистить кэш и желательно еще куки (cookie) браузера, которым вы пользуетесь, и в котором медленно открываются сайты. Если у вас Opera, то вам повезло :), так как я писал подробную инструкцию: как очистить историю, кэш, куки браузера Opera.
Во всех брузерах примерно все одинаково. Например, в Google Chrome. Нужно открыть меню, «Дополнительные инструменты» – «Удаление данных о просмотренных страницах». Дальше выделяем «Изображения и файлы в кэше» и «Файлы cookie» и очищаем их. Не забудет выбрать пункт «за все время». Можно сначала попробовать очистить только кэш.
Практически в любом браузере открыть окно с очисткой истории можно сочетанием клавиш «Ctrl + Shift + Del». А дальше только выбираем пункты, которые нужно очистить.
3 Сейчас практически в каждый браузер (Опера, Хром, Mozilla Firefox, Яндек.Браузер) можно устанавливать расширения (дополнения) . И не редко эти расширения сильно тормозят браузер. Особенно, такие как VPN, разные «ускорители» интернета, блокировщики и т. д.
Нужно проверить список установленных расширений (дополнений) в вашем браузере. В Opera это делается вот так:
Отключите ненужные расширения. Или отключите все, для проверки.
Так же проверьте, не включен ли у вас случайно в браузере режим «Турбо» (который не редко замедляет, а не ускоряет загрузку) , или VPN в Opera.
4 Для очистки всех браузеров, самой системы Windows и реестра, или управления автозагрузкой, можно использовать отдельные программы. Я рекомендую CCleaner. Бесплатная (можно легко скачать в интернете) , на русском и простая.
Сначала выделяем пункты которые нужно очистить, запускаем «Анализ», а затем чистим найденный мусор. Сам пользуюсь этой программой. Только смотрите внимательно. Если не уверены, то не ставьте галочек. Можно смело чистить «Интернет-кэш».
Медленная загрузка сайтов из-за вирусов
Точно не лишней будет проверка компьютера на наличие вирусов и прочих вредоносных программ. Если у вас установлен антивирус, и он обновляется, то запустите проверку системы. Так же можно проверить компьютер антивирусным утилитами. Например: AVZ, Dr.Web CureIt!, Kaspersky Virus Removal Tool, Malwarebytes.
Это бесплатные утилиты. Они не устанавливаются, а просто запускаются и проверяют ваш компьютер. Найденные угрозы могут быть удалены.
Сброс настроек сети
Вполне возможно, что те же вирусы внесли какие-то свои параметры в сетевые настройки Windows. И из-за этого появились проблемы с медленной загрузкой страниц в интернете. Чтобы не искать эти параметры вручную, я советую поступить намного проще. Сделать сброс сетевых настроек к заводским.
Сделать сброс очень просто. Я по этим темам писал отдельные статьи:
- Инструкция для Windows 10: https://help-wifi.com/reshenie-problem-i-oshibok/sbros-nastroek-seti-v-windows-10/
- Инструкция для Windows 7, 8, 10: https://help-wifi.com/raznye-sovety-dlya-windows/sbros-nastroek-seti-tcpip-i-dns-v-windows-7/
В командной строке от имени администратора достаточно выполнить несколько команд и перезагрузить компьютер.
После этой процедуры не забудьте перезагрузить компьютер.
DNS-сервера могут тормозить загрузку сайтов в браузере
DNS отвечает за то, чтобы привычные нам адреса сайтов (из букв) преобразовывались в IP-адреса (из цифр) . И если сервер, который отвечает за это преобразование работает медленно, глючит, то и сайты могут загружаться долго. Как правило, все используют DNS-сервера провайдера. Но, можно сменить их на другие.
Я рекомендую прописать DNS-сервера от Google: 8.8.8.8 / 8.8.4.4. Сделать это можно в свойствах подключения к интернету (или Wi-Fi) .
Программы и антивирус
Если у вас установлен какой-то антивирус, то попробуйте его на время отключить. Или отключите встроенный в него брандмауэр. Скорее всего он проверяет каждую страницу, которую вы открываете в браузере, и проверяет очень медленно.
Дальше, что касается программ. Я имею введу программы типа торрент-клиентов, разных программ для скачивания с интернета, загрузки разных фильмов и т. д. Так же есть разные программы для ускорения интернета, оптимизации Windows и т. д. Они как правило всегда запускаются вместе с Windows и прячутся на панели уведомлений. Закройте все лишние, уберите их с автозагрузки (можно через ту же программу CCleaner) . По управлению автозагрузкой в Windows, в интернете есть много инструкций. У нас статья немного на другую тему.
Все лишнее закрываем, отключаем, удаляем. Мало того, что все эти программы могут замедлять загрузку страниц, так они еще и отбирают ресурсы в операционной системы и компьютер работает медленнее.
А может проблема в VPN (если он установлен)?
В наше время, когда провайдеры блокируют доступ к разным сайтам, пользователи, чтобы получить доступ к этим заблокированным сайтам используют VPN. Чаще всего VPN на компьютере настраивается через отдельную программу, или расширение для браузера. Более подробно о расширениях я писал в статье: VPN для Chrome, Opera, Firefox и Яндекс.Браузера.
И соединение через VPN-сервер может быть очень медленным. Особенно, если это бесплатный VPN. Но даже платный сервис может очень часто тормозить. Даже если вы пользовались интернетом через VPN, и все работало хорошо, то сервер через который вы подключаетесь может заглючить в любой момент, или через него подключается много пользователей, и он просто не справляется с нагрузкой. Скорость загрузки сайтов через такой сервер будет очень медленной.
Решение: чаще всего, в настройках программы, или расширения для браузера можно сменить сервер (на другую страну) . Если это не помогло, то полностью отключите VPN. Разорвите соединение и закройте программу. Отключите расширение в браузере. После этого все должно открываться нормально.
Послесловие
Я постарался рассмотреть все известные мне на данный момент причины, из-за которых возникают проблемы со скорость загрузки сайтов. Уверен, что есть и другие решения данной проблемы. Если знаете в чем еще может быть дело, или решили эту проблему другим способом, то расскажите об этом в комментариях. Я с радостью добавлю полезную информацию в статью, а вам все скажут Спасибо!
Конечно же вы можете задавать вопросы по теме. Только у меня одна просьба, в описании своей проблемы пишите результаты проверки скорости вашего подключения к интернету. Или прикрепляйте скриншот к комментарию (у нас есть такая возможность) .
Не тормози: 10 причин, почему ваш сайт медленно грузится
Все знакомы с пословицей «тише едешь — дальше будешь». Но когда речь заходит о производительности сайта, это скорее рецепт провала. Знаем минимум 10 причин, из-за которых может медленно загружаться ваш сайт, и разбираем их с экспертом Selectel.
Одна из наиболее частых причин медленной работы сайта. Изображения с высоким разрешением потребляют много трафика при загрузке и увеличивают размер страницы. Чем он больше, тем дольше загружается сайт.
Формат изображения — еще один важный фактор, который стоит иметь в виду. Например, JPEG-изображения меньше таких форматов, как PNG или GIF. Страницы будут загружаться быстрее, если вы отдадите предпочтение JPEG.
Проверьте размер ваших изображений. Все, что превышает 1 МБ, недопустимо.
Плагины JavaScript облегчили добавление динамического контента на веб-сайты. Но при неправильном использовании JavaScript может снизить скорость загрузки страниц сайта.
Для загрузки и выполнения кода JavaScript требуется время. Поэтому, если вы используете множественные вызовы API для визуализации данных посредством JavaScript, это в большинстве случаев приведет к значительным задержкам при загрузке.
Ваши скрипты могут быть «раздутыми» (bloat), или перенасыщенными. Проверяйте сценарии JavaScript, чтобы увидеть, что вам действительно нужно, а что можно удалить.
Асинхронная загрузка JavaScript обязательна. Она позволяет браузеру не дожидаться полной загрузки скрипта и продолжать загрузку основного HTML и других ресурсов.
Помогаем работать без ошибок.
Selectel
Flash-баннеры некогда были отличным инструментом для повышения интерактивности сайта, но такой контент значительно утяжеляет страницу. Обычно они имеют большой размер, а чем тяжелее файл, тем медленнее он загружается. Что логично.
Постарайтесь уменьшить размер Flash-баннеров.
Наличие большого количества файлов JavaScript, CSS и изображений приводит к чрезмерному росту HTTP-запросов. Когда пользователь заходит на страницу сайта, браузер выполняет несколько запросов для загрузки каждого из этих файлов, что снижает скорость открытия страницы.
Используйте CSS-спрайты для снижения количества HTTP-запросов. Спрайты объединяют множество изображений в одно, сокращая тем самым количество обращений к серверу.
Решение проблем на фронтенде и бэкенде сайта — это гигиенические нормы для любого уважающего себя бизнеса. Здесь поможет простая оптимизация визуального контента, удаление лишнего, сжатие слишком большого, чистка кода. Такие «процедуры» рекомендуется проводить раз в несколько месяцев. В целом, с такой работой справится рядовой IT-специалист.
Грамотное использования механизмов кэширование в разы улучшает производительность веб-сайтов. Если вы вообще не используете эту технологию, то многое теряете. Она позволяет хранить часто используемые данные в «кэш-памяти». Любые повторяющиеся запросы контента обслуживаются из нее, что ускоряет процесс получения данных.
Настроив кэширование, вы значительно улучшите производительность сайта. Вы можете кэшировать разные сущности — от HTTP и запросов к базе данных до изображений. Только не перестарайтесь, кэширование вызывает повышенную нагрузку на веб-сервер!
Еще одна распространенная причина медленной работы сайта — плохое качество кода. Чрезмерные пробелы, встроенные стили, пустые строки и лишние комментарии могут привести к увеличению размера таблицы стилей веб-сайта.
Удалив все эти элементы, вы сократите код, уменьшите размер файла и, как следствие, — время загрузки страницы. Кстати, возможно, после такой «чистки» вы также заметите улучшения по части SEO-оптимизации.
Если вы далеки от написания кода или не хотите в него лезть, есть несколько инструментов, которые можно использовать для очистки и уменьшения файлов таблиц стилей. Кроме того, можно воспользоваться услугами профессиональных веб-студий.
-
Чистота — залог «здоровья»! Следите за гигиеной кода.
Не ленитесь использовать CSS (Cascading Style Sheets) — код, который вы используете для стилизации веб-страницы.
Сжатие передаваемого трафика веб-сервером — простой и действенный способ увеличить скорость загрузки сайта. GZIP обеспечивает значительное (до 90%) уменьшение объема веб-трафика (HTML,CSS, файлы JavaScript и т.д.). В результате браузер клиента получает трафик в сжатом виде, который распаковывается при получении.
Если вы еще не активировали GZIP-сжатие на своем сайте, это первое, что вам следует сделать.
Конечно, реклама помогает монетизировать сайт с высоким трафиком. Но она не должна влиять на его производительность или удобство пользователей .
Каждый рекламный баннер — это дополнительный HTTP-запрос, а порой и вызовы скриптов, на обработку которых тратится время загрузки. Всплывающие окна, межстраничные переходы и автоматическая загрузка видеорекламы могут создавать сотни HTTP-запросов, с которым ваш сервер, на котором расположен сайт, просто не справится.
Рекламные объявления — это лишние HTTP-запросы, которые замедляют загрузку страницы. Используйте их только там, где они точно сработают и «окупят» свой вес.
CDN (Content Delivery Network) — это распределенная сеть независимых серверов, которые находятся в разных географических точках и доставляют посетителям веб-контент с высокой скоростью и производительностью.
Все входящие запросы на контент обслуживается сервером, расположенным в ближайшем к посетителю центре обработки данных. Это позволяет минимизировать время приема-передачи (round-trip time, RTT) и предоставлять запрошенный контент гораздо быстрее.
В деле устойчивости работы вашего сайта или приложения расстояние имеет значение. Например, ваш хостинг находится в Санкт-Петербурге. Чтобы клиенты во Владивостоке не страдали от долгой загрузки сайта, лучше использовать сеть доставки контента. Контент закэшируется на ближайшем к Владивостоку CDN-сервере, и ваш сайт будет загружаться у пользователей так же быстро, как если бы они жили в Санкт-Петербурге. У Selectel более 37 точек присутствия в России, странах СНГ и Европе, более 300 кэш-серверов, а емкость сети составляет более 10 Тбит/с.
Настройте CDN. Технология может сильно помочь, если посетители вашего сайта разбросаны по всему миру. Но, если расположение серверов совпадает с географическим положением вашей целевой аудитории, CDN позволит снизить на них нагрузку, доставляя статический контент.
Выбор хостинг-провайдера имеет большое значение, когда дело доходит до производительности сайта. Да, это тоже может повлиять на скорость загрузки сайта!
Если вы уже исключили все вышеописанные причины торможения загрузки сайта, возможно, вашу проблему решит смена хостинг-провайдера. Отдавайте предпочтение провайдеру, который предлагает услуги по оптимизации инфраструктуры, включенные в стоимость хостинга.
На что смотреть при выборе хостинг-провайдера? Во-первых, отдавайте предпочтение проверенным игрокам, которые не первый год на рынке, — будет возможность изучить отзывы в интернете. Также стоит рассмотреть перечень дополнительных сервисов. Подойдет ли провайдер, если вы начнете расти и вам понадобятся решения более высокого порядка? Лучше подумать заранее, так как обычно переезд на другой хостинг — трудоемкая и не всегда приятная процедура. Узнайте, где заканчивается зона ответственности провайдера за работу вашего сайта. Несет ли он какие-то денежные обязательства за падение и простой сервера? Наконец, толковый хостинг-провайдер проконсультирует вас и поможет решить возникшие проблемы.
Скорость загрузки страниц веб-сайта зависит от множества факторов, таких как неоптимизированные изображения, большое количество HTTP-запросов, громоздкий код, проблемы с JavaScript. И это лишь некоторые из них.
Выяснить, что именно вызывает замедление загрузки сайта, не всегда просто. Но найти корень проблемы очень важно. Потому что ее решение позволит вам не терять деньги из-за несостоявшихся клиентов. В наше время каждая миллисекунда может иметь значение.
Не пропускайте полезное, подписывайтесь на блог Selectel.
Эту статью писал не эксперт и не специалист. Это делал копирайтер.
Причем, для рерайта были выбраны статьи из 2015 года.
Если бы это была тетрадь, то в помарках была бы каждая строка.
А оценка была бы — 2.
Хотите подробностей?)
печаль однако, сайт на дремучем вордпрессе с базой, пошарпанной плагинами и огромным слайдером на весь экран с кучей картинок, лучше резалт дает. Уважаемый Гуру, дадите подробности?
Короче либо тест тупит, либо хостинг иногда исполняет у вас.
Здравствуйте. Спасибо, что обратили на это внимание. Повторить замер не смог, но сам видел такие замеры, примерно раз в сутки, в нашем мониторинге, который снимает все значимые показатели каждые 15 минут.
Скорее всего дело в каком-то магистральном канале ДЦ, или загрузке агента замера PageSpeed. Мы обязательно разберемся и решим этот вопрос. Обычно показатели нашего сайта в зеленой зоне, и перезамер покажет другие результаты. В любом случае проблема с показателями есть, вы совершенно правы.
Наш сайт на VUE.JS + NUXT. Блог — на WordPress.
C плагинами, верно, если вы еще не пользуетесь ими, то обязательно попробуйте.
Картинки. В нашем 117 прямом эфире мы показывали фотогалерею на 700+ фото высокого качества с молниеносной загрузкой на одной странице. Мы любим много картинок.
И кстати, спасибо, что зарегались специально для этого коммента.
А вот и настоящие скрины из PageSpeed Insights:
а есть пример ускоренного сайта на wordpress?
Сейчас если переводить на более понятную всем автомобильную тематику ваш сайт — это ускоренный корч с дизайном 2010 года, с которого даже капот сняли.
Больше впечатлил бы автобус или фура с прицепом (виджетами обратной связи и обратным звонком). А главное счетчики, особенно яндекса :). Без них ну совсем все просто.
Конечно есть!
Ничего не надо убирать с сайта, надо грамотно всё отложить и равномерно разместить в потоке загрузки.
Посмотрите тоже про Яндекс.Метрику:
Ситуация, когда сайт был создан лет 6-8 назад и никто им не занимался, — достаточно частое явление. Там будет и Flash, и возможное отсутствие кэширования, и чудовищные конструкции на JS. Советы из статьи в этом случае позволят существенно ускорить работу сайта без необходимости создания его с нуля с помощью современных инструментов (следовательно, и без серьезных затрат на это).
Ну так советы не актуальные, ничего не ускорить с их помощью в 2020.
Я понимаю, что комментарии технические и тут нужен настоящий спец по фронту, который еще и опыт ускорения сайтов имеет (к слову таких в России на пальцах пересчитать можно). Но дело в том, что статья бесполезная.
Флэша нет уже ни у кого. JS — да, но в статье про это написано не верно.
3. Слишком много Flash-контента
— это какого года статья? проснитесь, автор, adobe уже не делает flash и google его не будет поддерживать
Официальная поддержка Adobe Flasg Player заканчивается 31 декабря 2020 года.
Даже не помню когда последний раз встречал Flash на сайтах. Году в 2008 наверное.
Держите наркоманов, у них много флэша в 2020-м!
Остальное ничуть не хуже, даже лучше.
У вас просто девочка за 30 рублей контентом занимается или вы этим оправдываетесь перед клиентами?
"Старайтесь не создавать несколько таблиц стилей CSS, если можно обойтись одной."
Лучше делить critical css и остальные стили текущей страницы. Это как раз деление стилей, что точно с гарантией улучшит скорость загрузки.
Странно, что автор советует обратное.
"Формат изображения — еще один важный фактор, который стоит иметь в виду. Например, JPEG-изображения меньше таких форматов, как PNG или GIF. Страницы будут загружаться быстрее, если вы отдадите предпочтение JPEG."
Кхм. WEBP весит еще меньше и поддержка уже хорошая.
AVIF — еще меньше весит, чем webp, но поддержка пока небольшая. Лучше делать изображения в каждом формате дать возможность выбирать, что грузить.Браузер сам выберет, что оптимальнее показать. Например через тег picture.
автор вообще про WEBP не слышал, щас напугаете его.
FLASH? Ну серьезно. Камон.
Safari никогда не поддерживал Flash. И правильно делал. Это мертвая технология. Если у вас есть флеш, то вы где-то свернули не туда по дороге жизни. Даже комментировать нечего, потому что это
1) небезопасно
2) медленно
3) не кросс-браузерно
Покажите пару сайтов с Flash? Реально интересно стало, откуда этот совет всплыл.
у меня в портфолио на фл-ру лет пять назад все работы с флеш-анимацией похерились, на фл-ру оказывается есть соображающие.
А есть промокод на бесплатную активацию в nginx?
Дальше по пунктам.
Второе.
Вы пишете:
"Одна из наиболее частых причин медленной работы сайта. Изображения с высоким разрешением потребляют много трафика при загрузке и увеличивают размер страницы. Чем он больше, тем дольше загружается сайт."
Загрузить — наименьшая проблема. Отрисовать DOM, применить стили и выполнить весь js-код на странице — вот это задача еще та!
Хорошая статья для 2014 года, но сейчас все уже очень сильно поменялось, и нужно оптимизировать не загрузку контента а отрисовку и выполнение. Загрузка отошла на второй план, но конечно тоже важно. Спасибо за статью, понастальгировал по временам, когда ускорение сайта сводилось к выполнению подобных советов.
"Асинхронная загрузка JavaScript обязательна. Она позволяет браузеру не дожидаться полной загрузки скрипта и продолжать загрузку основного HTML и других ресурсов."
Хорошее решение, это позволит улучшить первую отрисовку, но вот TTI (время до полной интерактивности страницы) точно не улучшится.
Наши технические специалисты рекомендуют самостоятельно управлять приоритетностью выполнения кода. Большинство функций анимации можно сделать на CSS без использования JS.
а как же падающий снег на сайте? скоро Новый Год, без снега никак. )))
Снег. Падает. Классика.)))
То чувство, когда плюсанул статью не из-за статьи, а из-за комментов.
Ребят, у вас же реально хороший хостинг, наймите копирайтеров подороже.
Лучше пусть возьмут поумнее. Дело то не в деньгах
Комментарий удален модератором
Блин, какой флэш. Adobe в декабре 2020 завершает поддержку формата.
Попутно спалю фишку — выкидываем метрику яндекса, выкидываем живосайт, выкидываем весь хлам от рамблера, майл-ру, лайвинтернет- эгегей,и вот уже плюс 30-40 баллов от гугла!
Можно не выкидывать, а отложить в потоке загрузку на 200-300 мс и блокировка с потока снята.
хз, живосайт да(его вообще на 3 секунды оттягиваю, ибо нефиг), яндекс начинает мгновенно орать.
орать да, но собирать данные продолжает, проверено.
хм, интересно. надо протестить,как бы меня ни тошнило от сервисов яндекса.
Яндекс на самом деле очень быстро отдаёт метрику и выполняет.
Но так как метрика лезет вперёд при выполнении, то попадает в блокированный поток и выполняется очень долго. Если управлять потоком грамотно, то метрика незаметна в потоке.
Посмотрите наш эфир на эту тему: 93: Что делать с внешними скриптами аналитики, чтобы сайт не тормозил с Яндекс.Метрикой . Там Емель тайминг, смотреть удобно.
"По возможности используйте JPEG вместо PNG, особенно для больших изображений. На иконки правило не распространяется."
PNG нужно использовать только там, где нужна прозрачность. В остальных случаях — JPEG и WEPB в качестве альтернативы. Формату PNG больше 25 лет.)
Используйте инструменты мониторинга загрузки страницы, чтобы понять, как сильно изображения влияют на этот процесс.
Pingdom — точно не стоит использовать, они сами знают, что их замеры неверные, и даже подтверждают это в личной переписке. Прикрепляю, что отвечают в суппорте, если им задать пару грамотных вопросов.
Перевод вкратце такой:
Мы знаем, что наши замеры неадекватные. Мы когда-нибудь это починим. Скорее всего когда перейдем на Lighthouse (движок PageSpeed Insights).
"Используйте CSS-спрайты для снижения количества HTTP-запросов. Спрайты объединяют множество изображений в одно, сокращая тем самым количество обращений к серверу."
Спасибо вам. Я как на десять лет помолодел.) Вот комментарий от нашего технического отдела.
"Лучше вместо спрайтов переходить на современные svg, которые не придется спрайтить и которые можно включить в код страницы. Как показывает практика, чаще всего приходилось спрайтить иконки/логотипы/итд, а их как раз лучше использовать в векторе. Он и весит меньше и их можно сразу включить в код." (Антон Белогородцев).
"CDN (Content Delivery Network) — это распределенная сеть независимых серверов, которые находятся в разных географических точках и доставляют посетителям веб-контент с высокой скоростью и производительностью.
Все входящие запросы на контент обслуживается сервером, расположенным в ближайшем к посетителю центре обработки данных. Это позволяет минимизировать время приема-передачи (round-trip time, RTT) и предоставлять запрошенный контент гораздо быстрее."
Всё так, но не всегда. Чаще всего, при подключении CDN уменьшается RTT, но увеличивается TTFB, так как соединение происходит сначала с сервером CDN, а затем с сервером хостинга.
✅ Как нужно: кэшировать на серверах CDN’ом страницы, чтобы открытие происходило непосредственно с ближайшего севрера без установки соединения с родным хостингом сайта.
"Но, если расположение серверов совпадает с географическим положением вашей целевой аудитории, CDN позволит снизить на них нагрузку, доставляя статический контент."
Почему сайт долго грузится
Увеличение скорости загрузки — это один из способов улучшить поведенческие факторы и юзабилити сайта, а, вместе с этим — конверсию. Часто владельцы сайтов не понимают, почему их ресурсы загружаются медленно.
Поэтому в данной статье я решил собрать 8 основных факторов, тормозящих сайт, и способы их устранить. Хотите сделать сайт быстрее? Поехали!
Данный источник утверждает, что загрузка страницы за менее, чем 100 миллисекунд дает пользователю ощущение моментальной загрузки. Как показали исследования, около половины (40%) посетителей откажутся от сайта, если он загружается более 3 секунд. Было замечено, что при превышении времени загрузки контента 2-х секунд показатель отказов увеличивается на 30%.
Дополнительным стимулом для вебмастеров становится влияние этого фактора на мобильную выдачу в Google с июля 2018 года.
Перевіряємо і збільшуємо швидкість завантаження сайту
Низька швидкість завантаження сайту — один з «смертних гріхів» просування, причому «б’є» повільність відразу по декількох позиціях. Це і дратівливий чинник для користувача, який швидше за піде шукати потрібне далі, ніж буде витрачати час на повільній сторінці, і «червона ганчірка» для систем пошукової видачі.
Піднятися в топ без оптимізації швидкості завантаження сайту — місія тільки для відчайдушних. Сторінка, яку для відкриття потрібно більше 3 секунд , Вже зараз не викликає довіри у пошукових систем. Далі цей алгоритм буде тільки набирати обертів. Тому, скільки б сил ви не вклали в інші напрямки модернізації ресурсу, без роботи над прискоренням не обійтися.
Як перевірити даний показник і що робити, якщо справи йдуть гірше, ніж хотілося б? Зібрали для вас всю корисну інформацію по темі в одному матеріалі.
Як швидкість завантаження впливає на позиції у видачі та конверсію
Core Web Vitals — саме так називаються чинники Google для оцінки якості ресурсу, які пошуковик продовжує застосовувати в 2022 році. Вони враховують в тому числі час, що необхідний на очікування першого взаємодії з контентом. І повірте, чим більшим буде цей показник, тим менше шансів залишиться на гарне ранжування.
дослідники DoubleClick (Компанії-піонера інтернет-реклами) підрахували, що більше половини користувачів залишають сайт, якщо той вантажиться довше 3 секунд. Кожна наступна секунда очікування відрізає від кількості ваших клієнтів ще до 7%. У мобільній версії все ще гірше — користувачі смартфонів зовсім не схильні чекати навіть зайву секунду.
Якою ж має бути швидкість завантаження сайту?
Повільне завантаження — більше 4 секунд
Середня — 2,5-4 секунди
Швидка — 0 — 2,5 секунд
На що впливає цей показник?
- Індексація сайту , Який демонструє низьку швидкість завантаження, може зовсім не відбутися, тому що у пошукових роботів встановлений ліміт часу на відвідування. Якщо в цей період контент не завантажили, пошуковик його просто не сприйме, а сторінка не потрапить в індекс.
- Поведінкові чинники теж тісно пов’язані зі швидкістю завантаження сторінок.Чим вище відмова користувачів (догляд з ресурсу), тим нижче статистика сайту.У підсумку це обов’язково вплине на ранжування.
- Конверсія падає, якщо чекати відгуку на дію відвідувачеві доводиться довше 5 секунд. Низька швидкість завантаження сторінок впливає на показники тривалості перебування на сайті, кількість внутрішніх переходів і ін.
Важливо!У деяких випадках повільність ресурсу цілком можна пробачити — якщо це великий інтернет-магазин, портал з великою кількістю графічного контенту.
Як перевірити швидкість завантаження сайту
Дізнатися, як йдуть справи з даними показником, набагато простіше, ніж здається на перший погляд. Існує досить багато автоматизованих інструментів перевірки, вам залишається лише вибрати підходящий.
PageSpeed Insights
Визнаний лідер серед seo-фахівців і власників сайтів. Це офіційний ресурс Google, І він не просто дає максимально детальну інформацію по всім потрібним параметрам, а й рекомендує дії для поліпшення показників.
GTmetrix
Крім стандартної функції оцінки швидкості завантаження сайту, дає можливість дивитися історію перевірок . Це зручно для того, щоб аналізувати ефективність вжитих заходів і відслідковувати зміни.
SeoLik
Оцінює сайт за власною шкалою (від 0 до 100 балів). Містить безліч зручних інструментів і відразу вказує на проблемні місця ресурсу.
Pingdom Tools
За допомогою цього сервісу зручно моніторити швидкість завантаження сторінок сайту в деталях. Він дає уявлення про те, наскільки швидко відбувається отрисовка елементів CSS, як довго завантажуються картинки, скрипти та інше. Завдяки такому детальному аналізу можна зрозуміти, де саме криється корінь проблеми, а значить, вирішити її швидше і ефективніше.
Час діяти: як збільшити швидкість завантаження сайту
Отже, перевірка виконана, проблема наявності. Що робити далі? Для прискорення сайту потрібно проаналізувати слабкі місця і вжити заходів щодо їх усунення. Розглянемо основні позиції, які варто опрацювати.
Важливо! Черговість опрацювання проблемних місць обов’язково повинна бути продиктована рівнем неполадок — спочатку потрібно усунути найбільші проломи, і тільки після цього вдосконалювати інше.
Стисніть зображення
Швидкість відтворення безпосередньо залежить від «тяжкості» картинок. Мінімум, який варто спробувати без шкоди для візуала — стиснути зображення по довгій стороні хоча б до 1600 пікселів . Можна також пожертвувати 10-20% якості. Швидше за все, це не буде помітно, але заощадить кілобайти. Спробуйте зробити це і провести повторну перевірку швидкості завантаження сайту — побачите миттєвий результат.
Хороший варіант стиснення — gzip . У разі використання техніки, дані сайту архівуються на спеціальному сервері. У браузер вони передаються саме в стислому вигляді, і він сам розпаковує їх. Таким чином можна відчутно «полегшити» ресурс, при цьому без видимих змін.