Preload Routes in Tanstack Router

In this lesson, we explore how to use route preloading in TanStack Router to enhance user experience by loading data before navigating to a route.

Preloading is triggered when a user hovers over the <Link> component, assuming they are likely to click it next.

This feature is enabled by default for routes with loaders and can be disabled by setting the preload flag to false in the route configuration.

We also discuss how preloading interacts with configuration options like staleTime and gcTime (garbage collection time), which affect how often data is refreshed or removed.

By leveraging preloading, applications can reduce the delay when switching between routes, providing a smoother user experience.