Хак: Умное Кеширование и Версионность в Javascript/CSS (1.x) 3 888 просмотров

Всем привет!

Пишу о наболевшем...

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

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

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

Предлагаю следующее решение: после имени JS или CSS файла добавлять переменную версии, которая берется из даты изменения файла.
Таким образом, при редактировании данных файлов, дата изменения будет меняться, а следовательно браузер запросит и закеширует файлы заново, а старая версия постепенно выпадет из кеша.

Зачастую подключение JS и CSS происходит через $inPage->addHeadJS и $inPage->addHeadCSS, поэтому внесем правки именно в эти функции.

Файл: /core/classes/page.class.php
функцию:

 
public function addHeadJS($src){
	return $this->addHead('<script type="text/javascript" src="/'.$src.'"></script>');
}

меняем на:

 
public function addHeadJS($src){
	return $this->addHead('<script type="text/javascript" src="/'.$src.'?'.filemtime(PATH.'/'.$src).'"></script>');
}

и также подключение CSS
функцию:

 
public function addHeadCSS($src){
	return $this->addHead('<link href="/'.$src.'" rel="stylesheet" type="text/css" />');
}

меняем на:

 
public function addHeadCSS($src){
	return $this->addHead('<link href="/'.$src.'?'.filemtime(PATH.'/'.$src).'" rel="stylesheet" type="text/css" />');
}

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

upd: вариант для 2-ой ветки Хак: Умное Кеширование и Версионность в Javascript/CSS (2.x)

Хак: Умное Кеширование и Версионность в Javascript/CSS (2.x)

Хак: Оценка записей на стене пользователя (1.х)

9 комментариев

Реклама #

Stecc 9 лет назад #

Хотелось бы услышать мнение от разработчиков cms.

Stecc 9 лет назад #

А так да, очень не хватает кеширование. Спасибо.

Kirill Levitskiy 9 лет назад #

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