Next.js 缓存机制大变动：从默认缓存到 "use cache"

服务端渲染（SSR）最让人头疼的就是那个加载状态（Loading state），但 Next.js 最近在追求 SPA 那种丝滑感上走得挺激进。最核心的转变在于缓存逻辑的翻转：现在数据默认是动态的，得手动通过 "use cache" 来决定缓存哪些部分。

这种设计其实解决了之前那种“不知道数据到底什么时候更新”的玄学问题。配合 Suspense 这种流式传输，可以让页面部分区域秒开，而慢的部分异步加载，体验上非常接近单页应用。

在实操中，可以通过以下几个维度控制缓存精度：

• 局部缓存： 在组件级别使用 "use cache" 指令。
• 有效期控制： 利用 cacheLife 设定具体的缓存生存时间。
• 精准失效： 通过 cacheTag 给缓存打标签，需要更新时定向清除。

另外，对于追求极致开发体验的强迫症，推荐尝试一个叫 rsc-boundary 的工具，它能直接在页面上可视化显示 Server Component 和 Client Component 的边界，不用再靠猜来判断哪里触发了客户端渲染。

如果你在配置 TypeScript 7 的预览支持，记得在 next.config.js 里开启这个实验性选项，否则 next build 可能会在类型检查阶段卡住：

module.exports = {
  experimental: {
    useTypeScriptCli: true,
  },
}

至于具体的部署和性能优化，建议重点研究 Partial Prefetching，这玩意儿是减少页面跳转白屏的关键。