Почему некоторые сайты долго грузятся и не открываются

Тормозит браузер? Долго грузятся страницы? Рассказываем, как решить эти проблемы

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

Почему браузеры тупят?

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

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

Браузерам нужен доступ к оперативной памяти, так как брать данные с жесткого диска или SSD гораздо дольше, чем из ОЗУ. Требование большого объема «оперативки» — это своего рода плата за быстродействие того же Chrome, который, вопреки всеобщему мнению является не самой прожорливой программой своего рода.

И все-таки, как получить «скидку» от браузеров и оптимизировать их работу?

Google Chrome

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

1. Открываем браузер и нажимаем сочетание клавиш Shift + Esc;
2. В открывшемся окне отмечаем все работающие в фоновом режиме процессы, которыми вы, разумеется, не пользуетесь в данный момент;
3. Кликаем на «Завершить процесс».

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

Облегчить работу Chrome можно используя раздел с экспериментальными настройками браузера, для доступа к которым нужно ввести в адресной строке: chrome://flags/. После этого можно ознакомиться со всем списком настроек, среди которых, например, есть опция «Переопределение списка программного рендеринга», позволяющая браузеру быстрее рендерить страницы сайтов. Чтобы включить ее, вводим в поиске ignore-gpu-blacklist и выбираем пункт «Enabled».

Расширения

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

1. OneTab. Расширение позволяет одним кликом закрыть все открытые вкладки, а позже, если вам будет нужно, отдельно открыть некоторые из них. Несмотря на простоту OneTab, оно значительно облегчает нагрузку на оперативную память и не дает ее захламлять ненужными процессами.
2. The Great Suspender. В отличие от прошлого участника списка, The Great Suspender не закрывает разом все вкладки, оно просто выгружает их содержимое из оперативной памяти компьютера. Если вам нужно будет вернуться к работе на каком-нибудь из сайтов, просто нажимаем на него в расширении и оно возвращает вкладку к «жизни».
3. TabMemFree. Расширение схоже по функциональности с прошлыми участниками списка, но имеет одну важную особенность. TabMemFree позволяет защитить определенные вкладки от закрытия. Например, если вы слушаете на фоне музыку или смотрите видео, вы можете добавить в исключения вкладку с проигрывателем.
4. Tab Wrangler. Снова расширение для работы со вкладками, но из всего списка оно является самым богатым на настройки. К примеру, тут вы можете выставить время закрытия для каждой из вкладок, а также выставить число невосприимчивых к расширению вкладок.

Mozilla Firefox

Несмотря на то что у многих именно Chrome ассоциируется с «поеданием» больших объемов ОЗУ, другие браузеры немногим ему уступают и Mozilla Firefox не исключение. Но, как и в случае с браузером от Google, «мозилу» тоже можно оптимизировать.

У Mozilla есть схожий с «хромовскими» экспериментальными настройками раздел, в котором можно настроить потребление браузером оперативной памяти. Однако в перечне пунктов у «мозилы» есть один пункт, который гораздо эффективнее, чем все вышеописанные в Chrome:

1. Вводим в адресную строку (именно вводим, не копируем): about:config;
2. Обещаем браузеру быть осторожными и принимаем условия;
3. В поисковой строке вводим следующий параметр: browser.sessionhistory.max_total_viewers;
4. Меняем исходное значение -1 на 0;
5. Закрываем вкладку и перезапускаем браузер.

Вышеописанными действиями мы изменили подсистему кеширования данных браузера. Проще говоря, нам удалось снизить потребление ОЗУ не только в фоновом режиме, но и при непосредственном путешествии по интернету. После этого браузер прекратит сохранять в оперативной памяти вкладки, которые он планировал позже достать из кеша или ОЗУ. Mozilla будет более охотно все грузить из сети, поэтому, если у вас хороший интернет, вы не столкнетесь с замедлением работы.

В этой же вкладке about:config можно и полностью запретить браузеру создавать кеш в оперативной памяти. Чтобы это сделать, выполняем описанные ниже действия:

1. Открываем about:config;
2. В поиске пишем: browser.cache;
3. Выбираем из списка пункт browser.cache.memory.enable и выставляем значение «false»;
4. Закрываем вкладку и перезапускаем браузер.

Теперь Mozilla не будет использовать нашу оперативную память как хранилище своего кеша, что значительно уменьшит «прожорливость» браузера, но в то же время заметно скажется на скорости его работы. Чтобы соблюсти баланс между быстродействием и «аппетитом» можно использовать параметр browser.cache.memory.max_entry_size.

1. Открываем about:config;
2. В поиске пишем: browser.cache;
3. Выбираем из списка пункт browser.cache.memory.max_entry_size и выставляем желаемое значение из представленной ниже таблицы;
4. Закрываем вкладку и перезапускаем браузер.

В приведенной таблице правый столбик означает то значение, которое необходимо ввести в browser.cache.memory.max_entry_size, чтобы браузер использовал указанный в левом столбике объем памяти.

Расширения

