Use view transitions

[nickrttn]

Adds Astro's implementation of View Transitions. I haven't enabled any actual page navigation animation because the default crossfade was not very visually pleasing and I don't think we want something like slide effects for tus.io.

Enabling this without actual animations still has some benefits, namely full client side routing after the initial load of the page. That amounts to no more full page reloads when clicking links which is a nice benefit.

@nqst if you feel like playing around with full page transitions, to see if you can get them to look nice, that'd be a nice addition here! I think adding a <div /> around the <slot /> component in src/layouts/default.astro should be a good place to add animation directives, which you can find out more about here: https://docs.astro.build/en/guides/view-transitions/#built-in-animation-directives. If you don't have the time, don't worry, it's not a priority at all, just something fun to play with.

[nqst]

I just checked locally how it looks with the animations, and I honestly think that it works/looks much better without any :) Just a quick switch between pages seems nice and familiar to me.

Few questions:

• Does using View Transitions mean that the browser won't show the loading progress? If so, we might need to add some GitHub-like thin progress bar at the very top of each page to indicate the loading.
• Not sure if it's related, but I see a rate limit error each time I try to open http://localhost:3000/support. Also, the Back button won't take me back to the previous page from the error page.

[nickrttn]

I just checked locally how it looks with the animations, and I honestly think that it works/looks much better without any :) Just a quick switch between pages seems nice and familiar to me.

All good, let's keep transitions out for now :)

Does using View Transitions mean that the browser won't show the loading progress? If so, we might need to add some GitHub-like thin progress bar at the very top of each page to indicate the loading.

In theory, navigations are instantaneous with View Transitions enabled because pages are prefetched. I also didn't see anything about being able to access the loading state of a page so not sure if this is possible.

Not sure if it's related, but I see a rate limit error each time I try to open http://localhost:3000/support. Also, the Back button won't take me back to the previous page from the error page.

This is likely communication with the GitHub API being rate-limited. Without a token, you have only a limited amount of requests you can make before hitting it, and we do a lot of requests to fetch all the contributor data. You should be able to add a .env file containing a GITHUB_TOKEN environment variable. This page tells you how to get one.

[nqst]

Thanks for the explanation, Nick! Just one thing:

In theory, navigations are instantaneous with View Transitions enabled because pages are prefetched.

Is this applicable to the blog posts as well? I mean, will all the blog posts be prefetched too? If there are many or if they're content-heavy, that might not be ideal.