How is Moovweb XDN's prefetching superior to Nextjs's prefetching?

Edgio Q&A
,
1

In this post about Route prefetching in Next.js I see that Normally, a page is downloaded when you follow a link to it. When you use the nextjs component for navigation, Next.js automatically prefetches the JavaScript needed to render the page.

Next.js prefetches only links that appear in the viewport and uses the Intersection Observer API to detect them. It also disables prefetching when the network connection is slow or when users have Save-Data turned on. Based on these checks, Next.js dynamically injects <link rel="preload"> tags to download components for subsequent navigations.

How is Moovweb XDN’s prefetching different and superior to Next’s built in prefetching?

2
  • Next.js won’t prefetch pages that use getServerSideProps or getInitialProps
  • Next.js will attempt to prefetch all pages that implement getStaticProps, even if they aren’t included in getStaticPaths and thus were not statically rendered at build time. This can lead to significant server costs as each prefetched page would need to be server-side rendered.
  • The XDN’s Prefetch component can prefetch both static and dynamic pages, and will only prefetch pages that are cached at the network edge. This means you can be aggressive with prefetching and not worry about server costs. Even pages that use getServerSideProps can be prefetched once they have been visited by another user of the site.
1 Like