Un cliente me llamó un lunes por la mañana el año pasado. No un mensaje. Una llamada telefónica. Eso nunca es bueno. Había desplegado un sitio de marketing Next.js en el plan Pro de Vercel el jueves anterior, ejecutó un lanzamiento de producto durante el fin de semana, y se despertó con una factura de $340 en su bandeja de entrada. El sitio había funcionado brillantemente. El tráfico se disparó. Y Vercel había medido silenciosamente cada gigabyte de datos que salían de su red. No tenía un límite de gasto establecido. Ninguna alerta configurada. Nada.
Esa llamada es la razón por la que ahora paso veinte minutos en higiene de facturación de Vercel con cada cliente antes de desplegar cualquier cosa de grado de producción.
Aquí está lo que necesitas entender sobre cómo Vercel cobra por ancho de banda, por qué toma a la gente por sorpresa, y qué hacer realmente al respecto.
---
Qué "salida" realmente significa en Vercel
Egress es el datos transferido fuera de la red de Vercel hacia el usuario final. Cada imagen, cada bundle de JavaScript, cada respuesta de API, cada archivo de fuente. Si sale de su edge y llega a un navegador, cuenta.out of Vercel's network to the end user. Every image, every JavaScript bundle, every API response, every font file. If it leaves their edge and hits a browser, it counts.
En el plan Hobby obtienes 100GB de ancho de banda por mes, incluido. En Pro son 1TB. Suena como mucho. Pero aquí está el detalle: si estás sirviendo imágenes grandes, haciendo renderizado del lado del servidor en páginas con payloads JSON pesados, o tu app recibe un pico repentino de tráfico, puedes superar 1TB más rápido de lo que piensas. Vercel cobra $0.15 por GB de exceso en Pro según esto está escrito (siempre verifica su página de precios actual porque esto cambia).their current pricing page because this moves).
Entonces 500GB por encima de tu límite son $75. No es catastrófico. Pero un momento viral, una configuración de optimización de imágenes fallida, o un scraper martillando tus rutas de API? Eso puede ser miles.
Por Qué Sorprende a la Gente
Lo que pasa es que el desarrollo local no te da ninguna indicación. Construyes rápido, despliegas rápido, todo se siente bien. El dashboard de Vercel muestra uso de ancho de banda pero no te grita. Si no has configurado proactivamente una alerta de facturación, te enteras cuando llega la factura.
---
Las Configuraciones Más Propensas a Arruinar Tu Factura
He auditado muchos despliegues en Seahawk. Hay cuatro culpables que veo una y otra vez.
1. Imágenes No Optimizadas Omitiendo next/image
next/image es genuinamente bueno en lo que hace. Redimensiona, convierte a WebP, y cachea. Pero he visto proyectos donde desarrolladores estaban jalando imágenes directamente desde una etiqueta <img> apuntando a archivos en resolución completa en un bucket de S3, proxificados a través de una ruta de API de Vercel. Cada solicitud estaba jalando un JPEG de 4MB a través de la red de Vercel en lugar de un WebP de 200KB desde un edge de CDN. Multiplica eso por 50,000 vistas de página y haz las cuentas. is genuinely good at what it does. It resizes, converts to WebP, and caches. But I've seen projects where developers were pulling images straight from an <img> tag pointing at full-resolution files in an S3 bucket, proxied through a Vercel API route. Every request was pulling a 4MB JPEG through Vercel's network instead of a 200KB WebP from a CDN edge. Multiply that by 50,000 page views and do the maths.
Siempre usa next/image con una configuración de remotePatterns adecuada. Si la fuente de la imagen es externa, asegúrate de que esté golpeando el caché del CDN y no haciendo un viaje redondo a través de tus funciones sin servidor.next/image with a proper remotePatterns config. If the image source is external, make sure it's hitting the CDN cache and not making a round trip through your serverless functions.
2. Rutas API que devuelven payloads grandes
A principios de 2021 construí un catálogo de productos de comercio electrónico para un minorista del Reino Unido. Su ruta API estaba obteniendo un listado de productos de su base de datos y devolviendo el objeto completo, incluyendo campos que el front end nunca usaba. Descripciones, notas internas de SKU, metadata de variantes, todo. Cada respuesta tenía alrededor de 80KB en lugar de los 12KB que necesitaba.entire product object, including fields the front end never used. Description, internal SKU notes, variant metadata, the lot. Each response was around 80KB instead of the 12KB it needed to be.
Reduce tus respuestas API. Devuelve solo los campos que el cliente realmente consume. Si estás usando algo como Prisma, usa select para limitar qué extraes. Si estás usando una API de terceros, transforma y reduce el payload antes de enviarlo aguas abajo.select to limit what you pull. If you're using a third-party API, transform and slim the payload before sending it downstream.
3. ISR con ventanas de revalidación cortas en rutas de alto tráfico
Incremental Static Regeneration es brillante en teoría. En la práctica, si estableces revalidate: 30 en una página que recibe 10,000 hits por minuto, aún estás cacheando correctamente. Pero si lo estableces en revalidate: 1 porque querías actualizaciones casi en tiempo real y olvidaste cambiarlo... básicamente estás haciendo SSR con pasos extra y pagando por la salida en cada respuesta de caché casi fallida.revalidate: 30 on a page that gets 10,000 hits per minute, you're still caching correctly. But if you set it to revalidate: 1 because you wanted near-real-time updates and forgot to change it... you're basically doing SSR with extra steps and paying for the egress on every near-miss cache response.
Sé deliberado con tus ventanas de revalidación. La mayoría del contenido no necesita revalidarse cada segundo.
4. Funciones sin servidor sin encabezados de caché
Este es sutil. Si tu respuesta de función sin servidor no incluye un encabezado Cache-Control (o la combinación s-maxage / stale-while-revalidate de Vercel), la respuesta no se cachea en el edge. Cada solicitud golpea la función y viaja el viaje redondo completo. Pierdes el beneficio del CDN completamente y pagas salida en cada respuesta individual.Cache-Control header (or Vercel's s-maxage / stale-while-revalidate combo), the response is not cached at the edge. Every request hits the function and travels the full round trip. You lose the CDN benefit entirely and pay egress on every single response.
`` Cache-Control: s-maxage=3600, stale-while-revalidate=86400 `` Cache-Control: s-maxage=3600, stale-while-revalidate=86400 ``
Ese header por sí solo ha ahorrado dinero real a mis clientes. En serio. La documentación de caché de Vercel explica el comportamiento del header en detalle. Léela una vez como corresponde.Vercel's own caching docs explain the header behaviour in detail. Read them once properly.
---
Cómo configurar alertas de facturación (antes de necesitarlas)
Esto debería ser el paso uno antes de cualquier despliegue a producción. No el paso siete.
- Ve a la configuración de tu equipo en Vercel.
- En Billing, encuentra Spend Management.Billing , find Spend Management.
- Establece un límite de gasto (límite fijo, donde Vercel deja de servir solicitudes después del límite) o un umbral de notificación (alerta suave, te envía un correo cuando llegas a una cifra).spend limit (hard cap, where Vercel stops serving requests after the limit) or a notification threshold (soft alert, emails you when you hit a number).
- Recomendaría establecer una notificación en el 50% de lo que considerarías doloroso, y un límite fijo en aproximadamente 120% de tu factura mensual esperada.
El límite fijo es un arma de doble filo. Si lo alcanzas, tu sitio se cae. Así que piénsalo bien. ¿Para un sitio de marketing? Bien, límitalo fuerte. ¿Para un SaaS con usuarios pagos? Establece notificaciones generosas y vigila el dashboard en su lugar.
---
Trasladar lo Pesado a Otro Lugar
Vercel no es un CDN para activos estáticos. Bueno, tiene un CDN, pero pagas por gigabyte que sale de él. Para activos estáticos de alto volumen, ponlos en algún lugar más barato.
He estado enrutando archivos de medios grandes a través de Cloudflare R2 durante unos dieciocho meses. R2 no tiene cuotas de egreso. Pagas por almacenamiento y operaciones, no por los datos que salen. Para sitios con mucho contenido de imágenes esto es un ahorro serio. Un cliente mío ejecuta una plataforma de portafolio fotográfico y estaba pagando alrededor de $180/mes en egreso de Vercel. Movimos todas las imágenes en resolución completa y los activos de galería a R2, mantuvimos las miniaturas pasando por next/image, y la factura de Vercel bajó a menos de $40.Cloudflare R2 for about eighteen months now. R2 has zero egress fees. You pay for storage and operations, not for the data going out. For image-heavy sites this is a serious saving. A client of mine runs a photography portfolio platform and was paying around $180/month in Vercel egress. We moved all the full-res images and gallery assets to R2, kept the thumbnails going through next/image, and the Vercel bill dropped to under $40.
Alternativas que vale la pena conocer:
- Cloudflare Pages para despliegues estáticos donde no necesitas las características edge de Vercel. Nivel gratuito generoso, sin cuotas de egreso. for static deployments where you don't need Vercel's edge features. Generous free tier, no egress fees.
- AWS CloudFront en frente de S3 si ya estás en el ecosistema de AWS. Los costos de transferencia son más bajos que las tarifas de exceso de Vercel a escala. in front of S3 if you're already in the AWS ecosystem. Transfer costs are lower than Vercel's overage rates at scale.
- BunnyCDN es barato y rápido para entrega pura de activos. Lo he usado en un par de migraciones de WordPress a Next.js de alto tráfico donde el volumen de activos era grande. is cheap and fast for pure asset delivery. I've used it on a few high-traffic WordPress-to-Next.js migrations where the asset volume was large.
El punto es: Vercel es el lugar correcto para ejecutar tu lógica de aplicación Next.js. No siempre es el lugar correcto para servir tus gigabytes de medios.
---
Monitorear el Uso en Tiempo Real
No solo revises tu dashboard al final del mes. Así fue como mi cliente terminó llamándome un lunes.
Algunas cosas que realmente uso:
- Vercel Analytics te proporciona datos a nivel de página y es útil para identificar qué rutas generan más tráfico (y por lo tanto más egreso). gives you page-level data and is useful for spotting which routes are generating the most traffic (and therefore the most egress).
- Axiom se integra limpiamente con los log drains de Vercel y te permite consultar el tamaño de las solicitudes en el tiempo. Comencé a usarlo a finales de 2022 y ha sido útil en proyectos más grandes para correlacionar picos de tráfico con saltos de egreso. integrates cleanly with Vercel's log drains and lets you query request size over time. I started using it in late 2022 and it's been useful on bigger projects for correlating traffic spikes with egress jumps.
- Configura un cron simple (Vercel tiene soporte nativo de cron ahora) que consulte su API y publique en un canal de Slack cuando el ancho de banda cruza un umbral. Construí una versión ligera de esto para la infraestructura propia de Seahawk Media. Toma dos horas, ahorra mucha ansiedad.
La API REST de Vercel expone datos de despliegue y uso. No es la API más elegante del mundo pero hace lo que necesitas para alertas básicas.Vercel REST API exposes deployment and usage data. It's not the most elegant API in the world but it does what you need for basic alerting.
---
La Decisión de Arquitectura que Nadie Menciona
Aquí hay algo que no veo discutido lo suficiente: a veces Vercel no es la opción predeterminada correcta.
Si tu proyecto es un sitio de marketing estático sin funcionalidad dinámica real, no necesitas Vercel. Cloudflare Pages o el nivel gratuito de Netlify harán el trabajo sin ninguna preocupación de egreso. No estás "desperdiciando" Vercel, simplemente no tienes la herramienta correcta para la carga de trabajo.
Por el contrario, si estás construyendo una aplicación Next.js propia con middleware en edge, server components y rutas API que hagan trabajo real, Vercel vale la pena pagar. La experiencia de desarrollo es genuinamente excelente y la red edge es rápida. Solo arquitectúralo correctamente desde el inicio.
El error que cometí al inicio de mi carrera (alrededor de 2016, antes de que Vercel existiera, cuando estaba descubriendo cómo hacer deploy en Heroku y Netlify) fue tratar la plataforma de deployment como un detalle gratis y secundario. La elección de plataforma moldea tu perfil de costos tanto como la elección de base de datos. Tómalo en serio.
---
FAQ
¿El plan Hobby recibe cargos de salida si supero 100GB?
No. En el plan Hobby Vercel no cobra excedentes; desaceleran o suspenden el deployment una vez que alcanzas el límite. Tampoco es ideal de ninguna forma, pero no recibirás una factura sorpresa. Las facturas sorpresa suceden en Pro y Enterprise donde el uso se mide por encima de la cantidad incluida.
¿La optimización de imágenes de Vercel se cuenta en la salida de datos?
Sí. Las imágenes optimizadas servidas a través de next/image siguen contando como salida. El ahorro está en el tamaño del archivo: estás sirviendo un WebP de 180KB en lugar de un JPEG de 3MB, así que la salida por imagen es mucho menor. La optimización en sí es lo que reduce el costo, no alguna exención especial.next/image still count as egress. The saving is in file size: you're serving a 180KB WebP instead of a 3MB JPEG, so the egress per image is much lower. The optimisation itself is what reduces the cost, not some special exemption.
¿Puedo usar un CDN personalizado frente a Vercel para reducir la salida?
Puedes poner el proxy de Cloudflare frente a tu deployment de Vercel. Cloudflare cachea respuestas en su edge, lo que significa que las solicitudes que golpean el caché de Cloudflare nunca llegan a Vercel. Esto puede reducir significativamente tanto la salida como las invocaciones de función. Hay algunas salvedades con preview deployments y manejo de headers, pero para producción este es un enfoque común y legítimo. La documentación de Cloudflare sobre proxying cubre la configuración.Cloudflare's documentation on proxying covers the setup.
¿Cuál es la causa única más grande de facturas inesperadas en Vercel?
En mi experiencia: el manejo de imágenes. Ya sea imágenes en resolución completa siendo servidas sin optimización, o rutas de optimización de imágenes siendo llamadas en cada solicitud sin caché adecuado. Ordena tu pipeline de imágenes primero, todo lo demás segundo.
¿Vercel te notifica automáticamente si el uso aumenta?
No por defecto. Tienes que configurarlo. No hay una alerta lista para usar que diga "has usado el 80% de tu ancho de banda." Ese es el vacío. Configura tus umbrales de gestión de gastos el mismo día que configures tu despliegue de producción. No después.
---
Vercel es una gran plataforma. La uso, Seahawk la usa, y seguiré recomendándola para los proyectos correctos. Pero es un servicio medido ejecutándose en infraestructura real, y los precios reflejan eso. Los desarrolladores que resultan afectados por facturas sorpresa casi siempre son los que la trataron como un CDN gratuito y nunca miraron la configuración de facturación. Cinco minutos de configuración cuando despliegas te ahorrarán una llamada telefónica muy incómoda el lunes por la mañana.