React Lazy Load Code to Load Faster | React Code Splitting Tutorial

Поделиться
HTML-код
  • Опубликовано: 3 окт 2024

Комментарии • 79

  • @devkumar9889
    @devkumar9889 Год назад +4

    What a coincidence, I learnt this just now in my course 😂 , and I think this one is even in more detail .

  • @voice_famous_books4301
    @voice_famous_books4301 10 месяцев назад +1

    We have a lot of good teachers for teaching programming but you are the best:)

  • @ampleeeeeeeee
    @ampleeeeeeeee Месяц назад

    Thanks, I was having some weirdness with my router and this helped find the issue

  • @sahaneakanayaka3394
    @sahaneakanayaka3394 Год назад +4

    Another great tutorial Dave... I have a small request though. Would you like to create a tutorial on how to deploy web apps. Different options for deploying web apps, security concerns etc. There are not much tutorials on deployment process, if you can create one that is definitely going to help 🙏🙏❤

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      Thank you! You can search my channel from the channel homepage. I have a few tutorials on different deployments. Here is one of them: ruclips.net/video/-I_6kVPrX2o/видео.html

  • @Web-Himansu
    @Web-Himansu Год назад

    Your voice is calm,clean and beautiful voice and I learn deeply from your Video textbooks .

  • @Web-Himansu
    @Web-Himansu Год назад +3

    Your quotes is always remember "keep striving for progress, not perfection ".

  • @djt6fan
    @djt6fan Год назад +5

    Hey Dave, I love your teaching style and your explanations are clear, I would like to make a request, and I'm sure many would appreciate it if you could find some time to do this: would it be possible for you to create a course akin to data structures and algorithms, or at least something similar to that, teaching us how to approach a problem from a programmer's standpoint? I have learned a great deal about web dev from your videos, but I feel I still lack the logic when I approach a logical problem in JavaScript problem, or any language at that. Would it even be possible to teach this using JS, since most such courses are in C/C++? Love your work, keep doing what you're doing!

  • @thedevelopermind
    @thedevelopermind Год назад +3

    You are a great teacher, Dave! Thanks for this priceless videos.

  • @mrbilchalan
    @mrbilchalan Год назад +1

    in role based applications, its very much useful. thank u. thanks a lot.

  • @ghulammujtaba9236
    @ghulammujtaba9236 Год назад

    I kept receiving warnings in the app to add Error Boundary. Now I know what to do. Awesome tutorial.

  • @blainenye7049
    @blainenye7049 Год назад +1

    Well done Dave! Very clear and to the point.

  • @agus-wesly
    @agus-wesly Год назад +1

    Thx Dave, I learn a lot from your videos

  • @dopetag
    @dopetag Год назад +1

    Thanks, Dave!

  • @IamPali2024
    @IamPali2024 7 месяцев назад

    Criminally underrated 👏👏👏👏

  • @MOJICA7257
    @MOJICA7257 Год назад +1

    Thanks! Dave
    for another great content.

  • @TravinskiyVladislav
    @TravinskiyVladislav Год назад +1

    Thank you, Dave

  • @osiris9843
    @osiris9843 8 месяцев назад

    You are a great teacher, sir...

  • @khalilbenmeziane8836
    @khalilbenmeziane8836 Год назад +1

    thank you mr dave keep going 👍🥰

  • @Hacking-NASSA-with-HTML
    @Hacking-NASSA-with-HTML Год назад +1

    Thank you so much sir🤝 Your work is very impressive👍❤

  • @Arshi728
    @Arshi728 Год назад

    It would be great if you do full fledge video on making scalable app using all these advanced React concepts

  • @willyhorizont8672
    @willyhorizont8672 Год назад

    Yeay in depth review of React.lazy and React.Suspense 🚀🚀🚀🚀

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      Right on! This video uses React Suspense because React.lazy requires it, but I cover Suspense in depth in a separate video here: ruclips.net/video/1_dLaSjzOMY/видео.html

    • @willyhorizont8672
      @willyhorizont8672 Год назад

      @@DaveGrayTeachesCode I know. I watch the Suspense video a lil while. now with this its complete. Thanks Dave!! 🚀🚀🚀

  • @rakaa31
    @rakaa31 Год назад +1

    please make videos with facecam as it keeps us more engaging

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад

      Check the community tab on my channel for my recent survey about this.

  • @fikilekentane6982
    @fikilekentane6982 11 месяцев назад

    tnx Dave, u awsome 🙏

  • @hardwired66
    @hardwired66 Год назад

    Thank you for the lesson sir, next maybe react unit testing async form

  • @sohitmodi9743
    @sohitmodi9743 Год назад +1

    Hey Adrian recommended me to watch your videos for getting updated with latest React features that is brilliant..
    I have 1 request it would be great if you do it.
    Can you make a video on React-boilerplate ???
    With (React, rtk, routing, API integration _common file)
    I promise I will share personally to 80-100 peoples in my company.

  • @sonamohialdin3376
    @sonamohialdin3376 Год назад

    Thank you for the useful tutorial

  • @andre-wv9eg
    @andre-wv9eg 8 месяцев назад

    Thanks for tutorial sir

  • @khitibhusannaik1471
    @khitibhusannaik1471 Год назад

    Hello Sir, I learned these things from you,
    1- html
    2- css
    3- tailwindcss
    4- javascript
    5- react
    6- git/github
    now I want to start some freelancing can I start my freelancing and prepare for more advanced web development journey for companies with this. 🎨
    🔵🏃‍♂🏃‍♂🏃‍♂

  • @maroinealarabi1473
    @maroinealarabi1473 Год назад

    Hey Dave I have a recommendation about web development freelancing if you have an experience or info about it to make some videos how the process goes from a to z best wishes tnx for your effort you put in the channel

  • @michaelscofield2469
    @michaelscofield2469 Год назад +1

    Plase make videos about webpack and babel, if you have knowledge

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      Good tool topics! They are often used "under the hood" when we build a project - for example, when a React project is built with "npm run build". However, Vite does not use webpack. Read more here: vitejs.dev/guide/why.html ...You can play around with Babel here: babeljs.io/

    • @michaelscofield2469
      @michaelscofield2469 Год назад

      @@DaveGrayTeachesCode Thank you

    • @waleedsharif618
      @waleedsharif618 Год назад

      @@DaveGrayTeachesCode also Nextjs does not use webpack

  • @danushkap
    @danushkap Год назад

    Hi Dave, Could you kindly do a video series on "React Native"
    Thanks so much.

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      Thank you for the request! I do want to cover React Native sometime this year 😀

    • @danushkap
      @danushkap Год назад

      😁 Oh! Thanks so much Dave..

  • @Alex-bc3xe
    @Alex-bc3xe Год назад

    God bless this man is awesome.

  • @abdullahalani1188
    @abdullahalani1188 Год назад

    Great explanation Dave! Also could you please give me the name of the extension that shows the lines from the opening to the closing brackets around the code block? Min 9:30 onwards

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      No extension needed. Here's how to set it up: ruclips.net/user/shortsMDaxWffMjrQ

    • @abdullahalani1188
      @abdullahalani1188 Год назад

      @@DaveGrayTeachesCode Thanks a lot!

  • @shinpaingmin603
    @shinpaingmin603 9 месяцев назад

    Sir, can you explain me the difference between Blurhash for image lazy loading and code splitting. If I use code splitting, do I still need to use Blurhash and vice versa.

  • @ivankraev4264
    @ivankraev4264 Год назад

    Great, I have one question
    If I want to navigate from home page to about page (which is lazy loaded), and while about page is being resolved, to remain on the. home page and show some loading overlay, how can I do that ?

  • @yabuking84
    @yabuking84 4 месяца назад

    when do onReset executes?

  • @krunalshrimali4471
    @krunalshrimali4471 Год назад +1

    What is error boundary used for ?

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад

      The video I recommend on React Suspense and Error Boundaries covers it here: ruclips.net/video/1_dLaSjzOMY/видео.html

    • @krunalshrimali4471
      @krunalshrimali4471 Год назад

      Thanks

  • @SanthoshBhoopal
    @SanthoshBhoopal 25 дней назад

    Does SSR make this obsolete?

  • @TheTomislavb
    @TheTomislavb Год назад

    Great video but there is a glitch when navigating to the admin page for the first time

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад

      What you are seeing - very briefly if it seems like a glitch - is the component Suspense provides while loading the admin area. This would likely take longer when loading a true admin dashboard or other larger amount of code.

    • @TheTomislavb
      @TheTomislavb Год назад

      ​@@DaveGrayTeachesCode I know, the Skeleton component is shown for a really short time. Too bad this looks like a glitch

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад +1

      @@TheTomislavb Just understanding the concept is what is important here. In a deployed app, it would likely take longer to load and not be such a brief flash. It works as intended.

  • @onur-9158
    @onur-9158 Год назад

    what to do with my lader and action ?

  • @aishanstha
    @aishanstha Год назад

    if there is a way we could wrap lazy-suspense for various providers like: redux, context API etc?

    • @DaveGrayTeachesCode
      @DaveGrayTeachesCode  Год назад

      It works well with SWR. Check documentation for your API layer of choice.

    • @aishanstha
      @aishanstha Год назад

      @@DaveGrayTeachesCode i got messed trying to use lazy on my named exports😁
      Really appreciate if could make a continue video onto it in future with uses of redux providers n other named exports providers.
      Thanks🙏

  • @augustineudeh1584
    @augustineudeh1584 Год назад +1

    First here