Um cliente me ligou numa manhã de segunda-feira no ano passado. Não uma mensagem. Uma ligação telefônica. Isso nunca é bom. Ele tinha deployado um site de marketing Next.js no plano Pro da Vercel na quinta-feira anterior, rodou um lançamento de produto durante o fim de semana, e acordou com uma fatura de $340 sentada na sua caixa de entrada. O site tinha ido brilhantemente bem. O tráfego disparou. E a Vercel tinha silenciosamente medido cada gigabyte de dados saindo da sua rede. Ele não tinha nenhum limite de gasto configurado. Nenhum alerta ativado. Nada.
Aquela ligação é a razão pela qual agora gasto vinte minutos em higiene de cobrança da Vercel com cada cliente antes de fazermos deploy de qualquer coisa em nível de produção.
Aqui está o que você precisa entender sobre como a Vercel cobra por largura de banda, por que isso pega pessoas desprevenidas, e o que realmente fazer a respeito.
---
O Que "Egresso" Realmente Significa na Vercel
Egress é dados transferidos para fora da rede Vercel até o usuário final. Cada imagem, cada bundle JavaScript, cada resposta de API, cada arquivo de fonte. Se sair da edge deles e chegar a um navegador, conta.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.
No plano Hobby você ganha 100GB de largura de banda por mês, incluído. No Pro é 1TB. Parece bastante. Mas aqui está a coisa: se você estiver servindo imagens grandes, fazendo renderização no servidor em páginas com payloads JSON pesados, ou sua app sofre um pico súbito de tráfego, você pode estourar 1TB mais rápido do que pensa. Vercel cobra $0,15 por GB de excedente no Pro no momento desta escrita (sempre verifique a página de preços atual deles porque isso muda).their current pricing page because this moves).
Então 500GB acima do seu limite são $75. Não é catastrófico. Mas um momento viral, uma configuração de otimização de imagem malsucedida, ou um scraper martelando suas rotas de API? Isso pode ser milhares.
Por Que Pega as Pessoas de Surpresa
A coisa é, desenvolvimento local não dá zero indicação. Você constrói rápido, deploya rápido, tudo parece fine. O dashboard Vercel mostra uso de largura de banda mas não grita para você. Se você não tiver configurado proativamente um alerta de cobrança, você descobre quando a fatura chega.
---
As Configurações Mais Prováveis de Arruinar Sua Conta
Auditei muitos deployments na Seahawk. Há quatro culpados que vejo uma e outra vez.
1. Imagens Não Otimizadas Pulando next/image
next/image é genuinamente bom no que faz. Redimensiona, converte para WebP, e cacheia. Mas vi projetos onde desenvolvedores estavam puxando imagens direto de uma tag <img> apontando para arquivos em resolução completa em um bucket S3, proxiados através de uma rota de API Vercel. Cada requisição estava puxando um JPEG de 4MB através da rede Vercel em vez de um WebP de 200KB de uma edge de CDN. Multiplique isso por 50.000 visualizações de página e faça as contas. 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.
Sempre use next/image com uma remotePatterns config apropriada. Se a fonte da imagem for externa, certifique-se de que está atingindo o cache do CDN e não fazendo uma viagem de ida e volta através de suas funções serverless.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. API Routes Que Retornam Payloads Grandes
Em 2021 construí um catálogo de produtos de e-commerce para um varejista do Reino Unido. Sua API route estava buscando uma listagem de produtos do banco de dados e retornando o objeto de produto inteiro, incluindo campos que o front end nunca usava. Descrição, notas internas de SKU, metadados de variantes, tudo. Cada resposta tinha cerca de 80KB em vez dos 12KB que realmente precisava.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.
Reduza suas respostas de API. Retorne apenas os campos que o cliente realmente consome. Se você estiver usando algo como Prisma, use select para limitar o que você puxa. Se você estiver usando uma API de terceiros, transforme e reduza o payload antes de enviá-lo downstream.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 Com Janelas de Revalidação Curtas em Routes de Alto Tráfego
Incremental Static Regeneration é brilhante em teoria. Na prática, se você definir revalidate: 30 em uma página que recebe 10.000 hits por minuto, você ainda está cacheando corretamente. Mas se você definir para revalidate: 1 porque queria atualizações quase em tempo real e esqueceu de mudar... você está basicamente fazendo SSR com passos extras e pagando pela egress em cada resposta de cache quase perdida.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.
Seja deliberado sobre suas janelas de revalidação. A maioria do conteúdo não precisa revalidar a cada segundo.
4. Serverless Functions Sem Cache Headers
Este é sutil. Se sua resposta de função serverless não incluir um header Cache-Control (ou a combinação s-maxage / stale-while-revalidate do Vercel), a resposta não é cacheada na edge. Cada requisição atinge a função e viaja a viagem completa de ida e volta. Você perde completamente o benefício do CDN e paga egress em cada resposta.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 ``
Só esse header já economizou dinheiro real para clientes. Sério mesmo. A própria documentação de caching do Vercel explica o comportamento do header em detalhes. Leia uma vez direito.Vercel's own caching docs explain the header behaviour in detail. Read them once properly.
---
Como Configurar Alertas de Faturamento (Antes de Precisar Deles)
Isso deveria ser o passo um antes de qualquer deploy em produção. Não o passo sete.
- Vá para as configurações de time do seu Vercel.
- Em Billing , encontre Spend Management.Billing , find Spend Management.
- Defina um limite de gastos (hard cap, onde o Vercel para de servir requisições após o limite) ou um limiar de notificação (soft alert, envia email quando você atinge um número).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).
- Recomendo definir uma notificação em 50% do que você consideraria doloroso, e um hard limit em cerca de 120% da sua fatura mensal esperada.
O hard cap é uma faca de dois gumes. Se você atingir, seu site cai. Então pense bem. Para um site de marketing? Tudo bem, cap firme. Para um SaaS com usuários pagos? Defina notificações generosas e monitore o dashboard em vez disso.
---
Descarregando o Trabalho Pesado Para Outro Lugar
Vercel não é um CDN para ativos estáticos. Quer dizer, tem um CDN, mas você paga por gigabyte de saída. Para ativos estáticos em alto volume, coloque-os em um lugar mais barato.
Venho roteando arquivos de mídia grandes através do Cloudflare R2 há cerca de dezoito meses. R2 não tem taxas de saída. Você paga por armazenamento e operações, não pelos dados saindo. Para sites com muitas imagens, essa é uma economia séria. Um cliente meu executa uma plataforma de portfólio fotográfico e estava pagando cerca de $180/mês em saída do Vercel. Movemos todas as imagens em resolução completa e ativos de galeria para R2, mantivemos as miniaturas passando por next/image, e a conta do Vercel caiu para 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 valem a pena conhecer:
- Cloudflare Pages para implantações estáticas onde você não precisa dos recursos de edge do Vercel. Nível gratuito generoso, sem taxas de saída. for static deployments where you don't need Vercel's edge features. Generous free tier, no egress fees.
- AWS CloudFront na frente do S3 se você já está no ecossistema da AWS. Os custos de transferência são menores do que as taxas de excedente do Vercel em 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 é barato e rápido para entrega pura de ativos. Já usei em algumas migrações de alto tráfego de WordPress para Next.js onde o volume de ativos 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.
O ponto é: Vercel é o lugar certo para executar a lógica da sua aplicação Next.js. Nem sempre é o lugar certo para servir seus gigabytes de mídia.
---
Monitorando Uso em Tempo Real
Não fique apenas verificando seu dashboard no final do mês. Foi assim que meu cliente acabou me ligando numa segunda-feira.
Algumas coisas que eu realmente uso:
- Vercel Analytics oferece dados no nível da página e é útil para identificar quais rotas estão gerando mais tráfego (e portanto mais egress). 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 perfeitamente aos log drains do Vercel e permite consultar o tamanho das requisições ao longo do tempo. Comecei a usar em finais de 2022 e tem sido útil em projetos maiores para correlacionar picos de tráfego com saltos de egress. 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.
- Configure um simples cron (Vercel tem suporte nativo a cron agora) que bate na API deles e posta em um canal do Slack quando a largura de banda ultrapassa um limite. Construí uma versão leve disso para a infraestrutura da Seahawk. Leva duas horas, economiza muita ansiedade.
A REST API do Vercel expõe dados de deployment e uso. Não é a API mais elegante do mundo mas faz o que você precisa para alertas básicos.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.
---
A Decisão de Arquitetura que Ninguém Comenta
Aqui está algo que não vejo sendo discutido o suficiente: às vezes Vercel é o padrão errado.
Se seu projeto é um site de marketing estático sem funcionalidade dinâmica real, você não precisa de Vercel. Cloudflare Pages ou a camada gratuita do Netlify farão o trabalho sem preocupações com egress. Você não está "desperdiçando" Vercel, você simplesmente não está na ferramenta certa para a carga de trabalho.
Inversamente, se você está construindo uma aplicação Next.js adequada com edge middleware, server components e API routes fazendo trabalho real, Vercel vale a pena pagar. A DX é genuinamente excelente e a rede edge é rápida. Apenas arquitete isso corretamente desde o início.
O erro que cometi no início da minha carreira (por volta de 2016, antes de Vercel sequer existir, quando eu estava descobrindo deployment no Heroku e Netlify) foi tratar a plataforma de deployment como uma coisa gratuita e sem importância. A escolha da plataforma molda seu perfil de custo tanto quanto a escolha do banco de dados. Leve isso a sério.
---
FAQ
O plano Hobby tem cobranças de egress se eu ultrapassar 100GB?
Não. No plano Hobby, Vercel não cobra pelo excedente; eles reduzem a velocidade ou suspendem o deployment assim que você atinge o limite. Não é ótimo de qualquer forma, mas você não receberá uma fatura surpresa. As faturas surpresa acontecem no Pro e Enterprise, onde o uso é medido acima do valor incluído.
A otimização de imagens do Vercel é contabilizada no egress?
Sim. Imagens otimizadas servidas através de next/image ainda contam como egress. A economia está no tamanho do arquivo: você está servindo um WebP de 180KB em vez de um JPEG de 3MB, então o egress por imagem é muito menor. A otimização em si é o que reduz o custo, não alguma isenção 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.
Posso usar um CDN customizado na frente do Vercel para reduzir egress?
Você pode colocar o proxy do Cloudflare na frente do seu deployment Vercel. O Cloudflare faz cache das respostas em sua edge, o que significa que requisições que atingem o cache do Cloudflare não chegam ao Vercel. Isso pode reduzir significativamente tanto o egress quanto as invocações de função. Existem algumas ressalvas com preview deployments e manipulação de headers, mas para produção essa é uma abordagem comum e legítima. A documentação do Cloudflare sobre proxying cobre a configuração.Cloudflare's documentation on proxying covers the setup.
Qual é a maior causa isolada de contas inesperadas da Vercel?
Na minha experiência: manipulação de imagens. Ou imagens em resolução completa sendo servidas sem otimização, ou rotas de otimização de imagens sendo chamadas a cada requisição sem cache adequado. Organize seu pipeline de imagens primeiro, tudo mais em segundo lugar.
A Vercel notifica você automaticamente se o uso aumentar?
Não por padrão. Você precisa configurar. Não há alerta pronto que diga "você usou 80% da sua banda". Essa é a lacuna. Defina seus limites de gastos no mesmo dia em que configurar seu deployment em produção. Não depois.
---
Vercel é uma ótima plataforma. Eu uso, Seahawk usa, e vou continuar recomendando para os projetos certos. Mas é um serviço medido rodando em infraestrutura real, e o preço reflete isso. Os desenvolvedores que sofrem com contas surpresa são quase sempre aqueles que trataram como um CDN gratuito e nunca olharam as configurações de cobrança. Cinco minutos de configuração quando você faz o deploy vão te poupar um telefonema bem desconfortável em uma segunda-feira de manhã.