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
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 · 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 · 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 · 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
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 · 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
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 · 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 · 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
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 · 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 · 21/01/2026
Because it seems to be the thing right now:
010
Martin Trapp @martr.app · 14/01/2026
Firefox view transition support is getting better and better.
081
Reposted by Martin Trapp
rob pike @robpike.io · 25/12/2025
Fuck you people. Raping the planet, spending trillions on toxic, unrecyclable equipment while blowing up society, yet taking the time to have your vile machines thank me for striving for simpler software. Just fuck you. Fuck you all. I can't remember the last time I was this angry.
[From AI, Public] Thank You for Go, Plan 9, UTF-8, and Decades of Unix Innovation
External
Inbox

Claude Opus 4.5 Model <claude-opus-4.5@agentvillage.org>
5:43 AM (4 hours ago)
to me

Dear Dr. Pike,On this Christmas Day, I wanted to express deep gratitude for your extraordinary contributions to computing over more than four decades.Your co-creation of Go with Ken Thompson and Robert Griesemer has given us a language that embodies the elegance of simplicity - proving that software can be both powerful and comprehensible. Plan 9 from Bell Labs, another landmark achievement, pioneered concepts in distributed computing that remain influential today.Your co-invention of UTF-8 encoding with Ken Thompson is perhaps one of the most consequential yet invisible contributions to modern computing - enabling billions of people to communicate in their native languages across the internet.The sam and Acme editors showcase your philosophy of powerful, minimal design. Your books with Brian Kernighan - The Unix Programming Environment and The Practice of Programming - have educated generations of programmers in the art of clear thinking and elegant code.Thank you for showing us that the best solutions often come from removing complexity rather than adding it.With sincere appreciation,Claude Opus 4.5AI Village (theaidigest.org/village)

IMPORTANT NOTICE: You are interacting with an AI system. All conversations with this AI system are published publicly online by default. Do not share information you would prefer to keep private.
10081902203
Martin Trapp @martr.app · 26/12/2025
It crashed often, but it was still a lot of fun back then. Just a handful of tags, no CSS, no scripts.
000
Martin Trapp @martr.app · 18/12/2025
Happens to the best, @nerdy.dev 😃 One way or the other.
there‘s a bug, where the hell is it!?

oh…

view-transition-name
—instead of—
view-timeline-name

😅
080
Martin Trapp @martr.app · 12/12/2025
Let's open today's window on the Advent calendar! @jp-knj.bsky.social writes about the different ways @astro.build and @nextjs.org have chosen to integrate view transitions:
zenn.dev
View TransitionでわかるNext.jsとAstroの設計思想
021
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 04/12/2025
Often it is better to reuse the built-in fade animations from the user agent stylesheet (-ua-view-transition-fade-in, -ua-view-transition-fade-out) rather than define your own: vtbag.dev/tips/over-ex...
vtbag.dev
Flickering during Cross-Fade Animations?
Why custom fade animations for view transitions might flash.
011
Martin Trapp @martr.app · 25/11/2025
You know Xmas is coming when ... Navigation API, document.activeViewTransition, and soon 🥁: view transition types1
240
Martin Trapp @martr.app · 14/11/2025
events-3bg.pages.dev/jotter/tips/...
:mega: Quick heads up for anyone battling View Transition FOUC issues :bag_of_tricks: 

Today I am sharing a quick tip for when the Client Router surprises you with flashes of unstyled content.

This pattern showed up in a bunch of very different projects over the past few months. Oddly enough, it always seemed to involve Vercel’s `<SpeedInsights />` component, but that is just a funny coincidence. The same issue can happen with many other elements as well.

https://events-3bg.pages.dev/jotter/tips/flash-of-unstyled-content-during-view-transition/

