Google Workbox – Preload vs Prefetch Audio

I wanted to preload audio for a page, I am using preload as oppose to prefetch. Many resources on the topic.

If you have Google Workbox running as well then note, you need to use crossorigin=anonymous even if same domain, to ensure caching if you using runtimeCaching as I am.


This link explains the as=”audio”

Cache API

I also looked into this API thinking on componentDidMount I could load all the MP3s directly into cache, the issue is this is not supported by all browsers. Preload is not as well but it is more supported.

I may relook at this in the future, maybe it is a better solution.