CODEWITHSUNDEEP
reactjscode-splittingreact-loadable
dominik791
dominik791

Reputation: 752

Preloading with React.lazy

react-loadable exposes a very nice method YourLoadableComponent.preload() thanks to which you can easily preload component before it gets rendered whenever you want (onMouseOver etc).

I can see I can do something like: https://github.com/pomber/react-lazy-preload-demo/pull/8/commits/126c1bf6e2a23b3e3f7eb0ffb1b4db260516643f so to call import() manually, store the resulting Promise in some variable and then pass it to React.lazy(). However it can be a bit too verbose and problematic if I wanted to preload on some class method call or in lifecycle hook.

Any other alternatives to above approach?

Upvotes: 6

Views: 6995

Answers (1)

Ian Schmitz
Ian Schmitz

Reputation: 330

You can give https://github.com/ianschmitz/react-lazy-with-preload a try. Seems to suite your use case nicely!

Upvotes: 4

Related Questions