Frontend First

Playing with Server Components in Vercel’s Edge Runtime

Aug 22, 2022

51:28

Creator website

Highlights

AI Chapters

Episode notes

Is Your Data Base Globally Distributed?

01:37

Using Javascrip to Render a Theme

01:54

Is There a Preferable Light?

01:44

Introduction

3min

How to Write a Java Script to Render Before the Effect Fires

2min

Using Local Storage During Rendering of an Application?

2min

Using Javascrip to Render a Theme

2min

Is There a Preferable Light?

2min

Using a Value From Madoscope as a Seed Value?

2min

Block Java Script Before React Renders

2min

Is It a Madman Banner?

3min

Using Get Serverside Props in JavaScript Scripts

2min

10.

Getting Servercide Props for Rails, Is a Cold Start?

2min

11.

Is Your Data Base Globally Distributed?

2min

12.

You Could Have It, but It Wouldn't Change That

2min

13.

Redirecting in the Ap?

2min

14.

Is There a Way to Do That?

2min

15.

Are You Logging In? Or Logging Out?

3min

16.

So, You Haven't Reached for It in Work?

2min

17.

What's Happening on the Browser?

2min

18.

Is the Fallback a React Component?

2min

19.

Is It Running a React Component in React on the Client?

2min

20.

Exac - Isn't a Client Component?

2min

21.

Using the Edge Run Time, You Can Run Coat on the Server and It Will Send Down Up Dates

2min

22.

Using Aps on the Server, and Streaming Down Up Dates

2min

23.

Stack Overflow to Day

2min

24.

Streaming Server Components in the Edge Runtime

3min

25.

I'm Gonna Try to Do This, but It's Just a Little Cool.

3min

Ryan tells Sam about some experiments he’s been running using Server Components in Vercel’s new edge runtime. He talks about how components that suspend in the node runtime cause the static build of your Next.js app to wait until they unsuspend, while components that suspend in the edge runtime stream back fallback responses as data is being fetched. Ryan also tells Sam about a blocking JS trick he learned to alter the initial render of your clientside app based on client-specific data, like whether their theme preference is dark or light mode.

Topics include:

0:00 - Intro
1:00 - Running synchronous JS before React’s initial render of build-time generated HTML
17:03 - Using getServerSideProps on the edge in Next.js for run-time generated HTML
32:15 - Behavior of Server Components that suspend in edge runtime vs. node runtime

Links:

Remember Everything You Learn from Podcasts

Save insights instantly, chat with episodes, and build lasting knowledge - all powered by AI.