Маркетинговые сайты на Верселе
Оптимизируйте изображения главных героев и CMS, сохраняя при этом хостинг App Router на Vercel.
← Вернуться к функциям
Особенность
Next.js Изображение CDN
Направьте next/image через Cache Rocket , дополнительно CDN `/_next/static` и прогревайте URL после каждого развертывания.
Cache Rocket for Next.js sits beside your existing host. Keep SSR and HTML on Vercel, Netlify, or Cloudflare Pages. Install @cacherocket/next to send next/image through img.cacherocket.com with automatic width, quality, and format transforms—and warm critical URLs when you ship.
Основные моменты
- Официальный пакет @cacherocket/next для next.config и next/image
- Преобразования по требованию, доставленные с img.cacherocket.com
- Soft-fail to the original image URL when over quota
- Deploy warming helpers for Vercel hooks and CI
- Free trial included — larger shared quotas on paid plans
Создайте образ CDN, не перемещая хост.
с CacheRocket оборачивает вашу конфигурацию Next.js и подключает собственный загрузчик изображений. Абсолютные изображения URL — или относительные/общедоступные пути, когда вы устанавливаете источник ресурса, — перезаписываются в преобразования URL на основе пути на img.cacherocket.com, чтобы Edge мог надежно кэшировать каждый размер и формат.
Hosting, SSR, and your existing Data Cache stay where they are. Cache Rocket only optimizes and delivers images, and can warm page URLs after deploy.
Warm as part of shipping
Deploys wipe edge and framework caches. Use onVercelDeploy() in a Route Handler, or call warm and purge from CI, so the first real visitor after a release does not pay the cold-start cost.
The same image-opt and CDN bandwidth meters power WordPress Managed CDN when you use both—so plan quotas stay predictable in one place.
Теплый в составе доставки
Развертывает кэши очистки Edge и Framework. Используйте onVercelDeploy() в обработчике маршрута или вызовите «теплый» и «очистку» из CI, чтобы первый реальный посетитель после выпуска не платил стоимость холодного запуска.
Одни и те же измерители пропускной способности image-opt и CDN обеспечивают мощность WordPress. Управляемый CDN используется при использовании обоих, поэтому квоты плана остаются предсказуемыми в одном месте.
Как это работает
- 1
Создать сайт Next.js
В Account → Next.js создайте сайт, скопируйте токен сайта и ключи API и установите список разрешенных хостов изображений.
- 2
Установите @cacherocket/следующий
Добавьте пакет, оберните next.config с помощью CacheRocket и установите переменные env на Vercel или локально.
- 3
Ship and warm
Use next/image as usual, then point a deploy webhook at onVercelDeploy() or your public warm webhook.
Где оно сияет
Headless storefronts
Allowlist Shopify or CMS image hosts and serve resized WebP/AVIF from Cache Rocket.
Команды с частыми развертываниями
Объедините образ CDN с потеплением после развертывания, чтобы выпуски никогда не встречали пользователей холодными маршрутами.
Часто задаваемые вопросы
- Это то же самое, что WordPress Управляемый CDN?
- No. Next.js uses img.cacherocket.com via @cacherocket/next. WordPress Managed CDN uses assets.cacherocket.com through the plugin. Both share monthly image-opt and CDN bandwidth quotas.
- Что произойдет, если я превышу квоту преобразования или пропускной способности?
- Новый Next.js преобразует программный сбой с перенаправлением на исходное изображение URL, поэтому страницы продолжают работать. Обновите подписку или дождитесь следующего расчетного периода, чтобы получить дополнительную квоту.
- Включает ли бесплатная версия Next.js?
- Yes. Free includes a trial of 25 image transforms and 1 GB image CDN bandwidth per month. Paid plans include larger shared allowances.
- Где инструкция по настройке?
- См. Документация → Next.js или откройте Account → Next.js для токенов сайта и фрагментов копирования и вставки.
Связанные функции
Все функцииГотовы попробовать это в своем аккаунте?
Создайте бесплатную учетную запись Cache Rocket, подтвердите имя хоста и включите эту возможность для своего сайта или API.