Как и в случае с Chrome, немаловажную роль в скорости работы Mozilla играют установленные вами расширения. Желательно перейти во вкладку с настройками браузера и отключить те дополнения, которыми вы не пользуетесь, а вместо них установить действительно полезные для вашей «оперативки». Вот парочка дополнений, которые смогут разгрузить ваш браузер и ОЗУ:

1. OneTab. Как вы могли догадаться, это дополнение можно установить не только на Chrome, но и на Mozilla. Функциональность версий не отличается, поэтому если хотите бороться с «прожорливыми» вкладками, ставьте расширение и деактивируйте ненужные страницы.
2. Auto Tab Discard. Схожее с OneTab приложение, которое позволяет экономить оперативную память путем контроля за неактивными вкладками. Вы можете выставить время, по истечении которого страницы будут закрываться. При этом, вы с легкостью сможете их вернуть в любой момент.

Яндекс.Браузер

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

В Яндекс.Браузере тоже есть раздел с экспериментальными настройками, для получения доступа к которому нужно ввести в адресную строку: browser://flags/. После этого мы увидим абсолютно тот же перечень свойств, что и в Chrome. Поэтому поднимаемся к описанию методов ускорения «хрома» и повторяем описанные там действия.

Кроме идентичного раздела с экспериментальными настройками, в Яндекс.Браузере есть свой диспетчер задач, который включается тем же сочетанием клавиш Shift + Esc. Открываем его и закрываем все ненужные плагины и расширения, влияющие на скорость работы.

Так как браузеры используют один движок, все расширения, что работают в «хроме», будут функционировать и в Яндексе. Поэтому отправляемся в пункт про браузер от Google и ставим те расширения, которые там описаны. Дополнения, к слову, ставятся из официального магазина Google Chrome.

В Яндексе есть еще одна крайне полезная функция, которая позволит в два клика ускорить работу браузера:

1. Заходим в настройки браузера;
2. Нажимаем «Включить турбо»;
3. Готово.

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

Opera

Opera тоже имеет общие корни с браузером от Google. Тут также есть секретные настройки, доступ к которым можно получить после ввода в адресную строку: opera://flags/. Вводим в поиске настроек ignore-gpu-blacklist и выбираем пункт «Enabled». Теперь страницы сайтов будут рендериться быстрее.

Общий движок браузеров позволяет все тем же сочетанием клавиш Shift + Esc вызвать местный диспетчер задач и закрыть все ненужные процессы.

Несмотря на то что Opera работает все на том же движке WebKit, расширения придется ставить уже не из магазина Google. Переходим на сайт с дополнениями для «оперы» и устанавливаем расширение Tab Suspender (Tab Unloader). Дополнение позволяет контролировать количество активных вкладок. Если вы долго не переходите на открытую страницу, она отправиться в спящий режим и компьютер не будет тратить своих ресурсов на хранение данных с этой вкладки. Некоторые особенно нужные вам вкладки можно добавить в исключения, чтобы заботливые руки расширения не отправили их в режим сна.

Режим «Турбо», к сожалению, пропал в последних компьютерных версиях Opera, но он все еще остался на мобильных версиях браузера.

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

Не тормози: 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 позволит снизить на них нагрузку, доставляя статический контент."

✅ Кэшировать нужно не только статику, но и частично динамику.

Ладно, не буду ждать ответ. А то весь хайп пропустим.
��
��
Давайте по порядку. Надеюсь, вы сможете переписать статью, учитывая правки.
Но первая правка будет самая сложная. У нас на рейтинге сайтов хостинг-провайдеров есть сайт Селектела. И он занимает 95 позицию из 96. Последний Mail.Ru Cloud Solutions.
Нагуглить его просто — так и пишите "рейтинг скорости загрузки сайтов хостинг провайдеров". Мы будем где-то в топе.

Так вот. Полная интерактивность сайта наступает после 30 секунд. Это крайне плохой результат. Учитывая это — писать такую статью было ошибкой, потому что ни один, даже самый вредный совет из неё у вас не сделан у самих.

Почему так долго грузится сайт? Проблемы с зависаниями

Существует множество причин, почему так долго грузится сайт — чрезмерное количество HTTP-запросов, неоптимизированные изображения, «грязный код», отсутствие кэширования, множество рекламы, проблемы с хостингом и т. д. Задача вебмастера в том, чтобы найти причину, а уже после приступить к ее решению. Ниже приведем ТОП-7 причин, почему некоторые сайты долго грузятся и не открываются, и что с этим делать.

Ошибки JavaScript

Если JavaScript-код написан неэффективно, а на страницу загружается много файлов, сайт висит. Для ускорения загрузки стоит применить следующие рекомендации:

1. Сократите размер JavaScript-файлов, объединив и уменьшив их количество. Это снизит число запросов к серверу и уменьшит время открытия.
2. Оптимизируйте код и убедитесь, что он выполняется эффективно и не содержит ненужных операций.
3. Используйте асинхронную загрузку JavaScript с помощью атрибутов «async» или «defer» в теге скрипта. Это позволит параллельно загружать другие ресурсы и выполнять Ява Скрипт. Отсутствие такой опции часто объясняет причину, почему все грузится очень долго.
4. Анализируйте и удаляйте неиспользуемые зависимости и библиотеки, чтобы сократить объем.
5. Размещайте внешние зависимости на надежных и быстрых серверах или используйте Content Delivery Network (CDN), чтобы ускорить загрузку.
6. Тестируйте производительность сайта с использованием инструментов разработчика браузера и оптимизируйте узкие места.

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

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

