HTTP-запросы - это то, как браузеры запрашивают просмотр ваших страниц. Когда ваша веб-страница загружается в браузере, браузер отправляет HTTP-запрос на веб-сервер для страницы в URL-адресе. Затем, по мере доставки HTML, браузер анализирует его и ищет дополнительные запросы для изображений, скриптов, CSS, Flash и т. Д.
Каждый раз, когда он видит запрос на новый элемент, он отправляет на сервер другой HTTP-запрос. Чем больше изображений, сценариев, CSS, Flash и т. Д. Будет отображаться на вашей странице больше запросов, тем медленнее будут загружаться ваши страницы. Самый простой способ уменьшить количество HTTP-запросов на ваших страницах - не использовать много (или любых) изображений, скриптов, CSS, Flash и т. Д. Но страницы, которые являются просто текстом, скучны.
Как уменьшить HTTP-запросы без разрушения вашего дизайна
К счастью, есть несколько способов уменьшить количество HTTP-запросов, сохраняя при этом высококачественные богатые веб-проекты.
- Объединить файлы - Использование внешних таблиц стилей и сценариев важно, чтобы они не увязывали время загрузки страницы, но не имеют более одного CSS и одного файла сценария.
- Использовать CSS-спрайты - Когда вы объединяете большинство или все ваши изображения в спрайт, вы превращаете несколько запросов изображений в один. Затем вы просто используете свойство CSS background-image, чтобы отобразить раздел требуемого изображения.
- Карты изображений - Карты изображений не так популярны, как раньше, но когда у вас есть непрерывные изображения, они могут уменьшить количество запросов HTTP-изображений до одного.
Использование кеширования для улучшения внутренней загрузки страницы
Используя CSS спрайты и комбинированные файлы CSS и скриптов, вы также можете улучшить время загрузки для внутренних страниц. Например, если у вас есть спрайт-изображение, содержащее элементы внутренних страниц, а также целевую страницу, то когда ваши читатели перейдут на эти внутренние страницы, изображение уже загружено и в кеш. Таким образом, им не понадобится HTTP-запрос для загрузки этих изображений на ваши внутренние страницы.