Skip to main content
A cartoon depiction of the author, wearing a hoodie and smiling motd.co

`<audio>` livestream buffering/stuttering fix

A bunch of browsers get weird when you try to load streaming audio into a playing <audio> tag that it thinks it's cached because the URL is the same. For this purpose, I add a timestamped query parameter to the stream URL whenever the audio player starts playing. This makes the browser ignore the cached data because the stream "URL" is always "new".

You can see a super basic example in the webring! View the code at https://glitch.com/edit/#!/cohost-icecast-webring?path=main.js and look for the places where "?nocache=" is being added to some URLs. (You can also use an anchor, like ${stream URL}#${timestamp})