When navigating between pages in my Next.js app, the UI freezes for a moment before React starts unmounting and Framer Motion gets a chance to animate the transition.

From what I understand, this happens because Next.js navigation + data fetching blocks rendering before the animation starts, so the blur/fade/exit animation never shows up in time.

How can I make the animation run instantly when I trigger navigation, instead of waiting for Next.js to finish fetching and rendering the new page?