27

I have a js function for playing any given sound using the Audio interface (creating a new instance for every call).

This works quite well, until about the 32nd call (sometimes less). This issue is directly related to the release of the Audio instance. I know this because I've allowed time for the GC in Chromium to run and it will allow me to play another 32 or so sounds again.

Here's an example of what I'm doing:

<html><head>
<script type="text/javascript">
function playSound(url) {
    var snd = new Audio(url);
    snd.play();
    snd = null;
}
</script>
</head>

<body>
<a href="#" onclick="playSound('blah.mp3');">Play sound</a>
</body></html>

I also have this, which works well for pages that have less than 32 playSound calls:

var AudioPlayer = {
    cache: {},
    play: function(url) {
        if (!AudioPlayer.cache[url])
            AudioPlayer.cache[url] = new Audio(url);
        AudioPlayer.cache[url].play();
    }
};

But this will not work for what I want to do (dynamically replace a div with other content (from separate files), which have even more sounds on them - 1. memory usage would easily skyrocket, 2. many sounds will never play).

I need a way to release the sound immediately. Is it possible to do this? I have found no free/close/unload method for the Audio interface.

The pages will be viewed locally, so the constant loading of sounds is not a big factor at all (and most sounds are rather short).

hippietrail
  • 15,848
  • 18
  • 99
  • 158
komiga
  • 363
  • 1
  • 6
  • 13

4 Answers4

22

I see at least one (or two) flaws:

snd = new Audio(url);

has no var in front of it, so snd is assigned to the global scope. That's usually not what you want: it clutters the global name space and if another script (e.g., an extension) incidentally uses snd, things will be a mess.

And that's also why

delete snd;

doesn't work: you can't delete global variables:

When declared variables and functions become properties of a Variable object — either Activation object (for Function code), or Global object (for Global code), these properties are created with DontDelete attribute.

So, use

var snd = new Audio(url);

instead. BTW, you can't force the JavaScript engine to do garbage collection.

Marcel Korpel
  • 21,536
  • 6
  • 60
  • 80
  • Ah, that. I was testing something not too long ago that had me remove the var. It was originally there. EDIT: Corrected. – komiga Jun 13 '10 at 23:07
  • @plash: Ok, but I'll leave my answer here as it might be useful to other users. – Marcel Korpel Jun 13 '10 at 23:11
  • 2
    That's not true! You can delete global variables via `delete window.snd`; – DATEx2 Jul 16 '14 at 16:13
  • @DotNetWise: Not if you didn't declare the variable via property assignment: if you do a `var foo = 1`, `foo` gets the `DontDelete` attribute; you can't delete it with `delete window.foo`. However, I'm not sure about variables declared globally without the `var` statement: a quick test shows me that you actually *can* delete those. Perhaps this is new in ES 5.1, didn't check that out lately. When I have more time, I'll explore this particular case a bit further and let you know. – Marcel Korpel Jul 18 '14 at 10:43
  • Not true both in latest chrome, IE10 and latest FF. xx = 1; 1 >> delete window.xx true >> xx "'xx' is undefined" – DATEx2 Jul 18 '14 at 12:03
  • @DotNetWise I already said that, but you still can't delete global variables declared with `var`. – Marcel Korpel Jul 20 '14 at 09:21
22

This is not an exhaustive answer, but to the question "Is there any way to force the chrome js engine to do garbage collection?", a chromium.org guy replied:

In general, no, by design. For testing purposes there is a flag you can pass on the command line to enable a javascript command "window.gc()" to force garbage collection.

--js-flags '--expose_gc'


UPDATE: However, as @plash noted in a comment below, this flag will only work in debug builds.

Community
  • 1
  • 1
Daniel Vassallo
  • 337,827
  • 72
  • 505
  • 443
  • Greeaat. I would have to start using a script to launch Chromium for this project (already using --allow-file-access-from-files so that I can open files from the local filesystem). EDIT: I consider this a last resort. – komiga Jun 13 '10 at 23:13
  • @plash: Make sure to check out [the post that I linked to](https://groups.google.com/group/chromium-extensions/browse_thread/thread/5dc4be46e434116a?pli=1), because the response I quoted had further info which may be relevant. I didn't test this personally. – Daniel Vassallo Jun 13 '10 at 23:18
  • @plash: Too bad... Let me update my answer, just for reference to other readers. – Daniel Vassallo Jun 13 '10 at 23:26
  • 5
    That flag does work in release builds (crbug.com/100875). But I think you're passing it wrong. Try: chrome --js-flags='--expose_gc' – John Mellor Dec 14 '11 at 16:28
  • In Ubuntu, the command that worked was `chromium-browser --js-flags='--expose_gc'` – Matthias Dec 07 '16 at 17:53
2

Just deleting and setting it to null didn't work for me either, so I made a workaround.

I got it working for more than one sound at the same time. To release the instances, every sound needs to be an Object Tag. Dynamically, append every Object Tag (sound) to a Div. To release the instance, dynamically remove the Object Tag (sound) from the Div.

I guess this works because a browser typically implements each tag as some kind of object. So, when I delete a tag, the internal object gets deleted and releases any resources associated with it.

<!--HTML: This will contains object sounds-->
<Div id="sounds"></Div>

//Javacript, using jQuery
//Create and play an MP3
var id_event = 1234; //Keep and incrementing a counter might do, I use an Event Id from my app.
var objSound = "<object width='1' height='1' id='AUDIOIE" + id_event 
        + " type='application/x-oleobject'  AND_MORE_PARAMS_TO_PLAY_A_MP3"
        + "/>";
$(objSound).appendTo('#sounds');

For complete object params go here.

//To Stop an MP3 and release it instance.
$('#AUDIOIE' + id_event).empty().remove();
Marcel Korpel
  • 21,536
  • 6
  • 60
  • 80
user347594
  • 1,256
  • 7
  • 11
  • Just for correctness: those “Object Tags” are rather [object elements](http://www.w3.org/TR/html401/struct/objects.html#edef-OBJECT). Please don't confuse [tags and elements](http://perfectionkills.com/tag-is-not-an-element-or-is-it/)! – Marcel Korpel Jun 14 '10 at 00:02
0

Please use : let snd = new Audio(url);

By doing so, the memory allocated to the variable will be in the Stack, rather than in the Heap stack geal. Allocating it in the heap would ultimately slow down your system to a point where you have to wait for the GC to clear it.

As per the Memory Model of java, most of the constant declarations should be by using let or const.

var should be used in the rarest of every conditions.

Community
  • 1
  • 1