Ускорение загрузки HTML

Question

Я хочу ускорить загрузку HTML-страницы.Я знаю, что могу сжимать HTML, JS и CSS, однако я подумал сделать еще один шаг вперед.Вместо ссылок на файлы CSS и JS, я (или сервер) просто скопировал бы и вставил их содержимое в HEAD напрямую.Это в основном для того, чтобы сэкономить несколько поездок по TCP на веб-сервер.

Чего я не знаю ... Делает ли браузер отдельный HTTP-запрос для каждого файла JS и CSS?

Буду признателен за ваш вклад

Спасибо!-Assaf

Answer 1

Да, для каждого из JS и CSS существует отдельный HTTP-запрос. Однако TCP-соединение может быть одинаковым и может отличаться в зависимости от заголовка Keep-Alive.

http://en.wikipedia.org/wiki/Keepalive

Вы думали, что простое копирование JS и CSS в голову может затруднить поддержку вашего сайта. Я всегда держу свои CSS и JS в центре, даже если это увеличивает производительность.

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

http://www.microsoft.com/technet/prodtechnol/windowsserver2003/library/iis/d52ff289-94d3-4085-bc4e-24eb4f312e0e.mspx

Answer 2

Да и Нет. Обычно да, но вы можете остановить нежелательные запросы JS и CSS при повторных посещениях, включив кэширование в браузере.Кэширование, однако, полезно только тогда, когда значительная доля запросов поступает от возвращающихся пользователей, а также, если файлы JS и CSS меняются не очень часто.Вам нужно будет настроить время кэширования в заголовках ответов, основываясь на их ожидаемой изменчивости.В этом руководстве по кэшированию объясняется использование заголовков кэширования.

Другой способ избежать устаревшего кэша - переименовывать файлы JS и CSS и их ссылки в HTML при каждом изменении.

Если на многих страницах HTML есть ссылки на одни и те же файлы JS и CSS, то их хранение должно быть более оптимальным для производительности.

Answer 3

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

http://developer.yahoo.com/performance/rules.html - это отличная сводка дальнейших оптимизаций.