{"action":"created","issue":{"url":"https://api.github.com/repos/Modernizr/Modernizr/issues/2364","repository_url":"https://api.github.com/repos/Modernizr/Modernizr","labels_url":"https://api.github.com/repos/Modernizr/Modernizr/issues/2364/labels{/name}","comments_url":"https://api.github.com/repos/Modernizr/Modernizr/issues/2364/comments","events_url":"https://api.github.com/repos/Modernizr/Modernizr/issues/2364/events","html_url":"https://github.com/Modernizr/Modernizr/issues/2364","id":349387632,"node_id":"MDU6SXNzdWUzNDkzODc2MzI=","number":2364,"title":"Performance and audibleness issues with autoplay detection","user":{"login":"cpearce","id":97721,"node_id":"MDQ6VXNlcjk3NzIx","avatar_url":"https://avatars1.githubusercontent.com/u/97721?v=4","gravatar_id":"","url":"https://api.github.com/users/cpearce","html_url":"https://github.com/cpearce","followers_url":"https://api.github.com/users/cpearce/followers","following_url":"https://api.github.com/users/cpearce/following{/other_user}","gists_url":"https://api.github.com/users/cpearce/gists{/gist_id}","starred_url":"https://api.github.com/users/cpearce/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/cpearce/subscriptions","organizations_url":"https://api.github.com/users/cpearce/orgs","repos_url":"https://api.github.com/users/cpearce/repos","events_url":"https://api.github.com/users/cpearce/events{/privacy}","received_events_url":"https://api.github.com/users/cpearce/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":1,"created_at":"2018-08-10T06:08:37Z","updated_at":"2018-08-14T19:18:19Z","closed_at":null,"author_association":"NONE","body":"(FYI, I'm a browser engineer working on Firefox's media playback engine...)\r\n\r\nThere's a few ways https://github.com/Modernizr/Modernizr/blob/master/feature-detects/audio/autoplay.js could be improved.\r\n\r\n1. Your code tries to play an MP3 and if that isn't supported you fall back to trying to play a WAV file. I recommend you do that in the opposite order, i.e. try a WAV first and then fallback to MP3. WAV is a much simpler format and computationally cheaper to decode. MP3 requires spinning up a more complex decoding pipeline and thus uses a lot more CPU resources, loading decoding libraries from disk, threads, memory, etc in order to decode. Using WAV would make this a lot less resource intensive and thus faster. Your WAV file is also a lot shorter duration, so would take require less memory for the browser's playback pipeline to buffer the decoded samples.\r\n2. The MP3 data URI you're using isn't silent; [if you dump the samples of the MP4 data uri you're using](http://www.pearce.org.nz/modernizr-autoplay-mp3-samples.html) then you see there's a run of 0 samples at the start, followed by samples that are close to but not quite 0. Because your samples here aren't close enough to 0, Firefox's logic to detect silent samples considers the media audible, and we end up showing an indicator in the tab because we think the tab is making audible sound. I recommend you make this media contain audio samples with value 0 exactly if possible.\r\n3. The MP3 is about 1 second long, you could make that shorter to reduce the overhead of playing that resource. The browser will decode some amount ahead of the playback position to ensure uninterrupted playback, and a shorter duration resource would hit the end of resource while pre-buffering and thus use less memory.\r\n4. You're using the \"playing\" event to detect whether media can autoplay, but you attach the \"playing\" listener after one pass through the event loop. Media decoding and playback happens asynchronously on another thread. So it's possible that the entire resource decodes and starts playing and fires a \"playing\" event in between you inserting the audio element into the document and your function enqueued by the timeout running and getting a chance to attach a \"playing\" event listener. So what you have here is unreliable (maybe that's why you felt the need to re-try?). You should attach the \"playing\" event listener when you trigger the load (i.e. right after you insert the audio element into the DOM), not in the setTimeout function.\r\n5. You're retrying multiple times to play a media to detect whether autoplay works. You should only need to play once. If one playback is taking a long time because the system is highly loaded, creating another playing media element will increase load on the system and make matters *worse* not better. So I recommend you don't retry, just wait on the first result.\r\n6. Also, once you're done with your 'detect', if you reset the audio element's 'src' attribute to null, the decoding pipeline setup for that audio element will be shutdown, rather than having to wait for the garbage collector to run, reducing the memory/resource overhead of your test further.\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/Modernizr/Modernizr/issues/comments/412985442","html_url":"https://github.com/Modernizr/Modernizr/issues/2364#issuecomment-412985442","issue_url":"https://api.github.com/repos/Modernizr/Modernizr/issues/2364","id":412985442,"node_id":"MDEyOklzc3VlQ29tbWVudDQxMjk4NTQ0Mg==","user":{"login":"cpearce","id":97721,"node_id":"MDQ6VXNlcjk3NzIx","avatar_url":"https://avatars1.githubusercontent.com/u/97721?v=4","gravatar_id":"","url":"https://api.github.com/users/cpearce","html_url":"https://github.com/cpearce","followers_url":"https://api.github.com/users/cpearce/followers","following_url":"https://api.github.com/users/cpearce/following{/other_user}","gists_url":"https://api.github.com/users/cpearce/gists{/gist_id}","starred_url":"https://api.github.com/users/cpearce/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/cpearce/subscriptions","organizations_url":"https://api.github.com/users/cpearce/orgs","repos_url":"https://api.github.com/users/cpearce/repos","events_url":"https://api.github.com/users/cpearce/events{/privacy}","received_events_url":"https://api.github.com/users/cpearce/received_events","type":"User","site_admin":false},"created_at":"2018-08-14T19:18:19Z","updated_at":"2018-08-14T19:18:19Z","author_association":"NONE","body":"Sure, I'll put together a PR. :)"}}
{"actor":{"display_login":"cpearce"}}