In this episode, we're diving into the awesome new prefetching functionality offered by Inertia, which is a really simple way to make your app "feel" way faster to users. We'll start off with the basics, using prefetching on navigation links so that when a user hovers over a button or link, the data for that destination page is fetched in the background. This way, by the time they click, the data is already there — no annoying one second delay!
We'll walk through a simple example by setting up a new route and page for users, simulating a slow database response with a sleep command, and then implementing prefetching on the navigation. We'll also go into how the cache works for this prefetching: you can control how long prefetched data hangs around, and tweak this to fit how often your data changes. There’s also discussion about more advanced caching strategies, like the stale-while-revalidate pattern, which you can use if you want to always keep your data extra fresh.
Next, we kick it up a notch and look at programmatic prefetching — something super useful when you're working with pagination, load more buttons, or infinite scroll setups. We'll build a paginated list of users, and then wire up a "load next set" button so that as the user hovers over it, the next page’s data gets prefetched. That way, clicking "load more" feels instant because the data is already sitting in the cache, just waiting to be shown.
You’ll also see how to control exactly when prefetching happens (on hover, on mount, or both), and some ways to flush or clear out cached data if you need to. Throughout the video, there are lots of practical tips for deciding when and how to use prefetching wisely — so your app feels snappy and your users stay happy.