Re: [csswg-drafts] [web-animations-2] controlling animation frame rate (#7196)

Nice, this is a really interesting addition, and possibly a good way to strike a balance between smooth animations and battery drain (e.g. on ads). I'm trying to wrap my head around `CustomEffect` and how it may eventually “supersede” `requestAnimationFrame()`, at least for the animation use-case, and I have a couple of questions:

1) If I'm writing (for example) a game with WebGL, would I essentially have my main game update/render "loop" as a `CustomEffect` callback?

```javascript
let lastTime = document.timeline.currentTime;

const animation = new Animation({ frameRate: 'high' });

animation.effect = new CustomEffect(() => {
  // figure out how much time has passed
  const time = document.timeline.currentTime;
  const deltaTime = time - lastTime;
  lastTime = time;

  // Update game objects
  tick(deltaTime);

  // Render scene with WebGL
  render();
}, Infinity);

animation.play();
```

2) I'm assuming the `progress` argument is on a scale from 0 to 1, so for the case where the animation duration is infinite (common for games), it would always be 0. Is that correct? 

3) Would it make sense to add a second `deltaTime` parameter, so that it doesn't need to be manually calculated?

4) What is the intended difference between the `'high'` and `'highest'` string values? Would `'high'` essentially behave as an alias for 60Hz even for devices that support 90, 120 or 144Hz? Would `'highest'` always provide the _actual_ highest, or would it still interact with, say, low power mode and other factors?

5) Could I use multiple animations on the document timeline to drive in-game animations, possibly at different framerates from the main game render "loop"? i.e. Is it possible to have a separate `CustomEffect` that only triggers some data change, but doesn't actually re-render anything, and then the data is consumed by the "main" `CustomEffect`? A usecase I see for this is performing a physics simulation at 60FPS or even 30FPS while rendering the viewport at 120FPS for AR/VR, or maybe conditionally applying reprojection at `'highest'` framerate if the main game logic running at `'high'` framerate is unable to keep up. This would likely require a mechanism for specifying the execution "ordering" of different `CustomEffects`

6) How does this framerate mechanism interact with APIs that are already temporarily throttled/coalesced in some form? (e.g. Pointer Events) Do they become throttled to the highest framerate being used in the page? Or are they completely unaffected?

-- 
GitHub Notification of comment by coreh
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7196#issuecomment-1093218061 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Friday, 8 April 2022 18:46:05 UTC