profile

Ankita Kulkarni

🍿 3 New Flavours of Caching You Didn’t Know Existed in Next.js 16

Published 23 days ago • 2 min read

Hey Reader,

I had the incredible opportunity to speak at the official Next.js Conf!. It’s been 2.5 years since I went full-time as a Tech Educator, and this moment truly feels like a milestone.

In my talk, I share how I built a custom course platform using Next.js (the same one that powers Modern Full Stack Next.js Course) along with the lessons and challenges I faced along the way.

If you'd like, you can watch the talk here!

Weekly Snack: Caching Patterns for Dynamic Components in Next.js 🍿

Next.js 16 just dropped and it completely changed how we fetch data with Cache Components.

The new "use cache" directive can be used at the top of your pages, components, or functions to cache data automatically like we covered here.

But here’s the catch 👀, you can’t use "use cache"everywhere.

And that’s why it comes in three flavours:

→ use cache: allows you to mark a route, React component, or a function as cacheable
→ use cache: private: allows you to use runtime APIs like cookies, headers, or search params and cache them
→ use cache: remote: enables caching of shared data in dynamic contexts

Today, let’s walk through how we can cache a dynamic function like getRecommendations() which depends on cookies 🍪 and see which caching directive makes sense here.

(I’ll cover “use cache:remote” next week!)

🌀 PS: I tried something new this time - added animated GIFs to visualize caching in action! Do you like them? Click below and tell me what you think 👇

🔥 Love it!

😐 No

🎁 Want to level up your Next.js skills the fun way?

Check out the Next.js Hot Tips Course - a free mini course with 10 quick lessons you can complete in just 5 minutes a day.

You’ll learn caching, routing, security, Server Actions, and performance tips all through bite-sized, visual lessons.

✨ Bonus: You’ll also get free access to my interactive Next.js Course Platform + a downloadable guide with all 10 tips.

this magical button will automatically
enrol you in the course!

🚀 Latest Frontend News

Next.js 16 is out and it’s a game-changer:

  • Cache Components - new data fetching model
  • Turbopack is now the default
  • File System Caching for faster dev
  • Adapters API (alpha) for deploying Next.js anywhere

🎁 Download a Free Next.js 16 Cheatsheet

Everyone’s joking about the new "use cache" directive but Vercel wrote an amazing post on it eexplaining why it exists and the design tradeoffs they explored (like "use workflow").

"use workflow" a new directive that can suspend, resume, and maintain state with ease.

A simple but useful playground for React

Nuqs - a State manager for your URL crossed 1M downloads 🎉

SolidJS crossed 1 million downloads a week! 🎉🚀

ArcRegex is a drop in replacement for new RegExp() with types

Shadcn published the Registry Directory: a list of code registries you can browse and pull code and components from.

We now have Bun runtime on Vercel Functions

What do you think of today's Newsletter? Simply click on one of the links below.

🔥 Love it!

😐 It’s okay

👎 Not good

​
All past newsletters can be found here.

You can email me at me@kulkarniankita.com to advertise/sponsor the newsletter.

For those curious, I write all my emails using Convertkit.

Ankita Kulkarni

Educator | Developer | Leader

Join 9200+ subscribers reading by weekly personalized Newsletter that helps developers level up their skills through weekly Frontend and Leadership Snacks. You get a deep dive into a Tech topic, Actionable tips to excel in your career and a toolbox!

Read more from Ankita Kulkarni
Next.js 16 Cheatsheet

Hey Reader, Last week I told you I was about to drop something big… Well, today’s the day. 🎉 I’ve been building something to finally clear the fog around Next.js 16 - all the new caching rules, data-fetching patterns, rendering behaviors, and how Server Components actually work in real apps. Introducing your Next.js 16 Cheatsheet + Free 3-Part Mini-Course 💫 👉 Click here to get it (free) The moment you download it, you’ll unlock a short email course that starts tomorrow. It’s designed to help...

3 days ago • 1 min read
use cache:remote

Hey Reader, I’ve been heads-down the last few months, building something special 🤫. It’s for every developer who’s ever felt like Next.js changes faster than they can keep up. Different caching rules. New folders. New ways to fetch data. If that sounds familiar… this one’s for you. Next week, I’m dropping something big, something that’ll help you finally understand how all the new pieces in Next.js 16 fit together. No hype, no fluff - just the clarity you’ve been looking for. Make sure you...

9 days ago • 2 min read
React 19.2 Activity

Hey Reader, I’ve been diving deep into React 19.2 and Next.js 16 Beta this week, and honestly, it’s such a solid update. I have started to incorporate so many of the features in my Next.js Custom Course Platform and have seen massive improvements. But before we jump into this week’s snack, let’s hear it from our sponsor. 👇 But before that, let's hear it from our Sponsor. PRESENTED BY CODERABBIT AI Most AI test tools just throw random assertions at your code and call it “coverage.” But they...

about 1 month ago • 2 min read