I want to prefetch one component for my application. And that's how I'm trying to:
const Info = React.lazy(() => import(/* webpackPrefetch: true */ '@view/info/Info'));
Webpack use this magic comment to generate some links:
<link rel="prefetch" as="script" href="<href1>">
<link rel="prefetch" as="script" href="<href2>">
<link rel="prefetch" as="script" href="<href3>">
href1, href2 and href3 are working links and they lead to exsiting files.
But for some reason my chunk does not downloading until I try to use Info component.
What is the problem here?
EDIT1:
The Info component is too heavy. 1/3 of whole application is just this component. All I want is to make the first loading faster. But also I don't want to make the user wait when he needs this component. That's why I want to prefetch it.
I want to prefetch it, not to preload. It would be great if this component would be downloaded while page is inactive.