Как минимизировать HTTP-запросы, чтобы улучшить время загрузки

Уменьшите количество компонентов на ваших страницах

HTTP-запросы – это то, как браузеры запрашивают просмотр ваших страниц. Когда ваша веб-страница загружается в браузере, браузер отправляет HTTP-запрос на веб-сервер для страницы в URL. Затем, когда HTML доставляется, браузер анализирует его и ищет дополнительные запросы для изображений, сценариев, CSS, Flash и так далее.

Каждый раз, когда он видит запрос на новый элемент, он отправляет другой HTTP-запрос на сервер. Чем больше изображений, скриптов, CSS, Flash и т. Д. На вашей странице, тем больше будет запросов и тем медленнее будут загружаться ваши страницы. Самый простой способ уменьшить количество HTTP-запросов на ваших страницах – это не использовать много (или любых) изображений, скриптов, CSS, Flash и т. Д. Но страницы, которые являются просто текстом, скучны.

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

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

  • Объединение файлов . Использование внешних таблиц стилей и сценариев важно, чтобы они не мешали загрузке вашей страницы, но у вас не должно быть более одного CSS-файла и одного файла сценария.
  • Использовать спрайты CSS . Когда вы объединяете большинство или все ваши изображения в спрайт, вы превращаете несколько запросов изображений в один. Затем вы просто используете CSS-свойство background-image для отображения нужного вам фрагмента изображения.
  • Карты изображений . Карты изображений не так популярны, как раньше, но если у вас есть смежные изображения, они могут сократить количество запросов HTTP-изображений до одного.

Использование кэширования для улучшения времени загрузки внутренних страниц

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

Оцените статью
Solutics.ru
Добавить комментарий