大規模なOG画像の生成

大規模なog:imageの生成とは、大規模サイトのすべてのページ（何千ものブログ記事、商品、ドキュメントページ）に対して、自動的に一意で正確なソーシャルプレビュー（social preview）を作成することを意味します。FastOGは各画像をオンデマンドでレンダリングし（1レンダリング）、Cloudflareが同一URLを無期限にキャッシュするため、規模が拡大してもコストやセットアップ時間が増えることはありません。

スケール時のユニークな画像に関する問題

数千枚の1200×630画像を手作業で作成するのは現実的ではありません。ほとんどのチームはサイト全体で1つの汎用カードに頼ることになりますが、これは機会の損失です。実際のタイトルを含むページごとのカードは、より多くのシェアやクリックを獲得できるからです。解決策は、決定的なオンデマンドレンダリングです。画像はレンダリング時にページ自身のデータから生成されます。

FastOGがスケールする理由

核となる考え方は、コンテンツ署名付きキャッシュURLです。

1. レンダリング時にページタイトルとフィールドからURLに署名します（コンテンツの純粋関数）。
2. クローラーがURLを一度だけ取得します。FastOGはPNGをレンダリング（1回のレンダリング）し、エッジでキャッシュします。
3. その後、同じURLへのアクセスはすべてキャッシュから配信され、即座に応答し、レンダリング回数にカウントされません。

つまり、10,000件の異なるページは10,000回のレンダリングを一度だけ消費し、それ以降の無制限のシェアはコストがかかりません。

バッチ／体系的な展開

サイト全体にog:imageを展開するには、ビルド時または公開時に各ページのURLを生成します。

// Static generation — generateMetadata per route
export async function generateStaticParams() {
    return posts.map((p) => ({ slug: p.slug }));
}

export function generateMetadata({ params }) {
    const post = posts.find((p) => p.slug === params.slug);
    return {
        openGraph: {
            images: [generateOgImageUrl({
                template: "blog",
                title: post.title,
                subtitle: post.excerpt,
                author: post.author,
            })],
        },
    };
}

スケールを低コストに保つパターン

FAQ

1,000ページまたは10,000ページの料金はいくらですか？

ユニークな画像ごとに1回のレンダリングが発生します。10,000のユニークなページ＝10,000回のレンダリングが1回分となり、再共有は無制限で無料です。Dynamic APIプランの詳細は料金をご覧ください。

コンテンツが頻繁に変わるページはどうなりますか？

コンテンツが変更されるたびに新しいURLと新しいレンダリングが生成されます（クォータ1回分）。安定したページはキャッシュされたままです。

静的ビルド中にOG画像を生成できますか？

はい。多くのチームはビルド時または公開時（SSG）に画像URLを生成して保存しているため、初回共有時にコールドレンダリングが発生することはありません。

関連情報

• APIリファレンス
• SaaS向け動的OG画像
• 署名付きOG画像URL
• OG画像のキャッシュ方法