Posted on
1 minute to read
Improving perceived load times with client-side preloading and view transitions
Applying two separate -- and low effort! -- frontend technologies to your site can improve its perceived load times and give people a nicer experience.
Client-side preloading isn't a new technique, but libraries like instant.page provide a quick drop-in that allows you to prefetch links before a reader clicks on one. This quietly loads the page and caches it, so when the link is clicked, the page is already accessible. It can lead to your site feeling like everything loads instantly.
CSS View Transitions are new-ish (the spec was published in 2023), but browsers have quickly implemented them. There is a very simple CSS one-liner which can provide a nice cross-fade transition between pages on your site. More advanced transitions for individual elements are also available.
With both techniques applied -- like I've done on this site -- you end up with pages that feel "instant" to load which also have nice transitions. Lovely!
