Automatické resetovanie cache v builde React
Už by ste mali vedieť, že v prehliadačoch existuje problém s cache pre statické súbory. Podstatou problému je, že pre zvýšenie rýchlosti prehliadač ukladá do cache súbory štýlov, skriptov a obrázkov.
To znamená, že ak na hostingu zmeníte niečo vo vašich skriptoch alebo štýloch, zmeny sa zobrazia len novým návštevníkom stránky. Starí návštevníci, ktorí už na stránke boli skôr, uvidia version kódu uloženú v cache. To je, samozrejme, neprijateľné.
Našťastie, v Reacte sa tento problém rieši automaticky. Jeho riešenie spočíva v tom, že súbory buildu, okrem mena a prípony, majú náhodný reťazec, ktorý sa nazýva hash. Tento hash zodpovedá obsahu súboru. To znamená, že pri zmene kódu v súbore sa zmení aj hash v jeho mene. Preto bude prehliadač myslieť, že ide o nový súbor a stiahne si ho.
Môžeme pozorovať hash súborov
pri ich pripájaní v index.html:
<script defer="defer" src="/static/js/main.3dd63bcb.js"></script>
<link href="/static/css/main.f855e6bc.css" rel="stylesheet">
Vykonajte build projektu. Skúmajte, aké hash hodnoty majú súbory v buildi.
Bez zmeny kódu vášho projektu vykonajte build. Presvedčte sa, že hash súborov sa nezmenia.
Zmeňte kód vášho projektu. Vykonajte build. Presvedčte sa, že hash súborov sa zmenia.