3 ms·

So to slightly clarify, this is transitions between two DOM states. It saves you having to keep something in the DOM during an animation. You make the change an

So to slightly clarify, this is transitions between two DOM states. It saves you having to keep something in the DOM during an animation. You make the change and DOM elements from before can still be visible during the animation. They are also working on view transitions between documents, this isn't that. So rather than having to build a SPA in order to animate between "pages" it will be possible to animate those tradition on a traditional server rendered MPA. Looking forward to that one!

pcthrowaway 4y ago
That's pretty cool, and I wish we got that in the description. I suspect it'll be a few years before this is stable enough to use though (people will continue with the existing javascript-assisted exit transitions until then) I wonder if people will even be using this generation of SPAs at that point, or if we'll need something else by then.
mike_d 4y ago
> You make the change and DOM elements from before can still be visible during the animation. Based on my reading of the docs the API gives you a static screenshot of the old DOM and the live new DOM. So if you have any dynamic content on the page it freezes during the transition.
- madeofpalk 4y ago
  Which is usually how native platform view transitions work.
  - DaiPlusPlus 4y ago
    Can you elaborate? The platforms/frameworks I use, like WPF, don’t use screenshots when animating changes to whole-scene content replacements. (Not saying WPF is good overall either, because it isn’t; but despite it being almost 20 years old now there’s still times when it makes me go “oh, neat”)
    - user3939382 4y ago
      I spent about 3 hours one day playing with WPF and my reaction was: Ah, I see, it's like HTML/CSS but 10x more tedious and inflexible.
  - spiralganglion 4y ago
    This isn't my experience on iOS / Mac OS. I'm used to seeing videos and animations continue running as they shrink and slide around (IIRC, thanks to CoreAnimation being designed to support exactly this from the outset). The occasions where they pause feel like the exception to the norm.
amiga-workbench 4y ago
Reminds me of the powerpoint page-transitions that IE5 supported. <meta http-equiv="Page-Enter" content="revealTrans(Duration=*,Transition=?)">
- porker 4y ago
  Oh I loved using those! Thanks for bringing back memories, I will have to see if I still have a backup of that website.

pcthrowaway 4y ago

That's pretty cool, and I wish we got that in the description. I suspect it'll be a few years before this is stable enough to use though (people will continue with the existing javascript-assisted exit transitions until then) I wonder if people will even be using this generation of SPAs at that point, or if we'll need something else by then.

mike_d 4y ago

> You make the change and DOM elements from before can still be visible during the animation. Based on my reading of the docs the API gives you a static screenshot of the old DOM and the live new DOM. So if you have any dynamic content on the page it freezes during the transition.

madeofpalk 4y ago
Which is usually how native platform view transitions work.
- DaiPlusPlus 4y ago
  Can you elaborate? The platforms/frameworks I use, like WPF, don’t use screenshots when animating changes to whole-scene content replacements. (Not saying WPF is good overall either, because it isn’t; but despite it being almost 20 years old now there’s still times when it makes me go “oh, neat”)
  - user3939382 4y ago
    I spent about 3 hours one day playing with WPF and my reaction was: Ah, I see, it's like HTML/CSS but 10x more tedious and inflexible.
- spiralganglion 4y ago
  This isn't my experience on iOS / Mac OS. I'm used to seeing videos and animations continue running as they shrink and slide around (IIRC, thanks to CoreAnimation being designed to support exactly this from the outset). The occasions where they pause feel like the exception to the norm.

amiga-workbench 4y ago

Reminds me of the powerpoint page-transitions that IE5 supported. <meta http-equiv="Page-Enter" content="revealTrans(Duration=*,Transition=?)">

porker 4y ago
Oh I loved using those! Thanks for bringing back memories, I will have to see if I still have a backup of that website.