5 простых способов ускорить работу браузера, чтобы сайты грузились быстрее

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, чтобы браузер использовал указанный в левом столбике объем памяти.

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

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

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

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

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

Как оптимизировать картинки для быстрой загрузки

Большое руководство по SEO для картинок

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

Большая часть советов основана на вебинаре специалиста технического SEO и реверс инжиниринга Деми Мурыча (Demi Murych).

Требования к картинкам:

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

Технические вопросы:

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

Заполнение метатегов:

какие метатеги нужно заполнять обязательно, а какие по желанию;
как заполнять title и alt;
важно ли название файла для поисковика.

Как настроить отложенную загрузку картинок — lazy loading изображений

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

Есть несколько вариантов настройки:

Картинки загружаются по мере просмотра:

Отображение картинок с отложенной загрузкой

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

Формат WebP: нужно ли использовать его для оптимизации

WebP — это формат графических изображений, его разработали в Google в 2010 году. Получилась альтернатива PNG и JPEG, но с меньшим размером при таком же качестве изображения. При этом в WebP можно сохранить прозрачность фона или анимацию.

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

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

Что со скоростью в России?

Для того, чтобы понять ситуацию с доступом в Интернет в России, мы собрали данные из различных компетентных источников: доклады Яндекса, Одноклассников и отчет компании Akamai. По поводу последней можно сказать, что эта сеть CDN имеет присутствие в России и данным можно доверять.

В целом Россия имеет неплохие показатели по скорости доступа среди европейских стран. По данным отчета Akamai за 2017 год, мы находимся на 24 месте в Европе и 44 месте в глобальном рейтинге по средней пропускной способности — 11,8 Мбит/с. По пиковым значениям это 15 место в Европе и 38 глобально — 69,3 Мбит/с. Для мобильных пользователей приводится средняя скорость в 9,9 Мбит/с (для сравнения в США — 10,7 Мбит/с).

По данным отчета Speedtest.net за первый квартал 2018 года, показатели России достаточно высоки для широкополосного доступа и средние по мобильному Интернету:

Широкополосный доступ: 38,09 Мбит/с (загрузка), 42 место в рейтинге.

Мобильный доступ: 16,26 Мбит/с (загрузка), 78 место в рейтинге.

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

По данным сети «Одноклассники» (ok.ru) в России такие средние показатели мобильного интернета:

• EDGE — 0,2 Мбит/с, 2,5% потери, 1000 мс RTT;
• 3G — 1,0 Мбит/с, 0,5% потери, 600 мс RTT;
• 4G (LTE) — 2,0 Мбит/с, 0,7% потери, 220 мс RTT;
• Wi-Fi — 2,2 Мбит/с, 0,5% потери, 110 мс RTT.

Как видно, показатели гораздо скромнее маркетинговых лозунгов сотовых сетей.

Данные из сервиса поиска Яндекса добавляют ясности в задержки в мобильных сетях (медиана):

• Wi-Fi — 36 мс;
• 4G — 77 мс;
• 3G — 146 мс;
• 2G — 2211 мс.

Почему загрузка страниц в Тор браузере столь медленная

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

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

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

В таких случаях, следует проверить несколько деталей:

1. Прокси-сервер.
2. Установленный уровень безопасности.

Прокси сервер

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

Сделать это можно так:

1. Зайдите в программу. Нажмите на кнопку в виде трех полос в правом верхнем углу. И далее прейдите в «Настройки».
2. Переключитесь на вкладку «Tor».
3. И здесь в блоке «Дополнительно» снимите чекбокс с пункта «Я использую прокси…», или смените прокси на более быстрый.
4. Перезагрузите программу и компьютер.

Уровень безопасности

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

1. Снова нажмите на «Меню»/«Настройки».
2. Переключитесь на вкладку «Приватность и защита».
3. В разделе «Защита» выберите «Высокий». Браузер отключит JS скрипты и другие модули, которые могут спровоцировать утечку данных и замедляют загрузку страницы.
4. Перезапустите браузер.

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

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

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

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

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

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

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

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

Зачем нужна оптимизация скорости сайта?

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

Тормоза будут особенно ощутимыми при медленном соединении с интернетом или использовании сетей устаревшего формата (3G). А если у сайта не будет мобильной версии или адаптивного дизайна, то мобильный трафик также сильно просядет. Чтобы этого избежать, требуется оптимизация скорости сайта. В идеале страница должна загружаться не дольше 2-х секунд. Если ей требуется больше 4-х секунд – уже повод задуматься и начинать исправлять ситуацию, т.к., согласно исследованиям, это приводит к потере почти 60% трафика.

Быстрой загрузке страниц могут мешать следующие факторы:

• Неструктурированный html-код;
• Большие и тяжелые изображения;
• Скрипты, блокирующие работу сайта;
• Использование стилей в html-шаблонах;
• Медленная работа сервера, проблемы на стороне хостинга, превышение лимитов по тарифу;
• Вирусы и другой вредоносный код на сайте.

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

Как получить более высокую скорость загрузки?

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

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

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

Переустановка и чистка

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

Если воспользоваться этой утилитой нет возможности, очистите историю браузера, в котором наблюдается падение скорости. Инструкция на примере Яндекс:

• Заходим в настройки браузера (3 горизонтальные полоски);
• Нажимаем «Дополнительно» и в выпадающем окне выбираем «Очистить историю»;
• Здесь можно выбрать период, за который будет делаться чистка;
• Рекомендуется чистить кэш и куки-файлы, а также данные для автозаполнения (нужно поставить галочки у соответствующих пунктов);
• Нажать «Очистить» и дождаться окончания процесса.

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

