The best way to use async/await with import, to import React Componenet



I tried to make my web site to load very quickly, so I implement the dynamic import like this

const AddPrice = async () => await import('/imports/ui/pages/AddPrice.jsx');

and the router I mad it like this

        <Route path="/AddPrice" component={AddPrice()}  />

But It does not seem to work;

Any idea on how to do it correctly , please ?


I use react-loadable for this and it works well:


Thank’s for reply,

I saw it before, did nt try it beaucse I think it require more code to implement it; can I see how you implement it please ?



const AsyncComponent = Loadable({
  loader: async () => import('/imports/ui/pages/Component.jsx'),
  loading: null

<Route path="/" component={AsyncComponent}  />


wow, that’s look awsome, I ll give it a try

Thank’s a lot