Upload Files With A Unique Name To Leverage Browser Caching

Link: https://support.brilliantdirectories.com/support/solutions/articles/12000027550

What is Browser Caching?


When someone visits a website, one of the biggest factors in how smooth the experience feels is how quickly the pages load. One of the most effective ways to improve load speed is by taking advantage of the browser’s built-in caching system.


When a visitor loads a page, their browser pulls in all of the images, videos, HTML, CSS, and JavaScript needed to display it. But if they’ve been to the site before, the browser may already have many of the larger files stored locally in its cache. When these files are already saved on the visitor’s device, the browser doesn’t need to download them again — which makes the page load much faster.


To help with this, Brilliant Directories automatically sets optimized browser-caching rules based on the software and the types of files typically used on a website.


There is one important exception: if a file on the site is replaced with a new version using the same filename (for example, updating logo.jpg), a visitor who has the old version cached won’t see the updated file right away. They’ll only see the new one once the cached version expires or they manually clear their browser cache.



Best of Both Worlds: Cache Older Files, Download Updated Files


Fortunately, there’s a simple way to avoid this issue: upload the updated file using a new filename.


For example, imagine your site has a file called logo.jpg. When a visitor loads a page, their browser saves logo.jpg in its cache. This is helpful — the next time they visit, the browser won’t need to download that file again, which speeds up page loading.


But if you upload a new version of the logo and keep the exact same filename, the visitor's browser will continue using the old cached version. Since the browser thinks it already has logo.jpg, it won’t download the updated file.


The solution is straightforward: rename the updated file before uploading it. Something like logo.1.jpg, logo1.jpg, or my-logo.jpg will work. Because the filename is different, the browser will treat it as a new file, download it immediately, and show the updated image.


For anyone interested in a deeper technical breakdown, Google provides a helpful explanation in this article: HTTP Caching