Кеширование файлов CSS в браузере

Быстрый вопрос по CSS и браузеру. Я попытался найти SO и нашел несколько похожих сообщений, но ничего окончательного.

Я использую один или два файла CSS в своих веб-проектах. На них есть ссылки в ЗАГОЛОВКЕ моих веб-страниц. Кешируется ли CSS после того, как я попадаю на одну из своих страниц, чтобы он не загружался повторно с каждым запросом? Я надеюсь, что это так. IE, Firefox и Safari по-разному справляются с этим? Если браузер закрыт, обновляется ли CSS при первом посещении, когда открывается новый экземпляр браузера?

Часть заголовка «размер файла» немного вводит в заблуждение, поскольку на самом деле вопрос вообще не вращается вокруг размеров файлов. «Файлы CSS и кеширование в браузере» или «Кэширование файлов CSS в браузере» выглядят гораздо лучше ... </twocents>

Már Örlygsson 20.01.2009 11:41
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
64
1
111 603
6
Перейти к ответу Данный вопрос помечен как решенный

Ответы 6

Это зависит от того, какие заголовки вы отправляете вместе с вашими файлами CSS. Проверьте конфигурацию вашего сервера, поскольку вы, вероятно, не отправляете их вручную. Выполните поиск в Google по запросу "http caching", чтобы узнать о различных параметрах кеширования, которые вы можете установить. Вы можете заставить браузер загружать новую копию файла, например, каждый раз, когда он загружает его, или вы можете кэшировать файл на одну неделю ...

Если вы не испортили свой сервер, да, он кеширован. Предполагается, что все браузеры обрабатывают это одинаково. Некоторые люди (например, я) могут настроить свои браузеры так, чтобы они не кэшировали файлы. Закрытие браузера не делает файл в кеше недействительным. Однако изменение файла на сервере должно вызвать обновление файла.

Это в основном неверно. Существуют различия между браузерами в отношении кеширования. И как только файл кэшируется на клиенте, он не будет загружен снова, пока кеш (по какой-либо причине) не истечет, изменение файла на сервере не будет иметь значения ...

Jan Hančič 20.01.2009 10:52

Это зависит от заголовков HTTP, отправленных с файлами CSS, как указано в обоих предыдущих ответах - до тех пор, пока вы не добавляете какие-либо материалы для очистки кеша в href. например

<link href = "/stylesheets/mycss.css?some_var_to_bust_cache=24312345" rel = "stylesheet" type = "text/css" />

Некоторые фреймворки (например, рельсы) помещают их по умолчанию.

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

Все браузеры должен одинаково уважают заголовки кеша, если только они не настроены на их игнорирование (но обязательно должны быть исключения)

К первой части вашего вопроса - да, браузеры кешируют файлы css (если это не отключено конфигурацией браузера). Во многих браузерах есть комбинация клавиш для перезагрузки страницы без кеша. Если вы внесли изменения в css и хотите, чтобы пользователи увидели их немедленно, а не ожидали в следующий раз, когда браузер перезагрузит файлы без кеширования, вы можете изменить способ обслуживания CSS ir, добавив некоторые параметры к URL-адресу, например:

/style.css?modified=20012009

Гений! /Style.css?deployment = {DeploymentId}

Paulius Zaliaduonis 01.03.2012 15:48

Поддерживается ли такое поведение RFC?

Pacerier 18.07.2012 23:35

@Pacerier Да, это "поддерживаемый" способ делать что-то. Поскольку браузер просто видит /style.css?modified=20012009 как URL-адрес, это эквивалентно изменению имени вашего файла CSS каждый раз, когда вы делаете выпуск. Поскольку браузер считает файл новым, он не будет пытаться использовать его кешированную версию.

plowman 20.07.2012 01:28

@plowman, я имею в виду, что да, он работает в дикий, но действительно ли это поведение поддерживается официальными предписывающими стандартами RFC?

Pacerier 20.07.2012 02:02

@Pacerier - мне кажется довольно стандартным параметром HTTP GET. Почему вы думаете, что его не поддержат? Здесь ничего особенного не происходит ...

Jesse Webb 18.12.2012 00:39
Ответ принят как подходящий

Ваш файл будет кэшироваться наверное - но это зависит ...

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

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

Некоторые (например, Apache) могут обслуживать известные статические типы файлов с заголовками HTTP, побуждая браузер кэшировать их, в то время как другие серверы могут отправлять команды no-cache с каждым ответом - независимо от типа файла.

...

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

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

Затем прочтите документацию по вашему веб-серверу, чтобы узнать, как настроить их до совершенства (или попросите системного администратора сделать это за вас).

...

Что касается того, что происходит при перезапуске браузера, это зависит от браузера и конфигурации пользователя.

Как правило, ожидайте, что браузер с большей вероятностью будет проверять сервер после каждого перезапуска, чтобы увидеть, изменилось ли что-нибудь (см. If-Last-Modified и Если-нет-совпадение).

Если вы правильно настроили свой сервер, он должен иметь возможность возвращать сверхкороткий 304 Не изменено (с очень небольшой пропускной способностью), и после этого браузер будет использовать кеш как обычно.

Ctrl-K уже показывает нам «живые заголовки http»? Зачем нам нужно использовать надстройку Live HTTP Header?

Pacerier 18.07.2012 23:06

Вероятно, стоит отметить, что IE не будет кэшировать файлы css, вызываемые другими файлами css с использованием метода @import. Так, например, если ваша html-страница ссылается на «master.css», который загружает «reset.css» через @import, то reset.css не будет кэшироваться IE.

Это кажется чрезвычайно важным моментом. Можете добавить ссылку?

Liam 12.07.2010 21:08

Это не кажется правдой, ср .: ссылка на сайт см. Этот комментарий / ответ: Мюррей | 27 мая 09 в 9:52 Стив, я также слышал, что при использовании @ import браузеры могут не кэшировать файлы css, в отличие от файла. Но мне не удалось это проверить. Знаете ли вы, действительно ли это имеет значение с точки зрения кеширования? Если да, то это может быть еще одна причина избегать @ import. Стив Содерс | 27 мая 09 в 14:26 Мюррей: Я не слышал об этом, и в моих тестах этого не происходит.

Henrik Stenbæk 29.11.2011 18:36

Другие вопросы по теме