16 ms·
SPA view transitions land in Chrome 111
- mnd999 4y ago[flagged]
- deleted 4y ago[deleted]
- dx034 4y agoThere's nothing wrong with companies driving industry standards. That's how it works in other industries as well. As long as they're not there to purely benefit Google or implemented in a way that other browsers cannot replicate, I don't see the problem.
- Bootvis 4y agoOrder matters, did they try to find consensus or did they just go ahead and implement something? The latter doesn’t lead to standards.
- izacus 4y agoConsensus with whom? Other companies who just take the work they do in form of Chromium for free and repackage it? Or the other one browser that's barely relevant due to years of mismanagement?
- quickthrower2 4y agoFirefox And Safari. Not sure which you are referring to?
- zacharyvoase 4y agoActually, I think implementing first and standardizing later is how a lot of (dare I say, most?) Web standards came about. And without patents and other IP restrictions, I don't think there's anything wrong with that.
- gerash 4y agoConsensus from Microsoft who repackages their work as Edge and profits off of it by setting Bing as the default?
- mnd999 4y agoShrug, would you expect anything else from Redmond?
- deleted 4y ago[deleted]
- c7DJTLrn 4y agoI would find it more exciting if they started removing stuff from browsers, like legacy APIs and features with a very high attack surface.
- Gigachad 4y agoSuch as?
- c7DJTLrn 4y agoWeb Serial, WebUSB, WebVR to name a few.
- andix 4y agoWhy? Web usb and web serial are awesome for point of sale applications. To interface with scanners, receipt/ticket printers, rfid, … It’s so much easier to interface all that hardware just from an intranet website, instead of rolling out your own native code to thousands of different devices with different operating systems. We did that in the past, now they all just run chrome.
- c7DJTLrn 4y agoThis mentality of shoving everything in the browser because native is too hard or something is why we're in this mess. The web was invented as a presentation layer for information, not a VM that executes arbitrary remote code and can talk to hardware.
- victorbjorklund 4y agoFinally!
- sgt 4y agoLooks great but I see it chows CPU. I wonder if it's doing software rendering instead of GPU?
- Veuxdo 4y agoAlmost certainly GPU
- zaynetro 4y agoIs there a video or some animations where I could see this feature in action? (Don't have access to Chrome atm)
- collaborative 4y agoAfter years of using transitions I concluded that there is nothing better than a static (non) transition. Heavy usage of apps/sites with transitions leads to dizziness
- manuelmoreale 4y agoThank you. I feel less lonely now because I also think page transitions in the majority of cases add nothing but confusion to a site. There are exceptions of course.
- TheFragenTaken 4y agoI am usually the kind of person to increase the animation speed on my phone too, and I think (while it looks impressive), the example is pretty sluggish to me. But I think, for PWA's this is a huge step-up, as you for example can mimic the backwards-swipe behaviour for page navigation.
- lavela 4y agoIt would be great to have an 'rem for css animations' where you don't specify your transition times in seconds but in fractions of a base unit, which might default to 1 second, but can be changed in your browser settings similar to your base font size.
- antigirl 4y agothese are just extravagant examples. Optimistic UI updates work best. I don't click links that open/load a fresh new page unless absolutely necessary as theres cognitive resistance stopping me from doing it.
- jwr 4y agoThey also slow things down. This can be unacceptable for power users, who just want to "get things done". As a practical example, I can't use Apple's "spaces", because they force me to sit through an animated transition when switching between screens/workspaces/whatever. It's fun the first time, but gets really old after a hundred or so.
- samwillis 4y agoSo 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 agoThat'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 agoWhich is usually how native platform view transitions work.
- DaiPlusPlus 4y agoCan 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”)
- 4y ago
- mgraczyk 4y agoLooks great on my Android phone. On my Linux desktop with a 4k screen, it renders at ~2 fps and looks absolutely horrible. Hopefully this will be fixed!
- muppetman 4y agoI looked at this and thought "What am I looking at? There's some janky animation as things shift around but what's the bit I'm missing??" and then it slowly dawned on me clicking around a bit more that it must be the poxy animation bit itself. I mean I guess web consumers are just SCREAMING OUT for this and I've been living under a rock? Obviously I am old and grumpy but holy crap this is exciting browser development now. Seesh.
- silversmith 4y agoI just think it looks neat. I first saw this animation demonstrated by chrome team years ago in some developer conference video, and have been searching whether it's done every couple of months since then. Sure, if you make seconds-long animations on every interaction, or implement this for blog posts, it's going to be unusable. But for web apps, short animations in UI transformation make it feel more... held together I guess. Consistent. I like it.
- r34 4y agoI think it's a good time to introduce a new button to the browser interface, as the gap between the original "take me back to the previous document" and some new concepts like the one presented here is getting bigger and bigger. But maybe I'm just old?;)
- lopkeny12ko 4y agoTransitions and animations on the web are already abused by web developers enough today. The last thing we want is a browser API that automatically applies transitions to the entire DOM. Prepare for endless frustration as designers start implementing artificial 5 second delays while you wait for a pretty transition between two states of a page.
- anewhnaccount2 4y agoI suppose one advantage here as that it is might be possible to disable with a userstyle for power users.
- mnd999 4y agoWhen one company, that has a culture of incentivising new features over maintenance, has monopoly control over the web you get a lot of new features. The merits of those features is somewhat irrelevant.
- mort96 4y agoI once saw a Google talk about video codecs in Chromium. It included a section where they talked about the life cycle of a video codec. They apparently introduce video codecs with plans for deprecating and then removing them. Literally breaking all sites on the web which rely on that codec. That, to me, perfectly encapsulates their philosophy of introducing new features without committing to maintaining them. They don't view the web as something that's worth not breaking, they seem to only value the actively maintained part of the web which has enough resources to stay on top of Google's treadmill.
- illiarian 4y ago> They apparently introduce video codecs with plans for deprecating and then removing them. Literally breaking all sites on the web which rely on that codec. It's even worse than that. They force hardware manufacturers to adopt their codec on pain of retribution: https://www.protocol.com/youtube-tv-roku-issues https://www.protocol.com/youtube-tv-roku-issues Drop the codec, oops, your devices are obsolete, there's nothing we can do about it
- xlii 4y agoThere’s something in the video that makes me feel uneasy. Hope that other browsers won’t follow the suit cause I’ll have to get myself comfortable with “use reduced motion” switch.
- jeroenhd 4y agoI think it's the motion curve and the slow animations. Faster transitions and a rounder motion curve may just fix the problem, I believe. The YouTube app has the same types of transitions but there it all feels a lot smoother.
- agumonkey 4y agoI find the transition trend interesting, smooth / continuous morphing between complex structures is important IMO. Also trendy in biology.
- matsemann 4y agoI remember this was built in in some browsers back in the days, as transitions between whole pages. Basically the same transitions as in simple presentations (fade, push in from side, reveal as a circle, etc) <meta http-equiv="Page-Exit" content="revealTrans(Duration=1,Transition=3)"> Edit, found a video: https://vimeo.com/111317293 https://vimeo.com/111317293
- mike_d 4y agoThis wasn't as much a browser feature, but an artifact of Microsoft using the same mshtml library to power as much of the system as possible in Windows 98 (IE, Explorer, the Office suite, etc). If I remember correctly one of the selling features of Powerpoint at the time was the ability to export to HTML for "portable" presentations.
- user3939382 4y agohttps://internetbrothers.com/dhtml_transitions.htm https://internetbrothers.com/dhtml_transitions.htm
- raviguptacyble 4y ago[dead]
- Veuxdo 4y agoVery reminiscent of what Ilograph is doing for system diagrams: https://app.ilograph.com/demo.ilograph.Ilograph/Request https://app.ilograph.com/demo.ilograph.Ilograph/Request (FD: I am working on this)
- hexo 4y agoPure vomit. Only good transition is no transition. Stop this wasteful abomination now.
- exabrial 4y agoI just don’t want SPAs anymore.
- wslh 4y agoI feel that the UI is faster, is it only my impression?
- arianvanp 4y agoThe transition masks load times as you interpret the movement as interaction.
- solarkraft 4y agoAwesome, another Chrome-only API. They sure are embracing and extending the web!
- elecush 4y agowow it's almost like they could add a page-specific url bar and decided that was silly, let's have it all point to the same domain
- pornel 4y agoThe really exciting part is the next step — providing this for regular navigation across pages. This way you can have the fancy look of single-page JS apps without the heft and complexity of actual single-page JS apps.
- pleb_nz 4y agoAs someone who disabled transitions wherever noticable on all my operating systems and who avoids IE, sorry I mean chrome or any chromium derivatives, this isnt for me. However, for users it will affect, can it be disabled. Does this mean more code must be added to code to cater for browsers that do not implement this API can still the this feature? How many chrome only APIs already exist and how often do they break sites on spending browsers. Genuine question as I use Firefox, but have never noticed a broken site so I wonder if these fail gracefully or maybe chrome only APIs are rarely used it I don't visit those types of sites....