Jerky animation on low-performance device

[stemilymill]

For phetsims/qa#885

previously noted phetsims/qa#871 (comment)

Running version 108.0.5359.172 (Official Build) (32-bit) on Lenovo 100e Chromebook 2nd Gen MTK

When using the sim on my chromebook, the animations and occasionally sounds can briefly freeze and resume. This was most obvious on screen 2, especially with "more photons".
Initially upon clicking "start sunlight" the animations seem normal, and gradually become more jerky as the sim runs.

I should note that these videos do not show the worst examples I saw, but it always magically looked better when I was screen recording

Waves

chromebook.jerky.animation.screen.1.mp4

Photons

chromebook.jerky.animation.screen.2.mp4

Troubleshooting Info

Name: ‪Greenhouse Effect‬
URL: https://phet-dev.colorado.edu/html/greenhouse-effect/1.1.0-rc.2/phet/greenhouse-effect_all_phet.html
Version: 1.1.0-rc.2 2023-01-18 00:39:07 UTC
Features missing: applicationcache, applicationcache, touch
Flags: pixelRatioScaling
User Agent: Mozilla/5.0 (X11; CrOS aarch64 15183.78.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36
Language: en-US
Window: 1300x629
Pixel Ratio: 1.0499999523162842/1
WebGL: WebGL 1.0 (OpenGL ES 2.0 Chromium)
GLSL: WebGL GLSL ES 1.0 (OpenGL ES GLSL ES 1.0 Chromium)
Vendor: WebKit (WebKit WebGL)
Vertex: attribs: 16 varying: 15 uniform: 1024
Texture: size: 8192 imageUnits: 16 (vertex: 16, combined: 96)
Max viewport: 8192x8192
OES_texture_float: true
Dependencies JSON: {}

[KatieWoe]

Noting that on my chromebook I saw a bit of jerkiness, but I didn't think it was enough to be a concern.

[arouinfar]

Thanks @KatieWoe @stemilymill.

@jbphet I don't think this is a show-stopper for the prototype, particularly given @KatieWoe's #265 (comment). Performance optimization can happen later.

[jbphet]

I've made one change to the model where it only checks for energy packets that cross a layer of the atmosphere if the packet is IR energy. This should save a few computations per cycle.

[jbphet]

Another potential change is to only update the arrows in the flux meter and energy balance panel once during an animation frame. Because the mathematical portion of the model can be run multiple times during a single animation step, these arrows are getting updated multiple times. I think that's what several of the deep call trees are in the following screen capture for the 1.1.0-rc.2 version:

[jbphet]

I have done some more "low-hanging-fruit" optimizations, mostly focused on not updating shapes of graph elements more than once per animation frame. @stemilymill and I will work together over Zoom to see if it makes a noticeable difference.

[stemilymill]

While working with JB over zoom, the animations seemed a bit smoother with the optimizations. I ran this and the previous version side-by-side a few times, and while the difference wasn't huge, it seemed that the jerkiness took longer to appear in the optimized version.

[jbphet]

As I worked on this, one of the things I noticed was that in some situations there seem to be a lot of missed frames reported even though the main thread is taking well less than one from time. Here is a screenshot taken from my computer, main display, while Zoom screen sharing is happening, which is one way to make this happen:

Here is a zoom in on the missed frame stuff:

The main thread is taking well less than 16 ms, and yet we are missing frames. I spoke with @jonathanolson and he said this might indicated that the GPU is taking up the time. He tried an experiment, and said:

When I patch SpritesWebGLDrawable to have the drawing be super heavy on the GPU, it shows the same symptoms.

This leads us to believe that the problem is mostly due to performance of the graphics, so we won't be able to improve a whole lot unless some work is done there.

[Nancy-Salpepi]

In rc.3 I see some slowing/pausing every once in a while, but it is minor.
Closing.