Sign in

Martin Trapp

@martr.app
494 followers 158 following 392 posts

Maintainer at @astro.build 🚀 Maker of 👜 Bags of Tricks ✨for view transitions @vtbag.dev

PostsRepliesMedia
Martin Trapp @martr.app · 27/08/2026
When those become available in all browsers we can finally get Astro‘s transition:persist natively on the web platform! Shout out to @fancypenguin.party, who envisioned and built this years ago 🫡
191
Martin Trapp @martr.app · 07/08/2026
I’ve put in my response anonymously 😎
020
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 31/07/2026
This is huge for MPAs. Once these features are Baseline, they’ll make a hell of a difference. The initial proposal is open for feedback, so don’t miss your chance to influence where it goes next.
021
Martin Trapp @martr.app · 18/07/2026
I’m beginning to spot a pattern here.
011
Martin Trapp @martr.app · 07/07/2026
Hi @natemoo.re 👋, would you mind taking a quick look at this one?
010
Martin Trapp @martr.app · 07/07/2026
This belongs in the #showcase channel on the @astro.build Discord. Go show it off and make us all jealous! 😄
210
Martin Trapp @martr.app · 26/06/2026
Hi Jeroen, that is a cool heading. Congrats! Is ::after not working because of view transitions in the shadow DOM?
110
Martin Trapp @martr.app · 25/06/2026
Many thanks, @pablolarah.bsky.social, for the kind shout out and for sharing vtbag.dev with your followers. Your support means a lot and helps more developers discover these View Transition resources. It is greatly appreciated!
131
Martin Trapp @martr.app · 22/06/2026
Just to report back: existing animations were not the problem. What then? Please try not to laugh. I should have tested in Firefox, not Chrome. @starting-style works on ::view-transition-* in both, but Chrome seems to ignore it on ::view-transition. Naturally, that was where I started exploring.
codepen.io
CSS Transitions for View Transition Pseudos
...
010
Martin Trapp @martr.app · 21/06/2026
I hope the worst of it passes quickly and you feel more comfortable soon!
010
Martin Trapp @martr.app · 19/06/2026
Haha, yes. Even recent introductions still bring it up, usually as a prominent code block with a “this didn’t work for me” tone, despite the tag was replaced ages ago. Those articles are certainly doing a fine job of teaching every LLM on the planet to remember and suggest that tag forever. 😉
010
Martin Trapp @martr.app · 18/06/2026
Ah, that could very well be it! I don’t think I’d taken that into account. I’ll give it a try. Thanks for the tip!
020
Martin Trapp @martr.app · 18/06/2026
Talking about @starting-style: I’d be happy just to get @starting-style working with the ::view-transition-* pseudo-elements. Or am I just using it wrong?
110
Martin Trapp @martr.app · 16/06/2026
Instead of resizing the iframe, you could make it follow the browser’s window dimensions. Then it looks like the content flows on window resize. Your original solution has lower complexity and better reactivity. Settled then: not every transition between views is best done with view transitions.
010
Martin Trapp @martr.app · 15/06/2026
Reposting the repost 😈
020
Martin Trapp @martr.app · 26/05/2026
🏔️🌲🦇🪵🍄🦉🐻🐾⛺🏕️🦌🦊🐰Come on now, surely there are more cracking examples of View Transitions out in the wild! 👀
130
Martin Trapp @martr.app · 16/05/2026
Looking forward to it!
010
Martin Trapp @martr.app · 08/05/2026
As an alternative to mapping routes and matching paths, you can define the view transition type directly where it happens: on the link. I adapted the Chrome DevRel demo to use @vtbag/turn-signal/link-types 👨‍🔧 Same result, just a different way of thinking about it. vtbag.dev/navigation-t...
vtbag.dev
Link Types Demo - vtbag.dev
The shiny Google Navigation Types Demo from the View Transition Toolkit, but now with @vtbag/turn-signal/link-types
021
Martin Trapp @martr.app · 07/05/2026
As always, the Bag's got you covered: vtbag.dev/basics/pseud...
vtbag.dev
View Transition Names and Generated Pseudo-Elements
What are those pseudo-elements of the View Transition API and how can I style and animate them?
030
Martin Trapp @martr.app · 03/05/2026
🤪
010
Martin Trapp @martr.app · 03/05/2026
Yes, I happily set that up and then counted the minutes until you would reply ;-)
130
Martin Trapp @martr.app · 03/05/2026
Yes! I like that a lot. Very clean and straightforward. Setting view transition types on the link is a solid strategy. It is very similar in spirit to what @vtbag/turn-signal/directions does with data-vtbag-link-types attribute. It also opens the door to all those PowerPoint-style transitions...
110
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 30/04/2026
The View Transition API is getting more forgiving: in future, duplicate view transition names will no longer cancel your animation. The API will sweep them aside, give you a nudge in the console, and carry on with the uniquely named elements. Catch all the recent changes on The Bag’s API page:
vtbag.dev
The View Transition API
Basics information about the View Transition browser API
1136
Martin Trapp @martr.app · 24/04/2026
Hi Michael👋, thank you for sharing this. This is absolutely impressive, and far more than I expected to be possible!
010
Martin Trapp @martr.app · 24/04/2026
Hi Cyd 👋, I guess bugs.webkit.org might be the right start.
010
Martin Trapp @martr.app · 21/04/2026
Little moment of joy today: Web Weekly #190 includes a reference to vtbag.dev! Seeing your own project pop up in a newsletter you genuinely enjoy reading is such a lovely surprise. Made my day. Vielen Dank! 😊
vtbag.dev
The Bag of Tricks for View Transitions
Tools, Tips, and Tricks to Enhance your Dev Skills with the View Transition API!
010
Martin Trapp @martr.app · 17/04/2026
As a reply to an original post by @joyofcode.xyz that neatly shows the different stages of getting aspect ratio right in text-morphing view transitions, and to a brilliant article by @jakearchibald.com that explains it all in great depth with lots of fun.
020
Martin Trapp @martr.app · 11/04/2026
Thank you for building such a cool app with it! View transitions are always fun!
000
Martin Trapp @martr.app · 10/04/2026
I just had a quick look and saw that you mentioned the site in the showcase channel on Astro's discord. Good on you! 😊
010
Martin Trapp @martr.app · 09/04/2026
Hi Paul👋 If you like Bramus' toolkit, you might also be interested in the tools, tips and tricks shared on vtbag.dev
vtbag.dev
The Bag of Tricks for View Transitions
Tools, Tips, and Tricks to Enhance your Dev Skills with the View Transition API!
100
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 07/04/2026
If you enjoy @Bramus' View Transitions Toolbox, you should definitely also take a look at @vtbag.dev Utensil-Drawer: vtbag.dev/tools/utensi...
vtbag.dev
The Utensil Drawer
A growing collection of lightweight utilities to help you craft polished view transitions.
051
Martin Trapp @martr.app · 02/04/2026
Ha ha, tried hard and failed epically. What lovely suggestions for future CSS properties.
010
Martin Trapp @martr.app · 01/04/2026
Great result! Love seeing Astro + Svelte working so nicely together. As for the vtbag.dev part: it was actually the other way round: From @fubits.dev I learned that trick of not redefining swap(), but executing the swap directly in the astro:before-swap event listener.
020
Reposted by Martin Trapp
Martin Trapp @martr.app · 27/03/2026
It would be nice if sibling-index could enumerate the position of pseudo elements. There is not much use in indexing ::before and ::after but I would have plenty of use cases for ::view-transition-group(*), especially in combination with nested view transition groups or scoped view transitions.
011
Martin Trapp @martr.app · 27/03/2026
It would be nice if sibling-index could enumerate the position of pseudo elements. There is not much use in indexing ::before and ::after but I would have plenty of use cases for ::view-transition-group(*), especially in combination with nested view transition groups or scoped view transitions.
011
Martin Trapp @martr.app · 22/03/2026
Delighted that nobody planed to name their app “Martr”. Perfectly safe as no one can pronounce it anyway.
040
Martin Trapp @martr.app · 17/03/2026
Yes, that‘s what I heard 😇
000
Martin Trapp @martr.app · 14/03/2026
@sarah11918.rainsberger.ca I think it is wonderful that Astro will not lose you entirely, and I am already looking forward to your “see you later” in the March newsletter. 😊
110
Martin Trapp @martr.app · 14/03/2026
Chapeau and h/t to you. 🎩👏✨ I hope you enjoy your well deserved time off! The lovely thing is that, despite the sadness that you will no longer be the guardian and champion of the Astro Docs, most the replies carry a sense of gratitude and fond memories.
140
Martin Trapp @martr.app · 09/03/2026
Yikes, that’s surprising! Now you’ve got me curious. I’ll check it out later.
100
Martin Trapp @martr.app · 07/03/2026
> They dont perfectly match Hi @nerdy.dev, I reckon delaying the start of the green ball in codepen.io/argyleink/pe... would sync them? (requestAnimationFrame(()=>requestAnimationFrame(()=>ball2.classList.add(state)));
120
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 07/03/2026
If you like Adam's article, you might also want to have a look at vtbag.dev/vector-demo/ and fun-with-view-transitions.pages.dev/episode/7/page
vtbag.dev
The Vector Demo
A view transition tech demo were the old and new positions of morphing images control the trajectories.
043
Reposted by Martin Trapp
Erika @erika.florist · 23/01/2026
Sarah and Yan are both absolutely incredible people to have in your team and are a massive part of Astro's success. If you're looking to make your docs better, you'd be missing the opportunity of your life by not hiring them!
0122
Martin Trapp @martr.app · 17/02/2026
==> SPREAD THE WORD Hands-on tutorial for mastering View Transitions! Seven interactive exercises guide you from basics to advanced techniques: morphing snapshots, healing text, and more. Code at github.com/vtbag/fun-wi..., Episodes on vtbag.dev/fwvt/welcome/
vtbag.dev
Hello, and welcome to Fun with View Transitions!
Embark on a journey into the marvelous land of the View Transition API.
0142
Martin Trapp @martr.app · 16/02/2026
Oh, neat. Waiting for images to render was my first thought. Getting more precise control over when the ::view-transition-new pseudo is captured would be awesome!
000
Martin Trapp @martr.app · 13/02/2026
Yes, I saw it on the list: cross-document view transitions including `link rel=expect`.
040
Martin Trapp @martr.app · 02/02/2026
(Element)-scoped view transitions are going to change the game once they hit baseline!
030
Martin Trapp @martr.app · 28/01/2026
😅 True 🙂 Definitely not the same scale.
100
Martin Trapp @martr.app · 28/01/2026
Danke für den Hinweis auf snapDOM, das kannte ich bisher noch gar nicht. Vielversprechend!
110
Martin Trapp @martr.app · 28/01/2026
Yes, that is sad, but probably necessary. Like making sure not everyone can just walk in and buy a firearm… …well.
100