0

Is it possible to force caching of certain Javascript Library files (ie react.min.js, etc.) when navigating between pages of a website that isn't a SPA?

Trying to look at the feasibility of a more componentized structure while not going full on SPA. The website I'm working on oftentimes has people visit a single page and then leave, but in cases where they do stick around, I don't want to have to have them reload each and every library on page load.

B. Blunt
  • 587
  • 1
  • 4
  • 9
  • I think your question would benefit from some clarification. Are you really trying to force browsers to cache this file? Why are they not doing that in the first place? Please let me know if my answer misunderstood your question. – Blizzardengle Oct 12 '16 at 00:31
  • 1
    After further reading-up on my particular question, I found no additional work was required. The question was in regards to trying to ensure that in a multi-page React application with multiple components didn't try to re-download the same component .js files when navigating between pages. I guess going back to the basics sometimes may be a bit goofy for some. Conclusion: this is automatically handled by browser (as mentioned in selected answer) and no additional work is required. – B. Blunt Oct 17 '16 at 21:56

1 Answers1

1

Background You Should Understand
There are literally thousands of articles on the web about this topic but here is a very good summary from Make Us Of's Everything You Need to Know About the Browser Cache.

The browser cache is a temporary storage location on your computer for files downloaded by your browser to display websites. Files that are cached locally include any documents that make up a website, such as html files, CSS style sheets, JavaScript scripts, as well as graphic images and other multimedia content.

When you revisit a website, the browser checks which content was updated in the meantime and only downloads updated files or what is not already stored in the cache. This reduces bandwidth usage on both the user and server side and allows the page to load faster. Hence, the cache is especially useful when you have a slow or limited Internet connection.

TL;DR
I don't know if your really looking for a way to force the browser to cache your files or if you just misunderstood how the cache works. In general the browser the visitor is using is the one that makes that decision and handles everything for you. If it sees that a resource is needed that was already accessed in the past it wont request it again, it'll just use its cache. So no, your libraries will not get re-loaded over and over. Just once.

Now if you really do need to force the browser to cache your files take a look at the answer(s) to Caching a jquery ajax response in JavaScript/browser. That should get you on a good path to a solution.

Community
  • 1
  • 1
Blizzardengle
  • 992
  • 1
  • 17
  • 30
  • Andrew Brassington's answer also brings up a good point that is mentioned a bit in the other SO question that I linked to. You need to have correct HTTP headers if you want to force/ ensure caching. – Blizzardengle Oct 12 '16 at 00:22