Firefox Sound Observations 🔥 🦊 🔉 🔍

[zicklag]

I saw the note in the readme about sound playback issues in Firefox and I just wanted to share my experiencewith my own Bevy Kira plugin on web ( I'm not using this plugin, but I am using Kira ).

I also had audio issues on Firefox, but I noticed that Firefox is also using almost 100% of one of my CPU cores. If I resize the browser window so that it is much smaller, though, the CPU usage goes down and the sound playback works nicely. That seems to indicate that the issue isn't actually with the sound playback itself, but how much CPU usage the Bevy game is using on Firefox. It seems that Bevy takes much more CPU on firefox than it does on Chrome.

I'm not sure exactly what causes the CPU usage difference, but at least I think that gives us somewhere to look. If resizing the screen changes the CPU usage, then it is probably rendering. Maybe firefox's rendering is just slower than chrome's.

I'm using a custom renderer, too, so my experience may not be the best benchmark, but that's what I know for what it's worth.

[zicklag]

Looking at the firefox performance recording it shows "WebRender display list" as the function taking up the vast majority of the frame time:

Expanding that more gives us:

So it looks like it might not be the game code at all, but actually the painting as done by firefox that is taking forever.

Ah, here's another view that shows that the firefox "WebRender display list" is taking as long to run as the whole of the game code put together for that frame!

So maybe this is just a firefox rendering problem. 🤷‍♂️

[NiklasEi]

Do you think Bevy getting better at rendering would also help for web builds? Would most improvements be in bevy_render or in bevy_wgpu? In the case of bevy_wgpu, we would need to take a look at bevy_webgl2, right?

[zicklag]

I don't know if it's actually Bevy's fault, it might be Firefox's fault. In the screenshot above, The stack of functions on the left shows how long Bevy took to render the frame, but the stack of functions on the right shows that Firefox is taking just as long just to display the frame that is already rendered!

So making Bevy render faster might not help because Firefox is still spending way too much time getting the rendered frame to the screen.

---

That is just my interpretation and I could be wrong. I couldn't figure out where to report this to Firefox so that we might figure out if it's their problem or our problem.

Also, I am using my own custom renderer, not bevy_webgl2. The fact that this is happening with my own very simple renderer ( that runs great on Chrome and desktop BTW ) also makes me feel like this is maybe Firefox's issue and not Bevy's. I'm also using WebGL 1 not WebGL 2 now, but I can't remember if I tested and had the same rendering/audio issues when I was using WebGL 2.

---

Would most improvements be in bevy_render or in bevy_wgpu?

If you were to do any improvements it would probably be in bevy_webgl2 not bevy_wgpu or bevy_render, I think. If I remember correctly bevy_render has the rendering abstractions, so it doesn't do any actual rendering, it just defines how you control the rendering, and bevy_wgpu and bevy_webgl2 handle doing the actual rending on desktop and web respectively. So if you are trying to fix web rendering performance all of the relevant stuff would be in bevy_webgl2 I think.

[billyb2]

Have you tried disabling privacy.resistFingerprinting in about:config ? I heard somewhere that it massively improves canvas performance.

[zicklag]

Looks like it's already disabled for me, but it's still got the issue:

[djee-ms]

Isn't this simply Firefox reducing framerate on non-focused canvas, like it does for other "background" elements (other non-active tabs, notably)? Sound is choppy for me until I give focus by clicking on the canvas, and then immediately becomes normal. If so there's nothing we can do about that, it's by design. So work around by not trying to play audio until getting keyboard focus.

[zicklag]

In my game, I still have audio problems, even when I click on the canvas, so I'm not sure. 🤷‍♂️

[djee-ms]

It may be both at the same time, reduced framerate before first focus, and later game is more demanding so general perf issue?

[zicklag]

I am pretty sure it is just general performance issue, actually, so we might as well close this I think.

I'm not sure why the Firefox canvas performance is so bad, but it's not actually the sound causing the problem.