Refresh React Server Components

Поділитися
Вставка
  • Опубліковано 11 гру 2024

КОМЕНТАРІ • 38

  • @PhilippNowinski
    @PhilippNowinski 2 місяці тому

    Damn. Thanks for this video. I have been trying to wrap my head around almost the exact same problem for days now. This pattern opens up a lot of new opportunities. I am actually pumped now 😀
    Didn't see your channel before, but just left a sub. This one was dope. Thanks man, keep it up 👌

  • @VincentFulco
    @VincentFulco Рік тому +1

    Pure gold, thanks, i was debating digging in and turning off all cache until I found this.

  • @karsongrady
    @karsongrady Рік тому +1

    Thanks, Ryan. Its always refreshing the way you walk through code.

  • @mryechkin
    @mryechkin Рік тому +1

    Awesome! Love the pattern, thanks for sharing it.

  • @codinginflow
    @codinginflow Рік тому +3

    That's a very smart solution. At this point, would it make sense to just fetch the data in a client component using something like React-query or SWR?

  • @iangithinji1452
    @iangithinji1452 9 місяців тому

    Very super, the explanation and everything. I just became a subscriber

  • @rockNbrain
    @rockNbrain Рік тому

    Great job bro!

  • @waqasabi
    @waqasabi Рік тому +1

    Great video!

  • @jacobkim9856
    @jacobkim9856 Рік тому

    great video as always

  • @asimalqasmi7316
    @asimalqasmi7316 10 місяців тому

    🎉🎉🎉 Thanks a lot🎉🎉🎉

  • @janisbasisbasovsdev7147
    @janisbasisbasovsdev7147 10 місяців тому

    Nice video where you try to solve issue we had for over a year now. Your solutution works only in "DEV" and "BUILD" mode. But not in "PRODUCTION" if you deploy it to Vercel. Because your solution sometimes revalidates the path twice. Which doesn't matter for you because your posts are not changing that frequently. But if we say for example that the fetch returns random user EACH time. Then the double revalidation makes problems because now sometimes we can see the random user change twice.…

    • @RyanToronto
      @RyanToronto  10 місяців тому +1

      Yes, this method of checking should only be used for stable data (like post updated time). It will not work well if your data is random.

    • @janisbasisbasovsdev7147
      @janisbasisbasovsdev7147 10 місяців тому +1

      @@RyanToronto You know what? I was always workign on latest Nextjs version which was at this time was 14.1.0 but now i tried to install latest next canary: "next": "^14.1.1-canary.17" and activated PPR in "next.config.js" file. Now it seems to work! I dont know if it was the the latest canary version or activation of PPR that fixed this issue in PRODUCTION.

  • @marwanenouh1396
    @marwanenouh1396 8 місяців тому

    Thanks for the video, but won't this pattern add an extra requests? This means that every 1000 ms, we should fetch the blog and then check if it has been updated. Won't this affect server performance?

    • @RyanToronto
      @RyanToronto  8 місяців тому

      Great question! It really depends on your server, but my guess is most servers can handle running a database query every second without issue.
      That said everyone's server and traffic patterns are going to be different, so if you'd like I think you can change the interval to be every 10 seconds... or get rid of it all together and only recheck on focus. Really whatever pattern you use is up to you!

  • @PeterJanickovic
    @PeterJanickovic 2 місяці тому

    Very nice video, works, but i have a different problem i am facing, i have a dashboard, data are updated every 5 minute by a backend microservice, when this background process on the server finishes, it does call revalidate using webhook on the nextjs app. my problem is I am calling router.refresh() (lets say every minute), the pages does not refresh, its still using stale version,, and I am hopeless, i tried so many approches, obviusly, your works, but it triggers re-render server componnets by every user connected. thanks

    • @RyanToronto
      @RyanToronto  20 днів тому

      Hey sorry for the late rely. Are using revalidatePath in the webhook? I'd start there. The next caching is really tricky and hard to get right, especially for big apps.

    • @PeterJanickovic
      @PeterJanickovic 20 днів тому

      @@RyanToronto yes, I was, but i found a problem, my app was deployed on GCP and the default setting is to CACHE 1h .... so thats why it was all wiered.

    • @RyanToronto
      @RyanToronto  20 днів тому

      @@PeterJanickovic Ah that's good to know! Glad you got it fixed

  • @zunnoorainrafi5985
    @zunnoorainrafi5985 Рік тому

    Hi Ryan!
    What is your thoughts about Remix vs Nextjs?

    • @RyanToronto
      @RyanToronto  Рік тому

      Both Next.js and Remix are excellent frameworks, really you can build just about anything with either of them. If there's more details about the app you're trying to build I'd love to hear!

    • @zunnoorainrafi5985
      @zunnoorainrafi5985 Рік тому

      @@RyanToronto I don't have enough knowledge regarding these frameworks so I want to know that which framework is good for which specific type of application?
      It will be very informative for me if you tell me.

  • @Guillermo-bp4ze
    @Guillermo-bp4ze Рік тому

    Could this work for checking a user's session? With this, could I stop using the SWR library, right?

    • @RyanToronto
      @RyanToronto  Рік тому +1

      I've found since moving data fetching to server components I've had less of a need for client side data fetching libraries like SWR.

    • @Guillermo-bp4ze
      @Guillermo-bp4ze Рік тому

      @@RyanToronto Just to know, where would you place the component if it's responsible for checking the user's session? In the main layout or in every page.tsx?

    • @RyanToronto
      @RyanToronto  Рік тому +1

      Really up to you! depends when you want the refreshing to happen, on a specific page only or whenever a layout is rendered?

    • @Guillermo-bp4ze
      @Guillermo-bp4ze Рік тому

      @@RyanToronto Whenever a layout is rendered, it's a dashboard where all routes are protected by a user session

  • @lucaswong98
    @lucaswong98 Рік тому

    wouldn't this cause a lot of request? Let's say you have 1000 active users, that's 1000 request per interval time.

    • @RyanToronto
      @RyanToronto  Рік тому +2

      Great point! The thing I like about this pattern is that the app developer has full control over when to call `check()`. If your data is unlikely to change or if there are many active users then you don't need to call it every second. You could change it to only run every couple of hours or only when the window is focused.

    • @erikplachta
      @erikplachta Рік тому

      So awesome, thank you 🎉
      Was unsure how I was going to solve this problem on my projects.

  • @faruksardar8829
    @faruksardar8829 Рік тому

    Learn alit from You and Sam thank you🫡