Cloudflare推出了Vinext 1.0。这是一款开源框架,支持在Vite之上运行Next.js应用,并可将其部署到Cloudflare Workers、Netlify和AWS Lambda等平台。该项目面向新应用和现有项目,包括使用Pages Router或App Router的项目,而不是将支持限制在较新的Next.js架构上。
与Next.js应用的更广泛兼容性
Vinext从2月发布时为期一周的人工智能驱动实验,发展为Cloudflare称已用于高流量动态应用生产环境的框架。该公司表示,Vinext与客户所要求的大多数功能的兼容性超过99%,同时仍在测试应用的实际行为,而不仅仅是模拟具有相同名称的API。
该版本支持App Router和Pages Router两种路由,以及混合应用、React服务器组件、服务器操作、API路由、路由处理程序、中间件和客户端导航。它还覆盖服务器端页面渲染、增量静态再生成(ISR)、导出为静态资源,以及后台或按需重新验证。
实际会发生什么变化?
Vinext统一了两种路由和受支持运行环境之间的缓存功能,并额外支持Workers Cache。它还提供与Next.js兼容的追踪功能,从而可以继续使用现有的OpenTelemetry和Sentry配置;在Cloudflare Workers上,它还集成了Workers原生监控工具。
该版本增加了对开发和生产环境中workerd的直接支持,并可访问Cloudflare的相关功能,例如图像优化和Hyperdrive。另一方面,与Cache Components相关的use cache指令支持仍然有限;Cloudflare表示,目前的优先事项是应用在生产环境中依赖的框架核心功能。
上线前预热缓存
Vinext 1.0提供了在构建过程中为App Router和Pages Router预先渲染页面的机制,随后通过ISR提供这些页面,并根据路径或标签使其失效。不过,它还为包含数万或数十万个URL的应用增加了另一种选择:将部分预渲染工作从构建机器转移到Cloudflare网络。
cache warming功能使用Next.js常用的指标来确定需要准备的页面,也可以识别流量较高的页面。在将新版本切换到生产流量之前,Cloudflare会以百分之零的流量比例部署一个Worker版本,然后从该版本请求页面以填充缓存;流程完成后即可提升部署比例。这减少了为低访问量页面进行串行构建时的等待时间,但使用该功能时,实际上需要部署到Cloudflare。
测试与迁移路径
Cloudflare表示,该项目依赖数千项测试,覆盖框架行为、开发和生产模式下的服务器,以及Node.js和Cloudflare Workers部署目标。此外,Vinext每晚都会运行Next.js完整测试套件,以监测上游变更造成的回归。迁移流程包括两个命令,用于检查项目兼容性、配置Vite和设置部署,同时保留原有的Next.js项目结构:npx vinext check,然后是npx vinext init。
Vinext可用于新项目和现有项目,并可使用npx @vinext/cloudflare deploy --warm-cache命令将其部署到支持缓存预热的Cloudflare Workers。兼容性矩阵以及Cache Components等尚未完整支持的功能,仍是团队在复杂应用中采用迁移方案前需要审查的事项。