The app is consuming high CPU
huyenltnguyen opened this issue · 5 comments
I checked the CPU consumption using the Task Manager feature on Firefox and found that our app is having very high CPU usage.
Here we have the local version being the most impactful, followed by the prod version. I also opened the Azuracast player for comparison.
My hunch is that it has something to do with the AudioContext we are using in the Visualizer component, as it is the most prominent difference between our app and Azuracast's.
This issue might be related to #80.
Additionally we could unmount the visualizer when the app is in the background tab using libraries such as ifvisible. serkanyersen.github.io/ifvisible.js/demo.html
One possibility of the cause is WebSocket connection. Here is what I found from the MDN article about CPU usage and background tabs (https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API#policies_in_place_to_aid_background_page_performance)
Tabs running code that's using real-time network connections (WebSockets and WebRTC) go unthrottled in order to avoid closing these connections timing out and getting unexpectedly closed.
After the tab optimizations for the visualization and the footer we are getting around 0.2;
Although removing footer and main components completely lowers cpu usage by 50% on chrome task manager, it barely changes anything on firefox;
Might need to go down that route just to make sure we are covering all bases.
@huyenltnguyen should we close this. It seems like the cpu usage of the production app has been considerably reduced.
Yeah sure. Thanks for the help!