#994: Spec review for Animation.progress
Discussions
2024-10-07
discussion on why this isn't in "explainers by google"
Dan: assigns jeffrey & lea
2024-10-14
Jeffrey: It seems confusing that Animation.progress would be the overall progress over all iterations, while getComputedTiming().progress would only return progress over the current iteration. They should have different names.
Jeffrey: https://github.com/DavMila/explainer-animation.progress?tab=readme-ov-file#time-driven-animation doesn't look compelling to me: you need some trigger to call updateInfo(), but a progresschanged event defeats a lot of the purpose of putting animations into CSS in the first place, that they can run more efficiently and off-the-main-thread.
Jeffrey: Similarly, https://github.com/DavMila/explainer-animation.progress?tab=readme-ov-file#scroll-driven-animation seems roundabout and should show the code an author would use to show a scroll percentage without using animations. IIRC, it's possible to use animations to set an element's contents, although it's a bit tricky and breaks copy/paste. Maybe the proponents should work on that instead?
<blockquote>The explainer doesn't justify this feature well enough. It presents two use cases: one for showing a percentage through a time-based animation, and another for showing a scroll percentage.
The time-based animation has two issues:
- It doesn't say why the developer is writing code like this in the first place.
- It doesn't show how
updateInfo
would get called. A big reason to do animations with CSS is to get them off the main thread, but this seems to require interrupting the main thread periodically to change the text.
The scroll percentage code doesn't show the "before" state? What would the code look like if you only used scrollTop
to measure progress and draw the meter? Is using animations simpler or more performant here?
It's possible but complicated to render text directly from an animated property: https://dev.to/madsstoumann/clocks-countdowns-timing-in-css-and-javascript-554n. Maybe the use cases for Animation.progress
would be better served by making that easier to use?
Finally, if you do need a property for this, it seems confusing to have two .progress
properties with different meanings (within-iteration for getComputedTiming().progress
vs overall for Animation.progress
). Please find a different name for the new meaning.
2024-10-21
we discuss draft comment from Jeffrey
we agree to post
Posted to https://github.com/w3ctag/design-reviews/issues/994#issuecomment-2427287323.
2024-11-04
Jeffrey: [sketches explainer update]. My sense is to say to keep trying to find a clearer name, but otherwise that this looks good.
Jeffrey to draft a closing comment.
OpenedSep 17, 2024
こんにちは TAG-さん!
I'm requesting a TAG review of Animation.progress.
This feature adds a "progress" property to the JavaScript class Animation. The goal of this property is provide authors a convenient and consistent representation of how far along an animation has advanced across its iterations and regardless of the nature of its timeline.
Further details: