How to make chrome/browser understand that the javascript code has changed?

Question

Many a time when there are minor javascript updates in the release, the user browser does not get them.

Browsers like chrome have a caching property for javascript. So, the page was once opened, it will cache it. The chrome will only reload it if it detects some significant change.

After releases, we often get tickets from the customer that they don't see something expected, and the reason is simply that the js they have is old. The simple solution we recommend them is to try a hard reload by Ctrl+Shift+R. Just refreshing the page does not work.

Is there any way by which we can let chrome know, that it does not have to use cached version?

Answer 1

Browser level caching is done to reduce the load on the network and improve the performance but sometimes it is not desirable as in your case.

Usually, for such scenarios, I use versioning in the filename. I would name my file as myfile_v1.js and keep incrementing with every release. This makes sure that whenever I make some change to my js code, the client will pull the latest changes, as the browser will not be able to find it in its local cache.

Answer 2

There are a lot of ways to do this, the more common are:

• Service workers
• add a get parameter every time the script changes like <script src="./myscript.js?v=1.0 />
• change the name of the file at every deploy
• no-cache header