vercel/next.js
6 articles
前置知识
- ›具备作为应用开发者使用 Next.js 的基本经验
- ›对 monorepo 结构和包管理器有基本了解
- ›了解服务端渲染与客户端渲染的区别
01
Next.js 代码库架构:全局地图
对 Next.js monorepo 的高层概览,涵盖工作区布局、核心包结构、执行上下文、路由范式、打包策略与配置系统。
02
从 `next dev` 到首次响应:服务器启动与请求处理管道
完整追踪从 `next dev` CLI 到分层服务器架构的启动流程,并跟随单个 HTTP 请求经历路由解析、中间件处理和分发的全过程。
03
深入 App Router 渲染引擎:RSC、流式传输与 PPR
深度解析 app-render.tsx——App Router 渲染的核心所在。涵盖 RSC Flight payload、HTML 流式传输、AsyncLocalStorage 存储以及部分预渲染(PPR)机制。
04
客户端路由器:导航、缓存与状态管理
深入探讨 App Router 的浏览器端实现——一个基于 reducer 的状态机,负责管理导航流程、RSC payload 的应用、布局保持以及 PPR segment 缓存。
05
构建流水线:webpack 配置、代码生成与三编译器架构
深入解析 `next build` 如何将源代码转化为生产产物——从入口点发现、代码生成、Webpack 配置,到最终的 manifest 输出。
06
深入缓存机制:ISR、响应缓存、缓存处理器与 `use cache` 指令
全面解析横跨服务端与客户端的多层缓存架构——包括响应缓存、增量缓存、`use cache` 的 CacheHandler 接口、基于标签的重新验证,以及 PPR 缓存。