Cloudflare Images + R2: imagens rápidas, otimizadas e rastreáveis

Uma imagem de capa pode ser bonita e ainda atrapalhar o produto se chegar pesada ao celular, sem cache ou em um tamanho que a tela não usa. Cloudflare Images resolve transformação e otimização na edge; R2 resolve armazenamento. Juntos, eles permitem guardar um original uma vez e entregar a variação certa para cada uso.

No nosso stack, R2 é a fonte de arquivos e o binding IMAGES transforma conteúdo via API. Isso evita subir manualmente uma cópia para card, outra para hero, outra para mobile e outra em WebP. A aplicação continua responsável por upload seguro, relação com a tabela file e cache.

R2 e Cloudflare Images não concorrem

R2 não gera variações automaticamente. Cloudflare Images não sabe qual usuário pode trocar uma capa. O Worker une as peças com regra de negócio.

Cenário: blog rápido sem novo deploy para trocar capa

O Gestor envia a imagem para a API. A API valida tipo e tamanho, cria uma key versionada no R2, registra file e devolve a URL. Quando o Portal precisa de uma versão menor, ele pede transformação com largura, altura, fit e formato definidos. A capa original permanece preservada; a derivada pode ser cacheada.

Gestor → API autenticada → R2 (original) → file/uses_file
Portal → Worker Images binding → WebP ou AVIF otimizado → CDN

Esse fluxo também permite uma política clara: capa pública pode sair por custom domain; comprovante financeiro nunca passa pelo mesmo endpoint aberto.

O preço que realmente importa

Cloudflare Images Free permite até 5 mil transformações únicas por mês. Acima disso, novas transformações retornam erro até você migrar para Images Paid. No plano pago, as primeiras 5 mil transformações seguem incluídas e as adicionais custam US$ 0,50 por mil. Se você usar R2 como storage, paga apenas transformação no Images e storage/operações no R2; não paga o modelo de armazenamento do Cloudflare Images.

Uma “transformação única” é a combinação do original e parâmetros. A mesma imagem com 100×100 e 1200×630 conta como duas; repetir 1200×630 no mês não cria outra transformação. Portanto, defina poucas variantes de produto, não um tamanho livre para cada query string recebida.

Quando usar transformação no Worker

O binding de Images funciona com bytes e não exige que o arquivo esteja acessível em URL pública. Isso é útil para um arquivo privado autorizado pela API. A URL de entrega pode bastar para imagem pública simples; o binding dá mais controle quando você já está no Worker e precisa aplicar regra antes de transformar.

Prós e contras

Prós: melhor LCP, conversão de formato, menos cópias manuais, cache global e pipeline simples com R2. Contras: transformação tem limite/custo por variação, precisa de regra de cache e não substitui curadoria de imagem, acessibilidade ou consentimento de uso.

Checklist de imagem de produção

• original tem MIME type e tamanho validados;
• key de R2 é versionada;
• arquivo público e privado têm caminhos separados;
• variantes são limitadas e documentadas;
• alt descreve a informação visual relevante;
• cache usa URL imutável quando o arquivo muda de key;
• métricas acompanham erro de transformação e volume de variantes.