Unstable framerate

[kmamal]

Is using setTimeout(0) in an infinite loop still the recommended way to draw every frame? I want to do animation and motion using @napi-rs/canvas, and when using this code with setTimeout(0):

window.render(pixelWidth, pixelHeight, pixelWidth * 4, 'rgba32', canvas.data(), {
      scaling: 'linear',
      dstRect: { x: 0, y: 0, width: pixelWidth, height: pixelHeight },
    })

the FPS I'm seeing fluctuates a lot around at 60. At times it even goes to 70 or reduces to 30. If I use skia-canvas' own Window, I get a proper 60±1 FPS.

Am I doing something wrong here? Or is this expected?

Originally posted by @ajitid in #52

I can't reproduce that on my system so I'm splitting it into a new issue.

By default the windows created by @kmamal/sdl have vsync enabled so your framerate should match your monitor refresh rate. Can you share more details about your setup?

• What OS?
• Are you running the example as-is or have you made modifications?
• What are the values of window.accelerated and window.vsync?

[ajitid]

Hi! Here are the details you asked:

OS: Windows 11
Display: 2560x1440 with 125% scaling
Monitor refresh rate: 59.95 Hz
window.accelerated and window.vsync: Both true

I'm not using the example, instead you can find the code here.

To reproduce:

1. Clone the repo I mentioned above (use node-sdl-repro-71 branch)
2. Install deps using bun install and run using bun run main.ts

You'd see 3 values being logged to the console. Those are: 1% low FPS, minimum FPS recorded and maximum FPS recorded.