I want to control time
Submitted by Tyler Larson
Permalink https://webwewant.fyi/wants/40/
Some DOM elements give you access to their current time but most do not. What frame is your gif or animated PNG playing? Are your CSS animations in sync with the animated images and videos you have playing on the page? Wouldn't it be nice to know or have the ability to stop them from animating?
I work on a product that gives people more control over time. I slow down frame rates if their device has limited capabilities, I show progress bars in situations where it is appropriate, I pause animation when modals are shown over top. To do all of this I've needed to reimplement GIF parsing with streaming data processing, canvas
renderers with layers of caching and time management with control over frame rates that understands the difference between GIF frame delays in hundredths of seconds, video currentTime
in seconds, and standard JS time in milliseconds. I sync our global concept of time with the the animation of these images and other vector animations for text and so on.
- This was presented at
- Smashing Conference
–
New York, NY USA
- Smashing Conference