Vercel Flags、プラットフォーム組み込みの feature flags
Vercel Flags は、Vercel プラットフォームに組み込まれた feature flags である。デプロイと同一ダッシュボードでフラグを管理し、コードのマージと本番リリースを分離したいアプリ開発者向けである。2026年4月に一般提供となり、社内ではそれ以前から v0 などで運用されていた。
主な特徴は次のとおり。
- サーバー側評価: Flags SDK は既定でサーバー上でフラグを評価する。Next.js の React Server Components ではレンダー中に
awaitで読み取り、クライアント側の追加リクエストや表示のちらつきを避けられる。設定変更はミリ秒単位で各リージョンへ伝播する。 - コードとダッシュボードの自動同期: コードでフラグを定義してデプロイすると、ダッシュボードに draft として登録される。コードから削除すると unreferenced とマークされ、整理対象が分かる。
- Precompute: 静的ページを CDN 配信しつつフラグで振り分ける高度なパターン。ビルド時に全バリアントを生成し、Routing Middleware(Next.js では
proxy.ts)がユーザーごとに適切な静的ページへルーティングする。 - エージェント向け CLI:
vercel flagsで作成、ターゲティング、段階的ロールアウト、アーカイブをターミナルから操作できる。 - Flags Explorer: Vercel Toolbar に組み込まれ、ブラウザセッション内でフラグを上書きして検証できる。共有設定は変えず、再デプロイも不要である。
コードからは Flags SDK(オープンソース、プロバイダ非依存)で読み取る。Next.js と SvelteKit 向けアダプタが第一級で、他フレームワークは OpenFeature プロバイダ経由で利用できる。ターゲティングはユーザー属性、セグメント、環境ごとに設定し、段階的ロールアウトや kill switch も扱える。
全プランで利用可能である。v0 チームでは数百規模のフラグを常時運用し、新機能、AI モデルルーティング、本番 DB 移行の切り替えなどに使われている。
typescript
import { flag } from "flags/next"
import { vercelAdapter } from "@flags-sdk/vercel"
export const showNewFeature = flag({
key: "show-new-feature",
adapter: vercelAdapter()
})