Next.js Visually Explained: Partial Pre-rendering (PPR)

Sdílet
Vložit
  • čas přidán 26. 08. 2024

Komentáře • 255

  • @real-oppenheimer
    @real-oppenheimer Před 7 měsíci +166

    The way these concepts are explained (like the content and the wording) together with the matching visualizations makes this one of the best "dev tutorials" I have ever seen. Great job!

    • @ridass.7137
      @ridass.7137 Před 6 měsíci +1

      billions spent right

    • @Delba
      @Delba  Před 6 měsíci +12

      Thank you for saying that, I appreciate it 🙏

  • @JohnBuildWebsites
    @JohnBuildWebsites Před 6 měsíci +32

    The industry needs more creators like you. Such an amazingly clear explanation of these concepts.

    • @Delba
      @Delba  Před 6 měsíci +2

      Appreciate you so 🙏

  • @christophercaldwell6641
    @christophercaldwell6641 Před 6 měsíci +24

    Next and Vercel should include this in their documentation. Incredibly helpful video, thank you!

  • @Yadiel458x
    @Yadiel458x Před 7 měsíci +23

    This is soooo good I feel like these videos should be included somewhere in the Next.js docs.

  • @liendwin
    @liendwin Před 6 měsíci +12

    I like how Next is also focusing on explaining their concepts themselves instead of throwing a bunch of features with a mediocre documentation, that's a good explanation, keep it up.

  • @Foused87
    @Foused87 Před 6 měsíci +6

    The best explanation video I've ever watched in my entire life.

    • @Delba
      @Delba  Před 6 měsíci

      lol, appreciate you saying so 🙏

  • @ammarhalees6370
    @ammarhalees6370 Před měsícem +1

    6 years in front-end, and I've never seen such a clear and detail explanatory vid! truly amazing work!

  • @govindpvenu
    @govindpvenu Před 15 hodinami

    This should be on Next.js home page. The visual quality is dope.
    Edit:Turns out they aleady have this in the docs :)

  • @saisreenivassonthena9901
    @saisreenivassonthena9901 Před měsícem

    I was making sure that, this wasn't an official @nextjs video! Its that smooth! Kudos to everyone behind it, or if its just you, you are GOD level in explaining concepts like this

  • @anil97
    @anil97 Před 6 měsíci +5

    This is one of the best presentation I've ever seen. Not gonna lie.

  • @SamSedighian
    @SamSedighian Před měsícem

    This has to be the best video explanation on the topic 👏🏼

  • @smithrockford-dv1nb
    @smithrockford-dv1nb Před 2 měsíci

    Wait, this is not a video from Vercel themselves? Wow, your speaking, animation, and video editing skills are top notch!

  • @nicholasprice5137
    @nicholasprice5137 Před 3 měsíci +1

    WOW. This is legit one of the best produced/explained/illustrated technical explanation videos I’ve ever seen. Wildly good.

    • @Delba
      @Delba  Před 3 měsíci +1

      Thank you, I appreciate it!

  • @pplytas
    @pplytas Před 6 měsíci +3

    This is the best explanation of the concept so far! The visuals and pace of the video are sooo on point. Thank you Delba.

    • @Delba
      @Delba  Před 6 měsíci

      Thank you, I appreciate it.

  • @tauhid97k
    @tauhid97k Před 6 měsíci +1

    This is such an an amazing explanation and visualization. Production quality is out of this world. You'll get more subscribers pretty quickly.

  • @stockmarketwizard9781
    @stockmarketwizard9781 Před 5 měsíci

    The pace of explanation, along with the visual matching what is being said and the quality of the explanation is top class. Very surprised to see subscribers under a million here. This channel will grow very fast if videos are created like this consistently

  • @moyezrabbani637
    @moyezrabbani637 Před 6 měsíci +2

    The amount of work put into producing this content and making these topics understandable is just commendable.
    Thanks Delba. You earned a sub.

    • @Delba
      @Delba  Před 6 měsíci

      Thank you! Welcome.

  • @tradfluteman
    @tradfluteman Před 6 měsíci +1

    This is the best explanation I have seen of these rendering models, by a lot, but I still think two misconceptions are possible, especially for people with self-hosted apps:
    1. You do *not* need the Edge or Vercel, or even a CDN, to take advantage of PPR. The Next Route Cache will serve your static assets.
    2. PPR is only about speed, not about cost. Users will see the cached static parts of your app first, but those parts will still eventually re-render on every request, so that the dynamic parts re-render also.
    Next cannot break your app apart, unless (maybe) you're using parallel routes, so it needs to run the whole "rendering engine" of your page just to get the dynamic outputs, with all the cost incurred.
    This means there are still big advantages to using pages that "partially render" with fully static content on the server and then complete the rendering, with personalized data fetching, on the client.
    Next even confusingly tries to force you to do data fetching with request-based data on the client, in layout components, for this exact reason. Otherwise all your pages would become dynamic, even if served with PPR.

    • @Delba
      @Delba  Před 6 měsíci

      Thank you!
      In general, this video is about the vision of Partial Prerendering that we're building towards, not about its behavior during alpha.

  • @XrVwxLF91Q
    @XrVwxLF91Q Před 7 měsíci +5

    Next-level clarity. Really enjoyed this video!

  • @vandhuymartins9481
    @vandhuymartins9481 Před 6 měsíci +1

    wow... the content, sound, animations, everything on this video is out of this world! Congratz Delba

    • @Delba
      @Delba  Před 6 měsíci

      Thank you!

  • @bluehawkfire55
    @bluehawkfire55 Před 4 měsíci

    These videos just sit well in my brain! Thank you!

    • @Delba
      @Delba  Před 4 měsíci

      Glad to hear it!

  • @MikeMansourTech
    @MikeMansourTech Před 6 měsíci

    This is the most amazing work I've ever seen in explaining concepts. This is literally raising the bars to the next level.

  • @deku_nattsu
    @deku_nattsu Před 6 měsíci +1

    I don't even use react or nextjs, i stayed for the great content quality, well done! I will definitely come back to this again once i start experimenting with the react ecosystem

    • @Delba
      @Delba  Před 6 měsíci

      Thank you! We'll be here :D

  • @greob
    @greob Před 6 měsíci +25

    The production value is so high, I don’t think this video could be any more perfect! Very nice work, superb presentation, very easy to understand! Thanks for sharing!

    • @Delba
      @Delba  Před 6 měsíci +2

      Appreciate the kind words 🙏

  • @bibartaks
    @bibartaks Před 7 měsíci +6

    Absolutely awesome! Please continue making more videos like this. Love it! 💗

  • @tomspatula616
    @tomspatula616 Před 5 měsíci

    Two minutes into the video, and I have immediately clicked the "like" and "subscribe" buttons! Please make more videos on Next.js!

    • @Delba
      @Delba  Před 5 měsíci

      Glad to hear it, welcome!

  • @MuhammadHaseebAhmed
    @MuhammadHaseebAhmed Před 6 měsíci +1

    ngl even Lee Robinson was not able to deliver concepts of PPR as you did . amazing !

    • @Delba
      @Delba  Před 6 měsíci +1

      We work together :P He gave feedback that made this better.

  • @filipniklas
    @filipniklas Před 6 měsíci +1

    This is a very well crafted presentation that adequately explains the concepts. On point, well paced and the visuals are sleek! Please do one for next.js caching next!

  • @Nightizm
    @Nightizm Před 6 měsíci +2

    Fantastic, thank you. Please more of these with the awesome visualizations+animations!

    • @Delba
      @Delba  Před 6 měsíci

      Thanks, I use Remotion.

  • @MyBrainForYou
    @MyBrainForYou Před 4 měsíci

    Never have I understood the concepts such beautifully. Found another great mentor. No Cap.

  • @trueberryless
    @trueberryless Před 6 měsíci +1

    This video quality is truly remarkable! ❤

  • @continuouslearner
    @continuouslearner Před 7 měsíci +3

    Holy God what did I just watch, this is amazing

  • @gauravr4127
    @gauravr4127 Před 6 měsíci

    Wow! Such a brilliant way to illustrate complex ideas and explain. Music + Illustration + Narration is perfect. I wish to see more from you and I'd love this to be on @nextjs official documents

    • @Delba
      @Delba  Před 6 měsíci

      Thank you! Working on it.

  • @hifzazafar9307
    @hifzazafar9307 Před 5 měsíci

    Such an amazingly clear explanation of these concepts. The best explanation video I've ever watched in my entire life. Please continue making more videos like this. Love it! 💗

    • @Delba
      @Delba  Před 5 měsíci

      Thank you!

  • @rafaelrcamargo
    @rafaelrcamargo Před 5 měsíci

    Coming back here for the 20th time, what an amazing explanation!

    • @Delba
      @Delba  Před 5 měsíci +1

      Haha, thanks!

  • @freenrg888
    @freenrg888 Před 3 měsíci

    The visuals are astonishing. Fantastic work, Delba.

    • @Delba
      @Delba  Před 3 měsíci

      Thank you!

  • @ignacior98
    @ignacior98 Před 6 měsíci

    Incredibly helpful explanation

    • @Delba
      @Delba  Před 6 měsíci

      Glad to hear it!

  • @DominikSipowicz
    @DominikSipowicz Před 7 měsíci +2

    This video explains Partial Prerendering really well. These animations are amazing!

    • @Delba
      @Delba  Před 6 měsíci

      Appreciate it Dom 🙏

  • @nicholaschu203
    @nicholaschu203 Před 4 měsíci

    Awesome presentation! Great animations, pace, and music!
    I feel like I just went through the whole evolution of web development from a tech-museum! It's THAT good!

  • @emilia1520
    @emilia1520 Před 4 měsíci

    This was so cool! Fantastic visualization and telling of web history! That's a sub for sure!

    • @Delba
      @Delba  Před 4 měsíci

      Thanks, welcome!

  • @CharlieKiloSierra8893
    @CharlieKiloSierra8893 Před 6 měsíci

    Great explanation together with the visual on what is actually happening and forgot about the actual coding but the concept of how it works you really explain it well. Thank you

    • @Delba
      @Delba  Před 6 měsíci

      Thank you!

  • @hankersoree
    @hankersoree Před 5 měsíci

    please upload more content. i love the way you explain ❤

  • @amanmavai99
    @amanmavai99 Před 5 měsíci

    wonderful way to explain complex concepts in easy to understand manner. easily one of the best tech videos I have every seen. thanks a lot for this amazing content.

  • @ZainRamzan-pt8cm
    @ZainRamzan-pt8cm Před 6 měsíci

    i have been working on multiple Next js project for last 2 years and i can say that this is one of the best thing next js team had ever done.
    Can u please make a video to do all of this pratically in code

  • @essawy897
    @essawy897 Před 6 měsíci

    5 seconds in and I'm already subscribed!
    Please do a video or write a post on how you create these animations with remotion!

    • @Delba
      @Delba  Před 6 měsíci

      Welcome!
      Perhaps in the future, working on next.js / react videos for a bit.

  • @codeChuck
    @codeChuck Před 6 měsíci

    It is funny how Theo explains the same concepts, but without animations! With visuals it is even better! Cool stuff! Keep up the quality! Thanks for video!

    • @Delba
      @Delba  Před 6 měsíci +2

      We tackle the same problems from different angles.

  • @drujas
    @drujas Před 6 měsíci

    Seria genial ver otros topicos de react y next explicados de esta forma. Una joya. Buen trabajo.

  • @ronrupp_
    @ronrupp_ Před 17 dny

    love those visuals!

  • @NarcisMM
    @NarcisMM Před 6 měsíci

    This was a great presentation

  • @haithamaleryani8279
    @haithamaleryani8279 Před 6 měsíci

    The BEST Tutorial I ever seen .

  • @taffoo
    @taffoo Před 2 měsíci

    Delba! Do you want to share how you do videos like this ?!?!? If I ever would make my own youtube videos they should either be of this quality or I better NOT DARE ever publish a video. Amazing presentation! Keep the videos coming, I subscribed! 🤩

  • @azizsafudin
    @azizsafudin Před 6 měsíci +1

    Brilliant content

  • @SumanthPagidipalli
    @SumanthPagidipalli Před 6 měsíci

    Quality of the video is top notch.
    Rowdy salute to @Delba

  • @jimmyj.6792
    @jimmyj.6792 Před 6 měsíci

    Wonderful video Delba, congrats for that. Explanations are so easy to understand.
    And the animation is totally fluid, wonderful. Absolutely love this content 😍
    Thank you so much 🙏

    • @Delba
      @Delba  Před 6 měsíci +1

      Thank you! Glad to hear it.

  • @xavimc9794
    @xavimc9794 Před 5 měsíci

    Very good explained, thanks for the video! New subscriber from spain!

    • @Delba
      @Delba  Před 5 měsíci

      Thank you. Welcome!

  • @anbarasu1997
    @anbarasu1997 Před 6 měsíci

    Beautifully explained. Animation is so intuitive. Keep it up!

  • @mdrakibul4052
    @mdrakibul4052 Před 5 měsíci

    thank you very much for excellent explanation 💗

  • @radosvet93
    @radosvet93 Před 4 měsíci

    Amazing explanation, and the graphics and animations are very well made, thanks

  • @markusfeljofsen8345
    @markusfeljofsen8345 Před 6 měsíci

    Very good explanation

  • @awksomeid6965
    @awksomeid6965 Před 6 měsíci

    instant like and subs. this is the best concept explaining video i've ever seen in my entire life and i am not event exaggerating it a bit. 10/10 keep up. waiting for the next videos.

    • @Delba
      @Delba  Před 6 měsíci

      Haha, thank you for the kind words. And welcome!

  • @48595157484812
    @48595157484812 Před 6 měsíci

    good pace, good visuals, thank you for the video

  • @Johnny-rf4iu
    @Johnny-rf4iu Před 6 měsíci

    Wow the explaination and visualization

  • @TheAkiller101
    @TheAkiller101 Před 6 měsíci

    absolutely love your style of explanation

  • @amirreza3638
    @amirreza3638 Před 6 měsíci

    Your content is great! Keep it up👌

  • @b3rking
    @b3rking Před 6 měsíci

    this what we call understading and knowing a subject! Great no the animation and explanation, soo.. im subscribing

    • @Delba
      @Delba  Před 6 měsíci

      Thank you. Welcome!

  • @VadimTi320
    @VadimTi320 Před 6 měsíci

    What’s great about next.js is that you don’t really need to know all of this for it to work, it’s just automatically prerenders what it can

  • @fauzanr..
    @fauzanr.. Před 6 měsíci

    the visualization is so good

  • @mcCorn6478
    @mcCorn6478 Před 6 měsíci

    Wow, you did an amazing job explaining this. Thank you

  • @pablofernandezruiz8024
    @pablofernandezruiz8024 Před 6 měsíci

    Thank you for doing God's work here! Your concept videos are astonishing, and the level of detail and finesse is immaculate. Please never stop delivering such high-value content! I adore you 😄

  • @bat-erdenekhashbat1205
    @bat-erdenekhashbat1205 Před 6 měsíci

    content quality is perfect. thanks

  • @KartikKaushik-n7q
    @KartikKaushik-n7q Před měsícem

    best explanation

  • @taiwojolomi
    @taiwojolomi Před 6 měsíci

    This is really nice... It was explain really well... Kudos Delba

    • @Delba
      @Delba  Před 6 měsíci

      Glad to hear it!

  • @Ayoubased
    @Ayoubased Před 6 měsíci

    Delba, do you ever find yourself caught between the desire to create more content and the temptation to spend extra time perfecting a single video because you know you're capable of producing something even better, yet still eager to produce more?

    • @Delba
      @Delba  Před 6 měsíci

      All. The. Time.

  • @sealuke2724
    @sealuke2724 Před 6 měsíci

    gorgeous content

  • @faraonch
    @faraonch Před 7 měsíci

    Keep going with your videos! You have a talent in explaining!

  • @rafishaik503
    @rafishaik503 Před 6 měsíci

    Wonderful explanation with beautiful slides. ❤

  •  Před 6 měsíci

    Amazing presentation, and very good featured.

  • @MilindMishra
    @MilindMishra Před 6 měsíci

    wow so amazing! kudos to the effort building this!

    • @Delba
      @Delba  Před 6 měsíci

      Thank you so much!

  • @81NARY
    @81NARY Před 6 měsíci +1

    Please do a video or write a post on how you create these animations with remotion!

  • @aaditya_ai
    @aaditya_ai Před 6 měsíci

    Keep em coming!
    Loving these type of videos 🎉❤

  • @stefan1397
    @stefan1397 Před 5 měsíci

    Excellent video! Very well made!

  • @AlwaysWeb
    @AlwaysWeb Před 6 měsíci

    💯💯💯 The best videos explaining nextjs

  • @uchennaofoma4624
    @uchennaofoma4624 Před 2 měsíci

    Amazing video

  • @nathanlazo814
    @nathanlazo814 Před 6 měsíci

    The best video I've ever seen!!!

  • @hectondomingos3264
    @hectondomingos3264 Před 6 měsíci

    Well made video.

  • @saifhesham3646
    @saifhesham3646 Před 2 měsíci

    Such awesome presentation, can you maybe do a tutorial on how do you make your presentations? also would be very grateful if you can provide the slides for this tutorial 🙏🏽

  • @juanferrer5885
    @juanferrer5885 Před 7 měsíci

    Thats an amazing explanation, great video!

  • @Edu4Dev
    @Edu4Dev Před 6 měsíci

    such nice hud n animations

  • @jatul28
    @jatul28 Před 7 měsíci

    Loved your videos and the visuals are amazing

  • @thefullstackproject
    @thefullstackproject Před 6 měsíci

    I wonder how you create these awsome visualizations. Great work!!

    • @Delba
      @Delba  Před 6 měsíci +1

      Thanks, I use Remotion.

    • @slyracoon23
      @slyracoon23 Před 6 měsíci

      Do you do any post editing software as well?

  • @gabrielbianchi2246
    @gabrielbianchi2246 Před 7 měsíci

    This world needs more Delbas and LeeRobs

  • @InternetThe
    @InternetThe Před 7 měsíci

    10/10 video, great job. Thanks!

  • @brunops_music
    @brunops_music Před 4 měsíci

    This is so good, obrigado!

  • @rawallon
    @rawallon Před 6 měsíci

    Excelente video, foi bem completo sem entrar em detalhes tecnicos, Vou mandar na minha empresa pra todos verem!

    • @Delba
      @Delba  Před 6 měsíci

      Obrigada, espero que ajude!

  • @manmandangdang
    @manmandangdang Před 6 měsíci

    That was fantastic! I hit subscribe right after watching it.

    • @Delba
      @Delba  Před 6 měsíci

      Thanks, welcome!

  • @jordinodejs3291
    @jordinodejs3291 Před 6 měsíci

    Great video! I’m curious about which tool you use to present information or graphic mockups. I love them. And how long could it take to make a video as yours?

    • @Delba
      @Delba  Před 6 měsíci

      Thanks, I use remotion.

  • @alexjohnson-bassworship3150
    @alexjohnson-bassworship3150 Před 6 měsíci

    Fantastic explanation!!

  • @dinesh28
    @dinesh28 Před 6 měsíci

    Great explanation and presentation. Subscribed.

    • @Delba
      @Delba  Před 6 měsíci

      Welcome 🙏

  • @horizondevs
    @horizondevs Před 6 měsíci

    amazing 👍

  • @Offiziersmesser
    @Offiziersmesser Před 6 měsíci

    Content so good I felt offended that I didn't subscribe 3 minutes in!

    • @Delba
      @Delba  Před 6 měsíci +1

      Hah, welcome!