Dev blog with fastest navigation possible.

Website navigation can feel slow when a client's internet connection is weak or when servers are overloaded. However, by implementing optimistic UI updates during navigation, these network delays can be masked, making the website feel quicker.

In next.js pages router, every client navigation to routes with getServerSideProps/getStaticProps triggers a fetch request. What if we could run those client-side fetch requests through a client-side fetch library like react-query? I've created a next-query-glue library that allows you to do it. It brings a lot of control over data requests and greatly improves the user experience.

Links in next.js feels laggy if the user has slow internet / server response with delays / serverless function hits a cold start. It ruins UX. And most likely, users will click fewer links because of those delays. If every link always opened instantly, users would be more active on the website. Fast navigation improves UX, user engagement, and positively impacts SEO. Let's look at three ways to achieve instant navigation.