iiinova — where your digital self keeps evolving

Sebastian Markbåge

@sebmarkbage.calyptus.eu

8.9K followers 24 following 70 posts

Formerly: React · Next.js · Vercel

Posts Replies Media

Sebastian Markbåge @sebmarkbage.calyptus.eu · 15/01/2025

Then click the little green Node.js logo in the Chrome DevTools to open the server.

080

Sebastian Markbåge @sebmarkbage.calyptus.eu · 13/12/2024

Now that the dust has settled on the funny naming of the experimental Taint APIs. Have you tried them? Did you find them useful? Did they help protect against any mistakes? react.dev/reference/re... react.dev/reference/re... en.wikipedia.org/wiki/Taint_c...

// next.config.js
module.exports = {
experimental: {
taint: true
}
}

7452

Sebastian Markbåge @sebmarkbage.calyptus.eu · 12/12/2024

Inspecting Server Components in React DevTools also works in development mode.

Screenshot of React DevTools showing RSC integration.

1230

Sebastian Markbåge @sebmarkbage.calyptus.eu · 12/12/2024

I'm working on built-in profiling of both Client and Server Components in Chrome DevTools Performance tab. Thanks to the new performance.measure() extensions. h/t Andrés Olivares This works in any RSC environment. In fact, this screenshot is running RSC for Parcel. h/t @devongovett.bsky.social

Screenshot showing the Chrome DevTools Performance tab with RSC integration.

318923

Sebastian Markbåge @sebmarkbage.calyptus.eu · 01/11/2024

Catch the gotcha? This cache entry is specific to only a specific user because it uses the current user to compute its output. It means the current user must be part of the cache key otherwise this cache entry could leak between users. "use cache" handles this automatically for closures.

export default async function Posts({ posts }) {
const user = await getUser((await cookies()).token)
const getPost = async (postID) => {
"use cache"
const post = await loadPost(postID)
return <div>
{post.title}
{post.author.id === user.id ? <Edit id={post.id} /> : ' by ' + post.author.name}
</div>
}
return posts.map(getPost)
}

51392

Sebastian Markbåge @sebmarkbage.calyptus.eu · 01/11/2024

Don't sleep on this. While we do have some static parameterization for storage location. We don't actually want dynamic parameterization in the cache directive. That would be too early. It should be able to parameterize it using the content of the function and only that. nextjs.org/blog/our-jou...

Since this API can be called after data loading, you can now use data to tag your cache entries.

2352