Hi @smitbarmase Next.js has a prefetching mechanism that loads the instant-loading-state content of links on the page. Your /about-us page has a layout (in app/(nav)/) that has a link to /. Next is prefetching the / route when /about-us loads so that it can transition instantly if you click this link. When we prefetch the / page we also start loading the code associated with that page (otherwise the transition would be blocked on this code loading)

Aside from it being surprising if you aren't aware of the prefetching behavior is the the fetchign of swiper problematic?

Hey @gnoff , I am aware of the prefetching behavior of Next.js's Link component. I am using the <QueryLink> component, which is essentially a wrapper around <Link>. However, as you can see, I am using prefetch={false} on Link. So, why is it still prefetching?

Additionally, the Swiper library introduces 40-50 KB of redundant code to pages that do not use it.

@smitbarmase indeed I missed that :)

I've taken a closer look and there does seem to be something up with the dependencies between a client component and that chunk. Initially I thought it might be an instance where webpack makes fewer larger chunks to avoid having too many small ones and it just happens to include this chunk on the /about-us page because something QueryLinkClient depends on was also in that chunk. However that doesn't actually seem to be the case. I'll follow up with more info when I have it

Sure, @gnoff, it seems there's an issue with how Webpack bundles things. Also, the workaround I've found is to make a copy of the QueryLink and QueryLinkClient components, and then use that copy in the layout. This somehow prevents the issue.

This issue has been automatically marked as stale due to two years of inactivity. It will be closed in 7 days unless there’s further input. If you believe this issue is still relevant, please leave a comment or provide updated details. Thank you.