Для решения проблемы сделайте следующее:

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

Нет ZIP-сжатия

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

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

Множество HTTP-запросов

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

Для решения проблемы сделайте следующие шаги:

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

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

Много Flash-контента

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

• используйте вместо Flash современные веб-стандарты, такие как HTML5, CSS3 и JavaScript;
• переходите на мультимедийные форматы с лучшей производительностью и совместимостью: HTML5 Video и HTML5 Audio;
• удалите ненужный флеш-контент, который больше не требуется или не используется;
• оптимизируйте Flash, из-за которого часто долго грузит интернет-ресурс;
• предупреждайте пользователя об использовании флеш-контента;
• учтите, что Flash может не поддерживаться в мобильных устройствах.

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

Загруженность рекламой

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

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

Плохой хостинг

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

1. Используйте инструменты для проверки скорости загрузки, такие как PageSpeed Insights от Google или GTmetrix. Они помогают оценить производительность хостинга и выявить проблемные места.
2. Свяжитесь с провайдером и сообщите о проблеме. Специалисты могут предложить решения или помогают перейти на более надежный и быстрый хостинг.
3. Исследуйте альтернативные варианты. Сравните производительность, функциональность и отзывы пользователей. Рассмотрите переход на более надежный и быстрый сервис, который соответствует потребностям интернет-ресурса.

Низкое качество хостинга — одна из главных причин, почему долго грузит или виснет сайт, но скорость хорошая. Для защиты от проблем выбирайте VPS хостинг от VPSville. Мы предоставляем услуги виртуального сервера по цене от 250 рублей в месяц, гарантируем надежность и высокую скорость загрузки. После подключения услуги вопроса, почему сайт плохо или долго грузится, больше не возникает. Дополнительно клиентам доступен cloud-сервер, ВПС-хостинг, приватный сервер VDS и другие полезные опции.

Итоги

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

Почему сайт стал работать медленно? 9 причин, и какие есть решения

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

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

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

1. Большие и тяжелые изображения

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

Бороться с такими картинками нужно еще на этапе загрузки:

Поменять основной рабочий формат. PNG стоит заменить на JPG (можно не менять небольшие иконки и значки). Можно также использовать WebP, это современный формат сжатия без потери качества от Google. Однако при WebP изображения не всегда корректно отображаются на устройствах Apple. Поэтому лучше выбрать универсальный JPG.

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

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

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

2. Отсутствие кэширования

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

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

3. «Грязный» код

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

Советы по оптимизации:

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

Во-вторых, использовать CSS. Если это возможно, таблица стилей должна быть одна.

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

4. Неоправданно большое количество запросов к серверу

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

Во-первых, нужно сокращать количество Javascript и CSS элементов, отправляющих HTTP запросы на сервер.

Во-вторых, можно использовать CSS-спрайты. Это объединение всех изображений на странице в один элемент.

CSS-спрайты кратно сокращают количество запросов.

5. Большое количество рекламы на сайте

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

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

6. Недостаточность ресурсов сервера и отказ от CDN

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

Тут есть два совета:

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

Использовать CDN (Content Delivery Network) — это сеть из географически удаленных независимых друг от друга серверов. На каждом из этих серверов размещена кэшированная версия сайта. А пользователь при входе на сайт, автоматически подключается к географически ближайшему серверу. Это сильно сокращает показатель RTT (Road-trip Time). Чем ближе сервер к конечному пользователю, тем быстрее грузится страница.

То, что сервера в сети CDN независимы друг от друга, решает еще одну серьезную проблему — аптайм работы ресурса. Если возникнет проблема (любого характера) на одном из серверов, пользователь все равно сможет воспользоваться сайтом. Просто он будет автоматически перенаправлен на другой сервер. Вопрос постоянной доступности сайта и высокого uptime не менее важен для SEO, чем скорость загрузки. Если робот поисковой системы будет пытаться подключиться к вашему сайту и часто видеть его в неработающем состоянии, вы вряд ли будете попадать на перрвые страницы даже по низкочастотным запросам.

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

7. Ошибки JavaScript

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

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

Для оптимизации стоит:

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

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

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

8. Много Flash элементов

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

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

9. Не настроено GZIP-сжатие

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

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

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

Оптимизация скорости загрузки и решение возникающих проблем производительности — это элементарные нормы «гигиены сайта», которые нужно проводить хотя бы раз в 2-3 месяца. Это прямые обязанности команды поддержки.

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

В интернете достаточно много сервисов-сканеров, например Google Pagespeed Insights, при помощи которых можно провести аудит загрузки сайта.

Но если сравнивать такое автоматическое сканирование с ручным аудитом специалиста по автоматизации, то оно заметно уступает в эффективности.