正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

❌ Avoid resolving a promise in a server component and block rendering. ✅ Resolve the promise in the client side with `Reac.use()`

George Moller

118,172 subscribers

47,215 次观看 • 1 年前 •via X (Twitter)

科学技术教育

Anya Rossi• Live Now

Private livecam show

10 条评论

George Moller 的头像

George Moller1 年前

I've been working professionally with React for more than 8 years and I compiled all my knowledge into 100+ infographics and 70+ video tutorials just like this one. Check them out ↓

React Universe Conf | Sept 2-4, 2025 的头像

React Universe Conf | Sept 2-4, 20251 年前

React Universe is a constantly evolving ecosystem—driving curiosity and continuous learning. And that's what we love about it! 🙌 Join us at React Universe Conf 2025 to future-proof your dev team:

pavi2410 的头像

pavi24101 年前

nextjs problems require nextjs solutions

Thibaud Dervily 的头像

Thibaud Dervily1 年前

I think this can impact SEO, am I wrong?

Ali Bey 的头像

Ali Bey1 年前

Doesn’t resolving a promise in RSC happen only at buildtime? So it will not block the rendering in this case.

Alfon 的头像

Alfon1 年前

typo, React.use()

Nicholas Ly 的头像

Nicholas Ly1 年前

Can't you just make `User` a server component and do the fetch there? You can still wrap `User` with Suspense and it'll function the exact same—no need for `React.use()`.

Josh 的头像

Josh1 年前

Why have the server component in this scenario? It seems entirely redundant

Javed 的头像

Javed1 年前

Why passing to the client when you can still make the fetch call on server and at the same time use suspense with it Just need to create a wrapper around the client components

Debo.dev 的头像

Debo.dev1 年前

How does this affect security?

相关视频

How to refactor an existing client component into a server component? 1. Move the state to the URL 2. Move data fetching to the server 3. Isolate interactivity into a smaller client component

How to refactor an existing client component into a server component? 1. Move the state to the URL 2. Move data fetching to the server 3. Isolate interactivity into a smaller client component

Alex Sidorenko

112,401 次观看 • 3 年前

🧵1/2 Socket Programming in C: Server-Side Basics - Set up a server using socket(), bind(), and listen(). - Accept client connections with accept(). - Send and receive data over TCP. Video 1: Server-Side in C! Video 2: Client-Side Programming will be uploaded soon—stay tuned! 🖥️

🧵1/2 Socket Programming in C: Server-Side Basics - Set up a server using socket(), bind(), and listen(). - Accept client connections with accept(). - Send and receive data over TCP. Video 1: Server-Side in C! Video 2: Client-Side Programming will be uploaded soon—stay tuned! 🖥️

trish

2,925,518 次观看 • 1 年前

In LiveView, we keep the state in one place - the server - and it simplifies a lot. But sometimes the state on the client is preferred, or even necessary, and we can't use LiveView for that part. Unless we have a LiveView that runs on the client 👀 Using Popcorn, we managed to run LiveView fully in the browser – here's a POC 🎉 The approach is to have a fully client-side LiveView rendered by a server-side one, and they can communicate with each other. Try it out:

In LiveView, we keep the state in one place - the server - and it simplifies a lot. But sometimes the state on the client is preferred, or even necessary, and we can't use LiveView for that part. Unless we have a LiveView that runs on the client 👀 Using Popcorn, we managed to run LiveView fully in the browser – here's a POC 🎉 The approach is to have a fully client-side LiveView rendered by a server-side one, and they can communicate with each other. Try it out:

Elixir by Software Mansion

13,537 次观看 • 8 个月前

The heroes of Honor of Kings are inviting you from all around the world! 🤩 On June 20th, let's fulfill a promise with the heroes and fight side by side in Hero's Gorge! #HonorOfKings

The heroes of Honor of Kings are inviting you from all around the world! 🤩 On June 20th, let's fulfill a promise with the heroes and fight side by side in Hero's Gorge! #HonorOfKings

Honor of Kings

128,191 次观看 • 2 年前

"How to share state between React client components with a parent server component?" 👇

"How to share state between React client components with a parent server component?" 👇

Alex Sidorenko

51,480 次观看 • 1 年前

Story Event [Yuji Itadori’s Promise] PV Revealed! Story Event "Yuji Itadori’s Promise" Coming Soon! This is an event where you can watch a limited storyline centered around Yuji Itadori and earn various in-game rewards. Progressing through the task will reward you with event-limited SSR Recollection Bits [Resolve in the Maelstrom].

Story Event [Yuji Itadori’s Promise] PV Revealed! Story Event "Yuji Itadori’s Promise" Coming Soon! This is an event where you can watch a limited storyline centered around Yuji Itadori and earn various in-game rewards. Progressing through the task will reward you with event-limited SSR Recollection Bits [Resolve in the Maelstrom].

Jujutsu Kaisen Phantom Parade Official

1,705,291 次观看 • 5 个月前

Returning education to the states is a promise to put students first and in Ohio, we’re seeing that promise take shape!

Returning education to the states is a promise to put students first and in Ohio, we’re seeing that promise take shape!

Secretary Linda McMahon

