Cloudflare

Como uso o R2 para atualizar sites sem refazer o build

Mostro como organizo Markdown, JSON e imagens no R2 e quando prefiro D1. Um índice evita buscar objetos sem necessidade, mas não substitui um banco de dados em toda situação.

Publicar um único artigo e reconstruir milhares de páginas é um desperdício quando o projeto pode ler o conteúdo de arquivos fora do build. Nos meus sites, uso o Cloudflare R2 para guardar imagens, dados em JSON e textos em Markdown. A organização muda conforme o tipo de página e o trabalho que o site precisa fazer.

Assistir à demonstração no YouTube

Use o R2 para guardar objetos como imagens, arquivos Markdown e JSON que o site lê por uma chave conhecida. Um índice ou catálogo pronto pode evitar varrer o bucket em cada visita. Prefira D1 quando precisar filtrar e relacionar muitos registros, receber alterações de usuários ou consultar dados por vários campos.

O R2 guarda arquivos; ele não oferece as mesmas consultas de um banco relacional.
Pastas e chaves claras ajudam a localizar conteúdo e reaproveitar mídia.
Um índice publicado e atualizado reduz listagens repetidas do bucket.

Adicione conteúdo sem reconstruir o projeto inteiro

Em muitos sites estáticos, o conteúdo entra no projeto antes do build. Quando você publica um artigo novo, precisa gerar e enviar o site outra vez. Para um blog pequeno isso pode funcionar bem. Num catálogo com milhares de páginas, uma alteração simples pode exigir um build demorado.

Uma alternativa é guardar o conteúdo como objetos no R2 e fazer o site ler o arquivo necessário quando recebe uma visita. O frontend ainda pode ser entregue como arquivos estáticos, enquanto os dados vêm do bucket. Isso permite adicionar ou corrigir conteúdo sem reconstruir todas as páginas, desde que a aplicação saiba localizar o objeto e montar a resposta.

Organize os dados como arquivos que o site sabe ler

O R2 é um serviço de armazenamento de objetos compatível com a API S3. No meu Tier Versus, organizei imagens por obra e guardei informações em arquivos de texto e JSON. Uma página pode buscar os dados da obra e usar as chaves das imagens para montar a interface. Os mesmos arquivos de imagem também podem atender outros projetos.

Para um blog, eu criaria chaves previsíveis, como blog/categoria/slug.md, e colocaria no próprio arquivo os campos que a página precisa: título, descrição, data, autor e categoria. O site lê o Markdown e apresenta o conteúdo. Separar por categorias e slugs também facilita encontrar, editar ou remover uma publicação.

O formato depende do conteúdo. JSON funciona bem para objetos estruturados, como pins de um mapa ou informações de uma obra. Markdown é mais confortável para textos longos. TXT pode servir para uma lista simples. O importante é escolher uma estrutura que o site consiga interpretar sem precisar baixar e processar arquivos que não serão usados.

Use um catálogo para não listar o bucket em cada visita

Uma listagem do R2 pode retornar até mil objetos por chamada e exige paginação quando há mais arquivos. Se toda visita ao site começar com uma busca por todos os objetos, você repete trabalho e gera operações de listagem. Em vez disso, mantenha um índice JSON com os caminhos e os dados necessários para montar as páginas ou os catálogos.

Eu atualizo os índices e sitemaps quando publico conteúdo. Assim, a navegação consulta uma lista preparada e busca o arquivo específico quando precisa. O índice também permite montar categorias sem percorrer o bucket inteiro. Se você guardar todas as chaves num JSON enorme, porém, ele pode ficar pesado; divida os catálogos quando o volume pedir.

O R2 cobra por armazenamento e operações, com cotas mensais gratuitas para o nível Standard. A documentação atual lista 10 GB-mês, 1 milhão de operações Classe A e 10 milhões de Classe B. Gravações e listagens entram em Classe A; leituras de objetos entram em Classe B. A transferência de saída não tem tarifa. Acompanhe o uso e consulte os valores atuais na tabela de preços do R2.

R2 e D1 resolvem problemas diferentes

Um arquivo JSON pode guardar uma ficha pronta, mas não oferece o mesmo tipo de consulta que uma tabela. No D1, você pode filtrar colunas, criar índices e relacionar dados. Isso faz diferença quando visitantes criam listas, comentários, contas ou registros que mudam com frequência.

No Item Maps, por exemplo, eu guardo imagens, mapas e informações estáticas no R2, mas também uso banco de dados para dados que precisam de outra forma de consulta. Para páginas públicas, o servidor pode renderizar os dados principais e deixar a interação do mapa para o JavaScript no navegador. Cada parte usa o formato que combina com ela.

Também confira as cotas do plano antes de escolher. Na tabela atual, o D1 Free inclui até 5 milhões de linhas lidas por dia, 100 mil escritas por dia e 5 GB de armazenamento. Quando a conta ultrapassa os limites diários, as consultas podem falhar até o próximo ciclo. Índices e consultas menores ajudam; o R2 não elimina esses limites se o sistema ainda depender de D1.

O R2 pode servir imagens e outros arquivos

Nos meus projetos, uma pasta separa imagens de anime, televisão e jogos. O endereço da imagem pode seguir a chave do objeto, como anime/image/nome-da-obra.jpg. Uma ficha JSON aponta para esse arquivo, e outras páginas podem reutilizar a mesma imagem sem duplicar o acervo.

O bucket guarda os objetos; a forma de entregá-los ao visitante depende da configuração. Você pode servir conteúdo por um domínio público ou por um Worker com binding do R2. Se o bucket for público, configure o domínio e o acesso com cuidado. Mantenha privados os arquivos que não devem estar disponíveis para qualquer pessoa.

A regra que sigo é guardar no R2 os objetos que o site consegue identificar diretamente e preparar um catálogo para navegação. Para dados que pedem filtros, relações ou gravações frequentes, avalio D1. Assim, consigo reaproveitar arquivos sem transformar cada visita numa busca completa pelo bucket.

O que conferir

  1. Escolha chaves previsíveis para artigos, imagens e fichas JSON.
  2. Mantenha um catálogo ou índice atualizado para localizar os objetos.
  3. Use D1 quando precisar de filtros, relações ou dados enviados por usuários.
  4. Confira as cotas de armazenamento e de operações do plano.

O que pode dar errado

Tratar o R2 como se fosse um banco relacional.

Listar o bucket inteiro em cada carregamento do site.

Supor que armazenamento gratuito significa operações ilimitadas.

Publicar um bucket sem conferir quais arquivos qualquer pessoa poderá acessar.

Perguntas frequentes

Posso guardar artigos em Markdown no R2?

Sim. Guarde cada arquivo numa chave previsível e faça o site ler e interpretar o Markdown. Um índice ajuda a listar artigos sem percorrer o bucket em cada visita.

O R2 substitui o D1?

Em projetos com arquivos e objetos conhecidos, pode guardar boa parte dos dados. Para filtros por colunas, relações e dados editados por usuários, D1 costuma ser mais adequado.

As leituras do R2 são sempre gratuitas?

O nível Standard tem uma cota mensal gratuita de operações Classe B, mas o uso acima dela pode ser cobrado. Confira os valores e as cotas atuais na documentação do R2.

Para entender como distribuo o processamento entre o Worker e o navegador, leia também sobre o limite de CPU do Workers Free.