Проблема са кешом у прегледачима

Прегледач кешира повезане фајлове стилова CSS, скриптова JavaScript и слика. Кеширање значи да повезане фајлове прегледач преузима само при првом доласку корисника на сајт. При наредним доласцима ти фајлови већ неће бити поново преузимани, већ ће се узети из кеша прегледача.

Кеширање је корисно. Створено је да повећа брзину учитавања сајта. Јер је прегледачу брже узети фајл из свог складишта, него да га преузима сваки пут из интернета.

Међутим, за брзину се плаћа непогодношћу при развоју. Ствар је у томе да ако промените нешто у вашем коду и затим објавите измене на хостинг - сви корисници који су већ посетили ваш сајт ће имати стару кеширану копију кода.

Прво решење проблема

За борбу против таквог понашања треба сваки пут преименовати измењене фајлове. У пракси то није погодно, зато се користи паметан трик. Његова суштина се састоји у томе, да при повезивању фајла после имена фајла ставимо знак питања, знак једнако и број верзије вашег скрипта. Таква конструкција се зове GET параметар.

Присуство GET параметра у имену фајла "не упропашћава" путању са становишта сервера, и даље указујући на исти фајл. Али са становишта прегледача, промена GET параметра приморава прегледач да сматра да се путања до фајла променила и да поново преузме фајл.

За борбу против кеша, када унесете измене у ваш фајл са кодом, требаће вам повећати вредност GET параметра за један. Погледајте пример примене сличног приступа:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="styles.css?v=1">
		<script src="script.js?v=1"></script>
	</head>
	<body>
		
	</body>
</html>

Друго решење проблема

Постоји и напреднији приступ. Он се састоји у томе да се именима фајлова додају насумични низови, на пример, овако:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="styles.398db7afe3b52e94bb25.css">
		<script src="script.1d12c304c284a752cb9a.js"></script>
	</head>
	<body>
		
	</body>
</html>

Ови низови се зову хеш. Хеш представља јединствен низ. Он се израчунава из садржаја фајла на посебан начин. То значи да сваком тексту одговара његов јединствени хеш. Ако је текст фајла измењен, онда ће и хеш бити други и мораћемо га променити у имену фајла.

Наравно, ручно израчунавати хеш и преименовати фајлове је слаба забава. Зато се овај приступ користи само у случају да имамо неки алат који дозвољава аутоматски израчунавање хеша и преименовање фајлова, као и мењање имена фајлова на нова у HTML фајловима. Све то омогућава да ради Webpack. Томе ћемо се учити током целог уџбеника.