Speed up your Website with Next.js Dynamic Import Lazy Loading

Sdílet
Vložit
  • čas přidán 5. 03. 2023
  • You'll learn how and when to use Dynamic Imports and speed up your website when using Next.js.
    Dynamic imports (lazy loading) are a very important topic to learn if you're serious about using Next.js.
    #Nextjs #React #DynamicImport #LazyLoad #LazyLoading
  • Věda a technologie

Komentáře • 25

  • @Pk_0807
    @Pk_0807 Před měsícem +2

    That was an clear explanation.. haven't heard this kind of explantion from the other videos. Thanks man

  • @eminvesting
    @eminvesting Před rokem +6

    Been procrastinating dynamic imports for a while, thanks for the explainer ^^ Keep up the good work, looking forward to your channel growing

  • @user-ud4bj9vc7l
    @user-ud4bj9vc7l Před 22 dny +1

    Good explanation

  • @Ziggy0120
    @Ziggy0120 Před 9 měsíci +2

    This was a really good explanation. Thanks!

  • @Furki4_4
    @Furki4_4 Před 9 měsíci +2

    Well explained, thank you so much !

  • @Its-InderjeetSinghGill
    @Its-InderjeetSinghGill Před 7 měsíci

    Well explained. Keep doing the great work ❤

  • @JeromeChung
    @JeromeChung Před 9 měsíci +1

    thanks,it's really good explanation.

  • @masterv2.045
    @masterv2.045 Před 8 měsíci

    you rock dude

  • @TheWoselWosel
    @TheWoselWosel Před 4 měsíci +1

    Thanks, man! This saved my ass :)

  • @york2301
    @york2301 Před rokem +1

    Great job!

  • @code_zeal6278
    @code_zeal6278 Před rokem +1

    thank you!

  • @klapaucius515
    @klapaucius515 Před rokem +1

    This may help, thank you.
    Can you make a video on how to find out what is causing your FCP to be slow?

    • @tenacity_dev
      @tenacity_dev  Před rokem +1

      I hope you find it useful!
      I'll keep that in mind for future videos.

    • @prabhurao2773
      @prabhurao2773 Před 2 měsíci +1

      Your async await calls move to server components and start using suspense your FCP will be improved drastically

  • @york2301
    @york2301 Před rokem +2

    How to use next/dynamic without this button, for example do delay load of certain component on first page load?

    • @tenacity_dev
      @tenacity_dev  Před rokem +2

      You can add the component directly without any conditionals.
      If you want to load the component only when it's visible then you can Intersection Observer.

    • @york2301
      @york2301 Před rokem

      @@tenacity_dev is this kinda same like frame-motion? I have opacity:0 when component is not in view, when it is opacity is set to 1?

  • @mr.random8447
    @mr.random8447 Před 8 měsíci

    Trade off is extra network call

  • @z1982_
    @z1982_ Před rokem +1

    Thanks! But why is it 19kb and not 4.6kb ? :p

    • @tenacity_dev
      @tenacity_dev  Před rokem

      Because the `import dynamic from 'next/dynamic'` has it's own JS size.

  • @kairo2891
    @kairo2891 Před rokem

    *Promo SM* ✅