Vercel News
·
实现超低延迟且对转化率无影响的功能发布
内容提要
Beyond Menu是美国的一家热门食品外卖服务，他们采用了Hypertune和Vercel的Edge Config来解决无服务器环境中的功能标志和A/B测试挑战。他们的Next.js应用程序部署在Vercel上，每个月为数百万饥饿的访客提供服务。他们决定采用功能标志来逐步推出、即时回滚、A/B测试、基于主干的开发以及更容易的内部和与测试用户的协作。他们知道需要在服务器和客户端上评估功能标志和A/B测试。由于他们使用了App Router，所以解决方案需要与React Server Components、Client Components以及静态、动态和部分预渲染等不同的渲染模式一起工作。他们最终尝试了Hypertune，它非常适合他们的Next.js和Vercel设置。他们只需要安装一个在服务器和客户端上都可以工作的SDK，以便在Next.js应用程序的任何地方使用标志。他们可以在浏览器中从服务器上的SDK状态中恢复SDK，以便在第一个客户端渲染中使用标志，而不会出现布局移动或UI闪烁。SDK针对Vercel的Edge运行时进行了优化，可以在内存中评估标志逻辑，包括A/B测试，并公开了一种刷新标志逻辑的方法，他们在每个请求上调用该方法，并配置了缓存以仅在需要时获取更新。这最大限度地减少了延迟和带宽，提高了性能和效率。他们还使用Hypertune的Vercel集成将标志逻辑同步到Edge Config，这是Vercel的全局数据存
关键要点
-
Beyond Menu是一家美国的食品外卖服务，每月为数百万访客提供服务。
-
他们采用功能标志来实现逐步推出、即时回滚、A/B测试和更容易的协作。
-
解决方案需要在服务器和客户端上评估功能标志和A/B测试，并兼容不同的渲染模式。
-
传统的功能标志和A/B测试工具未能优化他们的Next.js和Vercel设置。
-
服务器无状态实例导致SDK初始化成为瓶颈，增加请求延迟。
-
浏览器中的传统工具导致布局移动和UI闪烁，影响用户体验。
-
Beyond Menu最终选择了Hypertune，适合他们的Next.js和Vercel设置。
-
只需安装一个SDK即可在服务器和客户端使用功能标志，避免布局移动和UI闪烁。
-
SDK针对无服务器和边缘环境进行了优化，能够在内存中评估标志逻辑。
-
Hypertune的Vercel集成将标志逻辑同步到Edge Config，提供超低延迟的读取。
-
Hypertune允许定义灵活的功能标志和直接嵌入A/B测试，简化管理。
-
可以定义自定义输入类型以便于标志目标设置。
-
使用npx hypertune生成类型安全的客户端，确保编译时错误检查。
-
所有标志更改都有版本控制，便于查看历史更改和进行分支测试。
-
Beyond Menu能够安全可靠地推出和A/B测试新功能，且不影响应用性能。
-
未来计划使用Edge Config和Hypertune管理更复杂的应用配置和产品分析。
延伸问答
Beyond Menu是如何解决功能标志和A/B测试的挑战的？
Beyond Menu通过采用Hypertune和Vercel的Edge Config来解决功能标志和A/B测试的挑战，确保在无服务器环境中实现超低延迟和高效性能。
Hypertune的SDK如何优化Beyond Menu的应用性能？
Hypertune的SDK在服务器和客户端上都能工作，优化了标志逻辑的评估，减少了延迟和带宽，提高了性能和效率。
使用Hypertune后，Beyond Menu在功能发布上有哪些优势？
使用Hypertune后，Beyond Menu能够安全可靠地推出和A/B测试新功能，且不影响应用性能和用户体验。
Hypertune如何支持灵活的功能标志定义？
Hypertune允许用户定义灵活的功能标志和直接嵌入A/B测试，支持自定义输入类型以便于标志目标设置。
Beyond Menu在使用Hypertune时如何管理标志更改？
所有标志更改都有版本控制，便于查看历史更改和进行分支测试，确保安全可靠的功能发布。
Beyond Menu未来计划如何使用Hypertune和Edge Config？
Beyond Menu计划使用Hypertune和Edge Config管理更复杂的应用配置和产品分析，优化关键部分的漏斗。