17,441 次观看 • 11 个月前

❌ Avoid difficult-to-read conditionals to render elements in react. ✅ Instead use utility components for conditional rendering.

❌ Avoid difficult-to-read conditionals to render elements in react. ✅ Instead use utility components for conditional rendering.

George Moller

301,135 次观看 • 3 年前

Server authoritative movement with client prediction and rollback/replay support. In this example, the client exploits by moving a wall out of the way. But the server owns the movement. The client has failed predictions due to the exploit, and rolls back. #RobloxDev

Server authoritative movement with client prediction and rollback/replay support. In this example, the client exploits by moving a wall out of the way. But the server owns the movement. The client has failed predictions due to the exploit, and rolls back. #RobloxDev

sleitnick

20,523 次观看 • 1 年前

So I made a promise to a couple of people in the Discord server for Yoyoyollie (WISHLIST DELIVERY MUST COMPLETE)'s #DeliveryMustComplete. The promise was that this weekend, I'd put a hat on a plane (long story) so here you go. Plane in a hat. #gamedev #indiedev #screenshotsaturday #NovaSquadron

So I made a promise to a couple of people in the Discord server for Yoyoyollie (WISHLIST DELIVERY MUST COMPLETE)'s #DeliveryMustComplete. The promise was that this weekend, I'd put a hat on a plane (long story) so here you go. Plane in a hat. #gamedev #indiedev #screenshotsaturday #NovaSquadron

Clara Gale ✈️ NS 0.4.1 out now!

12,303 次观看 • 10 个月前

New video showing off the Cloudflare Developers Agent Framework just landed showing off my favorite features: ✅ Synchronized Agent state and client-side ✅ SQL storage (sorry uncle bathrobe) ✅ Durable Execution of third party YouTube APIs ✅ Human in the Loop ✅ Client + Server RPC

New video showing off the Cloudflare Developers Agent Framework just landed showing off my favorite features: ✅ Synchronized Agent state and client-side ✅ SQL storage (sorry uncle bathrobe) ✅ Durable Execution of third party YouTube APIs ✅ Human in the Loop ✅ Client + Server RPC

Craig Dennis

25,157 次观看 • 1 年前

Been using a similar pattern for a long time in the Next.js, but now with the app router we can also add a loader function that's executed in a server component. (Thanks Ryan Florence for the inspiration) ✅ Infer/validate params/searchParams from Zod schema. ✅ Infer data

Been using a similar pattern for a long time in the Next.js, but now with the app router we can also add a loader function that's executed in a server component. (Thanks Ryan Florence for the inspiration) ✅ Infer/validate params/searchParams from Zod schema. ✅ Infer data

Eelco Wiersma

22,573 次观看 • 2 年前

Promise made ✅ Promise delivered ✅ As promised, the Modi government has stood firmly with students against paper leaks and exam fraud. With the passage of the Public Examinations (Prevention of Unfair Means) Amendment Bill, 2026, India has taken a decisive step towards a fair, transparent and credible examination system. ⬇️

Promise made ✅ Promise delivered ✅ As promised, the Modi government has stood firmly with students against paper leaks and exam fraud. With the passage of the Public Examinations (Prevention of Unfair Means) Amendment Bill, 2026, India has taken a decisive step towards a fair, transparent and credible examination system. ⬇️

BJP

134,858 次观看 • 1 个月前

Voter in Nevada: “I don't believe anymore in the Democrat Party because they promise and promise… and they never do anything.”

Voter in Nevada: “I don't believe anymore in the Democrat Party because they promise and promise… and they never do anything.”

America

104,756 次观看 • 1 年前

React tip: "use client" misconceptions (1/5) 🚫 You need to mark EVERY individual file with "use client" to ensure it is a Client Component. ✅ You only need to mark each client entry point ONCE. Modules imported into a "use client" file are already part of the client bundle. (0:05) Adding "use client" to `3.js` marks the file as a client entry point, including it in the client bundle. (0:11) Importing `d()` into `3.js` (a client entry point) also includes it in the client bundle. (0:14) Adding "use client" to `4.js` has no additional bundling effect on `d()` because it is already part of the client bundle. (0:23) All modules (and their dependencies) imported to `3.js` are included in the client bundle. (0:26) Removing "use client" from `3.js` moves it and its dependencies into the server bundle.

React tip: "use client" misconceptions (1/5) 🚫 You need to mark EVERY individual file with "use client" to ensure it is a Client Component. ✅ You only need to mark each client entry point ONCE. Modules imported into a "use client" file are already part of the client bundle. (0:05) Adding "use client" to `3.js` marks the file as a client entry point, including it in the client bundle. (0:11) Importing `d()` into `3.js` (a client entry point) also includes it in the client bundle. (0:14) Adding "use client" to `4.js` has no additional bundling effect on `d()` because it is already part of the client bundle. (0:23) All modules (and their dependencies) imported to `3.js` are included in the client bundle. (0:26) Removing "use client" from `3.js` moves it and its dependencies into the server bundle.

Delba

157,404 次观看 • 2 年前

You heard the man, a promise is a promise 🕺

You heard the man, a promise is a promise 🕺

RWBY

48,087 次观看 • 7 个月前