Оцените эффективность своего сайта

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

Несколько лет назад Amazon сообщила, что на каждые 100 миллисекунд увеличения скорости своего веб-сайта они отмечали увеличение дохода на один процент. За этим последовало объявление Google о том, что скорость загрузки страницы сайта была фактором рейтинга сайта в результатах поиска Google.

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

Минимизируйте HTTP-запросы

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

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

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

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

  1. Щелкните правой кнопкой мыши страницу, которую необходимо проанализировать, и выберите «Проверить».
  2. Нажмите вкладку Сеть.

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

Столбец Имя обозначает файлы, расположенные на странице. Размер каждого файла показан в столбце «Размер», а в столбце «Время» указано предполагаемое время загрузки каждого файла.

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

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

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

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

Если браузер обнаружит асинхронный файл CSS или JavaScript, загрузка страницы будет приостановлена ​​до полной загрузки соответствующего архива. Однако для асинхронных данных браузер продолжит загрузку других элементов страницы.

Для WordPress пользователи могут проверять параметры помимо CSS / JS, блокирующего рендер, при использовании вкладки «Статические файлы» в WP Rocket.

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

<script async src = ”script.js”> </ script>

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

Сократить время отклика сервера

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

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

Используйте сеть доставки контента (CDN)

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

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

Кэширование может помочь, но будьте осторожны

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

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

К счастью, большинство плагинов автоматически очищают кеш через равные промежутки времени; однако пользователям может понадобиться выполнять эту задачу вручную время от времени. Если сервер использует Varnish Caching, эту задачу можно легко выполнить с помощью бесплатного плагина Varnish HTTP Purge .

Уменьшите размер файла для оптимизации изображения и видео

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

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

Для сжатия видео вы можете использовать современные HTML5-плееры, которые имеют встроенные возможности сжатия. Существует множество видеоплееров с открытым исходным кодом, которые позволяют выполнять такие действия, как Plyr, Video.js, Afterglow,так далее,

Сократить и сжать файлы сайта

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

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

Заключение

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

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