Loading a file to cache only

Loading a file to cache only

I find the opposite question a lot, but I haven't found the answer to this one yet! :-)

I'm trying to load a file in to the user's cache, but not actually use it on that page. The logic is, on the first page load I would use PHP's include() to load the CSS inline, then at the bottom of the page I would load the external CSS file to cache it and set a cookie to signify that it has been cached. Then on the second page load I would test for the cookie, and if present I could link to the CSS like normal.

From my tests, this would save about 1.5s on the first page load. And from my experience, the faster the page load the more pages per session I get, so over time this has financial value to me.

I tried using $.get and $.load, but neither of them properly cached it (at least, Google Dev Console shows it loading again on the second page). Is there a more appropriate method?

I'm using jquery-3.3.1.min.js.

TIA!