Delaying the load of a @loadable/component

Question

Trying to figure out why both of these are loading at the same time when I have a timeout of 10 seconds to load the footer. Currently I'm getting both load at the same time.

   import loadable from '@loadable/component';
    
    const Footer = loadable(
        () =>
          new Promise(resolve =>
            setTimeout(() => resolve(import('src/Footer')), 10000), // 10 secondsdelay
          ),
      );
    
    const Layout = () = {
       return (
        <div>
           <div>RENDER RIGHT WAY</div>
            <Footer>
        </div>
       );
    }