Этот параметр зависит от многих факторов.

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

Удаление лишних скриптов

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

Оптимизация CSS

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

Быстро и легко помогут оптимизировать код такие сервисы, как:

• CleanCSS.com,
• CSS Optimizer,
• CSS Compressor,
• CY-PR.com,
• плагин Autoptimize.

Очистка «мертвого кода»

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

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

Каждый удаленный участок снабжайте комментарием, чтобы, в крайнем случае, вы быстро смогли восстановить нужный объект.

Уменьшение изображений

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

При использовании иллюстраций научитесь оптимизировать их размер.

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

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

Lighthouse

Lighthouse запускается прямо из панели разработчика в некоторых браузерах

Инструмент от Chrome, который проверяет скорость загрузки сайта на базе показателей Core Web Vitals. Lighthouse запускается из панели разработчика во всех браузерах на базе движка Chromium — Chrome, Opera, Edge и «Яндекс.Браузер». Вам нужно открыть страницу для проверки, открыть панель инструментов разработчика и перейти на вкладку Lighthouse, она может быть либо отдельным пунктом, либо на вкладке Audits.

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

Google PageSpeed Insights

PageSpeed Insights — онлайн-версия инструмента LightHouse

Бесплатный инструмент от Google на базе того же Lighthouse. Отличие лишь в формате — PageSpeed Insights запускается на отдельной странице, а не через панель инструментов разработчика. Проверяет параметры из Core Web Vitals и дает рекомендации по исправлению. Результат можно посмотреть отдельно для десктопной и мобильной версии страницы.

PR-CY

Российский сервис по проверке скорости загрузки сайтов

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

Pingdom Tools

Результаты теста скорости сайта от Pingdom

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

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

GTmetrix.com

Отчет по скорости загрузки сайта от GTmetrix

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

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

Uptrends.com

Тест скорости сайта с помощью Uptrends

Приятный интерфейс, анализ скорости ведется с помощью Lighthouse. Российских и украинских серверов для проверки нет, есть Азия, Европа, Америка и Австралия.

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

Web Page Test

Тройная проверка скорости сайта от Web Page Test

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

Dotcom-Monitor

Тест скорости сайта из трех локаций от Dotcom-Vonitor

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

Почему скорость скачивания намного выше скорости загрузки контента в сеть?

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

Среднее значение Speedtest за июль 2018 года составило 46,41 Мбит / с, 22,48 выше. Почему асимметрия? В общем, интернет-провайдеры рассматривают две вещи: существует гораздо большая потребность в пропускной способности нисходящего потока, чем в восходящем, и существует техническое ограничение на объем трафика, который могут переносить их линии.

Почему скорость загрузки намного ниже скорости загрузки?

Другие причины

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

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

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

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

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

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

Именно так работает сервис Google PageSpeed Insights и альтернативные сервисы, например, Pingdom . Эти сервисы покажут вам насколько ваш сайт оптимизирован по таким критериям как:

• Наличие редиректов;
• Использование кеша браузера;
• Качество CSS, HTML и JS;
• Оптимизация изображений;
• и т.д.

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

Причины медлительности обозревателя сети

Среди факторов, уменьшающих скорость работы интернет-браузера, выделяются такие аспекты:

• слабая аппаратная составляющая. Для комфортной работы в сети понадобится минимум 2 ГГц CPU (Dualcore) с операционной системой не старше Windows Применение комплектующих, выпущенных гораздо раньше с меньшей мощностью, приводит к нестабильной работе ПК в сети и некорректному отображению страниц. Это же касается и запуска браузера вообще;
• запущенные программы, потребляющие много ресурсов. Среди них могут находиться игры, видеоредакторы, DAW и другой подобный софт;
• нестабильная скорость подключения ПК из-за оператора.

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

Асимметрия действительно важна

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

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

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

Описание проблемы

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

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

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

Использовать асинхронную загрузку Javascript и CSS

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

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

Настроить асинхронную загрузку Javascript

Если на сайте есть видео со сторонних сервисов или другие внешние элементы, браузеру придется ждать загрузки всех элементов Javascript. Недоступное видео или другие проблемы с контентом могут вообще заблокировать загрузку сайта. Чтобы этого не произошло, используют
Friendly iFrame или асинхронную загрузку.

Создайте пустой div блок в том месте, где нужно отобразить элемент:

<div id="script_block" class="script_block"></div>

Перейдите в конец страницы и вставьте скрипт для асинхронной загрузки перед :

<div id="script_ad" class="script_ad" style="display:none;">
файл или скрипт для загрузки</div>
<script type="text/javascript">
   *переместить на реальную позицию отображения*
   document.getElementById('script_block').appendChild(document.getElementById('script_ad'));
 *показать*
   document.getElementById('script_ad').style.display = 'block';
</script>

Скрипт работает во всех современных браузерах.

Настроить асинхронную загрузку CSS

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

Настроить асинхронную загрузку CSS можно несколькими способами, к примеру, через «rel=preload»:

<link type="text/css" href="style.css" rel="preload" as="style" onload="this.rel='stylesheet'">
<noscript>
<link type="text/css" href="style.css" rel="stylesheet" />
</noscript>

В некоторых версиях браузеров, к примеру, в Firefox 57, «preload» по умолчанию отключен, поэтому событие «onload» не сработает. Учитывайте это и догружайте данные скриптом:

Скрипт
cssrelpreload.js by loadCSS на GitHub включает поддержку rel=preload для файлов CSS файлов. Он сработает, если в браузере нет родной поддержки «preload».