OG-изображения в масштабе

Генерация og:image в масштабе означает автоматическое создание уникального и корректного превью для соцсетей для каждой страницы крупного сайта — тысяч постов в блоге, товаров или страниц документации. FastOG отрисовывает каждое изображение по запросу (1 рендер), а Cloudflare кэширует одинаковые URL навсегда, поэтому масштаб не увеличивает затраты или время настройки.

Проблема уникальных изображений в масштабе

Создавать вручную тысячи изображений размером 1200×630 невозможно. Большинство команд ограничиваются одной универсальной карточкой для всего сайта — это упущенная возможность, поскольку карточка для каждой страницы с реальным заголовком получает больше репостов и кликов. Решение — детерминированный рендеринг по запросу: изображение формируется на основе данных самой страницы в момент рендеринга.

Почему FastOG масштабируется

Ключевая идея — URL с подписью содержимого и кэшированием:

Вы подписываете URL на основе заголовка страницы и полей во время рендеринга (чистая функция от содержимого).
Краулер запрашивает URL один раз; FastOG рендерит PNG (1 рендер) и кэширует его на границе сети.
Каждый последующий запрос того же URL обслуживается из кэша — мгновенно и не учитывается.

Таким образом, 10 000 уникальных страниц учитываются как 10 000 рендеров один раз, а неограниченные пересылки ничего не стоят после этого.

Пакетное / систематическое развертывание

Чтобы развернуть og:image на всем сайте, генерируйте URL-адреса во время сборки или при публикации для каждой страницы:

tsx

// 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,
            })],
        },
    };
}

Паттерны, которые сохраняют масштабирование дешёвым

Паттерн	Почему это помогает
Подпись на этапе сборки/рендеринга	Детерминированные URL → общее кэширование
Переиспользование шаблона для каждого типа контента	Единый стиль бренда, меньше дизайнерских решений
Кэширование одинаковых URL	Повторные публикации не учитываются
Генерация при публикации, а не при каждом запросе	Исключает холодные рендеры при первом расшаривании

FAQ

Сколько стоят 1 000 или 10 000 страниц?

Один рендер на уникальное изображение. 10 000 уникальных страниц = 10 000 рендеров однократно; повторные пересылки ничего не стоят. См. цены для тарифов Dynamic API.

А как насчёт страниц, содержимое которых часто меняется?

Каждое изменение содержимого создаёт новый URL и новый рендер (1 единица квоты). Стабильные страницы остаются в кэше.

Можно ли генерировать OG-изображения во время статической сборки?

Да — многие команды генерируют и сохраняют URL изображения на этапе сборки/публикации (SSG), чтобы при первой пересылке не было холодного рендера.

Попробуйте бесплатно — регистрация не требуется

Предпросмотр и тестирование динамических OG-изображений за секунды.

Открыть бесплатный тестер OG-изображений

Тема