Home/ Questions/Q 7746847
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T10:23:04+00:00

I have a webpage that plays a ‘chime’ sound when certain events occur. Problem

  • 0

I have a webpage that plays a ‘chime’ sound when certain events occur. Problem is, the audio playback is intermittent and I couldn’t seem to figure out what was causing it until I changed my code to this : 

var audioElement = document.createElement('audio');
audioElement.setAttribute('src', '/public/sounds/chime.ogg');
audioElement.load();
audioElement.play();

Now the audio (only 11kb) plays every time but I want to know for performance evaluation, is the file pulled from the server every single time or is it cached and reused?

my old code used to be like this:

HTML: 

<audio id="chime" preload="auto" autobuffer>
    <source src="@{'/public/sounds/chime.ogg'}" />
</audio>

JavaScript: 

$('#chime').get(0).play();
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    EDIT: If all you want to do is see if the browser is requesting the file or honoring the cache info, pop open the dev tools network panel (or the firebug net panel) and reload the page.

    you will see a GET for the file resource being loaded, along with a status (look at the headers tab in the chrome tools – you’ll like see one of ‘200 OK’, ‘200 (from cache)’ or ‘304 not modified’.

    Take a look at the timings tab and you’ll see if it’s spending time downloading the whole file, or if it’s just comparing the local file with the one on the server.

    This behavior will be fairly be browser specific, so if you test in firefox, webkit and IE you may potentially see slightly different results.

    firefox respects caching info in audio file http headers, webkit browser perform a quicky check.

    http://mindtrove.info/archive/2010/02/1/

    • 0