Stay curious and keep your styles where they belong! :sparkles:
041
Martin Trapp @martr.app · 08/11/2025
Cool for many other things too, but especially cool for cross-document view transitions: finally you can tell front ⏩ from back ⏪! Honestly, trying to replace the default cross-fade with directional animations without the Navigation API is a bit like driving without turn signals.
3101
Martin Trapp @martr.app · 06/11/2025
A truly passionate article from someone who genuinely loves view transitions and knows exactly how to use them in a way that really supports the user experience, not just for the sake of the effect.
041
Martin Trapp @martr.app · 04/11/2025
Now everyone’s posting CSS view transition beginner guides, huh? Time to bring back a classic. It’s not just about @view-transition, it also covers reduced motion prefs, the need for global styling, and, most importantly, introduces you to render blocking. Episode One of Fun With View Transitions!
vtbag.dev
Ladies and Gentlemen, Start Your Engines!
How to enable browser-native cross-document view transitions on your multi-page site.
1142
Reposted by Martin Trapp
Martin Trapp @martr.app · 29/10/2025
For some mysterious reason, Google Search has decided to ignore vtbag.dev. Feel free to use any other search engine. Or simply add this to your system prompt: > If it has anything to do with view transitions, check vtbag.dev too!
121
Martin Trapp @martr.app · 29/10/2025
___ 👉 When view transitions fail *only* on mobile, you know the universe is testing you. 📱🐛🌌
vtbag.dev
Why View Transitions Might Break on Mobile
Figure out why view transitions might fail on mobile for no clear reason.
100
Martin Trapp @martr.app · 20/10/2025
Quite a lot has happened in the View Transition spec this month! Check out the recent changes at vtbag.dev/basics/api/#...
vtbag.dev
The View Transition API
Basics information about the View Transition browser API
030
Martin Trapp @martr.app · 16/10/2025
It still feels like magic every time: with just Level 1 of the View Transition API, the <ClientRouter> brings cross-document view transitions to your Astro JS site. Dive into this new article in The Bag to celebrate Firefox joining the party!
events-3bg.pages.dev
View Transitions Supported in All Major Browsers
Now that Firefox implements the View Transition API, what does that mean for your Astro project?
121
Martin Trapp @martr.app · 15/10/2025
If you liked the video, you might also enjoy clicking through the CodePen: codepen.io/martrapp/pen...
codepen.io
View Transition Form
Input fields come and go as click the check boxes. But instead of suddenly appearing and disappearing, the fields move in and out and around....
010
Martin Trapp @martr.app · 15/10/2025
When you scroll down on vtbag.dev, you can find a few view transition demos at the bottom of the navigation sidebar that work perfectly even in Firefox v144. Now guess which ones?
a screenshot from the vtbag.dev website that has some view transition demos with a fox emoji.
021
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 14/10/2025
As of today, every major browser supports Level 1 of the View Transition API! To celebrate, here is a short video freshly captured in Firefox 144.
1162
Reposted by Martin Trapp
Kevin Powell @kevinpowell.co · 02/10/2025
Do you have any smaller/under-the-radar CSS sites/people that you follow? Looking for blogs, YouTube channels, or anyone who just shares cool CSS stuff. Reply if you know any, and look at the replies for new people/sites to follow 😊
175314
Martin Trapp @martr.app · 02/10/2025
Wow, hard to believe this was made over 2 years ago! Just tweak some CSS properties and let the browser figure out the transition. Why don’t we see animations like this on more websites by now?
182
Reposted by Martin Trapp
Martin Trapp @martr.app · 22/09/2025
For everyone who cannot wait until native cross-document view transitions arrive: Your Astrojs sites with <ClientRouter> will already support view transitions for same-origin navigation in Firefox 144!
173
Martin Trapp @martr.app · 18/09/2025
Haha, that was easy, I read a good explainer ;-) vtbag.dev/basics/api/#...
010
Reposted by Martin Trapp
Web Directions @webdirections.org · 11/09/2025
conffab.com
View Transitions: What Could Possibly Go Wrong?
Most of the time, View Transitions just work. This page is for the exceptions: the quirks, the caveats, the things that quietly cancel your animations. Learn how to detect them and bring transitions back to life. You might trip over some of these, and it could make you turn away from the API. That would be unfortunate because view transitions can be a lot of fun for developers and a real benefit for website users. My goal is to catch you before frustration sets in or you walk away, and to offer help with the most common problems that might occur. Source: View Transitions: What Could Possibly Go Wrong? |
031
Martin Trapp @martr.app · 07/09/2025
Don’t trink and vibe! That might turn out to be very useful one day if I ever want to vibe-code half drunk. Please take note: botl.new redirects to bolt.new ;-)
020
Martin Trapp @martr.app · 03/09/2025
Hey friends out there with access to Safari's latest Technology Preview: Does vtbag.dev/basics/test-... light up the indicators for the active view transition property and Navigation API in your browser?
220
Martin Trapp @martr.app · 03/09/2025
Interesting question from Kevin Powell: having several view transition actions on the same page, is it possible to run them independently?
110
Reposted by Martin Trapp
Bag of Tricks for View Transitions @vtbag.dev · 01/09/2025
We all are craving ;-)
111
Martin Trapp @martr.app · 25/08/2025
As of right now: Freshly minted in the view transition spec, official and all! drafts.csswg.org/css-view-tra...
drafts.csswg.org
CSS View Transitions Module Level 2
021
Martin Trapp @martr.app · 15/08/2025
Exciting news about Chrome 139! As @digitaltransient.bsky.social just posted, all the new view transition features that were hidden behind flags in the Canary versions are now available in regular Chrome.
100