Hi,
I am creating a webGL game on in MacBook Pro (Retina). Even with very few sprites and few UI elements, the performance I am getting is low and very INCONSISTENT. To track the performance issue, I’ve created a sample project with a sprite transform animation and a single UI text on a canvas. The only tweak I’ve added was in index.html to render the game in full screen by modifying size of canvas and container.
On the very basic level, the noted performance on browsers are:
On Chrome, sometimes its 60fps, sometimes its stuck between 40-50 fps, sometimes even as low as 20 fps with the same project/same configs.
On Firefox, it’s almost similar as chrome
On Safari, it’s very poor among the three with very inconsistent performance.
And then I attached the profiler to the same project.
Whenever the fps drop occurs, the main issue is with the WaitForTargetFPS (the V Sync) with takes almost 75% (sometimes close to 90%) of a frame time. And I know that we can’t disable V Sync on WebGL(Browser) and Disabling V Sync on Quality Settings affects only on editor game view. Also WaitForTargetFPS also means the game is waiting for some rendering/operation to finish - Since, the demo project scene is almost empty it could not be the issue in this case
Using Firefox profiler
I’ve tested the same project with the Firefox profiler and I tracked it to the call “WebGL2RenderingContext.clientWaitSync” which I think it’s related to “WaitForTargetFPS” that I found on Unity Profiler
Exploration and similar issues
After few searches, I’ve came across this forum post with the similar issue and it is related to Retina display of Mac. The problem is whenever the game is displayed on smaller window (reducing the size of the browser window) the performance is somewhat better (still WaitForTargetFPS is higher) than rendering it on fullscreen and that post mentioned it as PIXEL FILLRATE issue. I’ve profiled the window size changes on sample project.
And as also mentioned in that forum post, When I reduce the devicePixelRatio from 2 to 1. The performance is improved slightly but the game and UI become blurry on Retina display.
On Windows, there are no issues with the consistent 60 fps on both WebGL and Standalone. (Sample and my main project). And In standalone version on Mac, the performance is much better (inconsistent at times), still very much better than WebGL. (The performance issue on standalone occurs whenever the Mac overheats and during that time, the fps drop can be seen on almost all games (Apple Arcade / any game on itch.io etc))
The most important issue among all the others is (As I mentioned in first paragraph), the webgl performance is very INCONSISTENT. The Same build can run in 60fps - 40fps - 30 fps with no changes on the project.
Is there any solution/workaround for this issue on Mac | Retina | WebGL? Or Am I wrong somewhere or Did I miss anything? Any help would be appreciated. Thanks!
(I’ve also attached sample files on the comment - the web build - you can host it in local server and test it - and the unity project which you can open it on 2021.2.3f1)
OS : Mac BigSur 11.4
Unity : 2021.2.3f1