Arquivos Estáticos
A funcionalidade de CDN para Arquivos Estáticos permite que você envie automaticamente arquivos como JavaScript (JS), CSS, SVG e fontes para o Cloudflare R2 e altere suas URLs para serem servidos a partir do CDN. Isso melhora significativamente o desempenho do seu site e reduz a carga no seu servidor.
Visão Geral
Arquivos estáticos como JavaScript e CSS são parte fundamental do seu site, mas também podem consumir largura de banda e recursos do servidor. Ao servir esses arquivos a partir do Cloudflare R2, você aproveita a rede global da Cloudflare para entregar seu conteúdo estático mais rapidamente aos seus visitantes, independentemente da localização deles.
O plugin automatiza todo o processo de envio desses arquivos para o R2 e modifica as URLs no HTML do seu site para apontar para o CDN. Esse processo é transparente para seus visitantes e não requer nenhuma modificação manual do código.
Página de Arquivos Estáticos
A página de Arquivos Estáticos no painel administrativo do plugin oferece uma visão completa do status do CDN para arquivos estáticos e ferramentas para gerenciá-lo:
Status do CDN de Arquivos Estáticos
No topo da página, você encontrará um resumo do status atual:
- Status atual: Indica se o CDN para arquivos estáticos está ativo ou inativo.
- Arquivos Enviados: Mostra o número total de arquivos enviados para o R2, divididos por tipo.
Nota: O plugin precisa escanear seu site e enviar os arquivos para o R2 antes que o CDN possa ser ativado. Se você ainda não fez isso, verá um aviso indicando que precisa executar o upload inicial.
Configurações de Arquivos Estáticos
A seção de configurações permite personalizar o comportamento do CDN para arquivos estáticos:
- Status do CDN: Ativa ou desativa o redirecionamento de URLs para arquivos estáticos. Mesmo que desativado, os arquivos permanecerão no R2.
- Tamanho do Lote: Define o número de arquivos a serem processados em cada lote durante o upload (recomendado: 50). Reduza esse valor se estiver enfrentando problemas de timeout ou memória.
- Upload Automático: Se ativado, o plugin verifica periodicamente se há novos arquivos estáticos ou se arquivos existentes foram modificados e os envia automaticamente para o R2.
- Frequência de Verificação: Define com que frequência o plugin verificará por novos arquivos ou modificações (diariamente, a cada 3 dias, semanalmente).
- Upload na Atualização: Se ativado, o plugin enviará novos arquivos estáticos quando um tema ou plugin for atualizado.
- Versionamento de Arquivos: Adiciona um parâmetro de versão às URLs para garantir que os visitantes sempre recebam a versão mais recente dos arquivos.
Depois de ajustar as configurações, clique em Salvar Configurações para aplicar as alterações.
Upload de Arquivos Estáticos para R2
Antes de ativar o CDN, você precisa enviar seus arquivos estáticos para o Cloudflare R2. O plugin automatiza esse processo:
Processo de Upload Inicial
- Clique no botão Iniciar Upload de Arquivos Estáticos na página de Arquivos Estáticos.
- O plugin primeiro escaneará seu site para identificar todos os arquivos estáticos. Este processo pode levar alguns minutos, dependendo do tamanho do seu site.
- Após o escaneamento, você verá uma lista dos arquivos encontrados e o plugin começará a enviá-los para o R2 em lotes.
- O progresso do upload será exibido, mostrando:
- Número de arquivos processados
- Número de arquivos restantes
- Lotes processados
- Você pode pausar o processo a qualquer momento clicando em Parar Upload.
- Para continuar um upload pausado, clique em Continuar Upload.
Dica: Para sites grandes com muitos arquivos estáticos, o processo de upload pode levar algum tempo. Se você estiver enfrentando timeouts ou problemas de memória, tente reduzir o tamanho do lote nas configurações.
Locais Escaneados
O plugin escaneia os seguintes locais em busca de arquivos estáticos:
- Diretório de temas: /wp-content/themes/
- Diretório de plugins: /wp-content/plugins/
- Outros diretórios dentro de /wp-content/ (exceto cache e uploads)
Por padrão, o plugin exclui arquivos com referências a PHP ou AJAX para evitar problemas de compatibilidade.
Ativando o CDN para Arquivos Estáticos
Após concluir o upload inicial dos arquivos, você pode ativar o CDN para começar a servir os arquivos estáticos a partir do Cloudflare R2:
- Na seção de configurações, defina Status do CDN como Ativo.
- Clique em Salvar Configurações.
- Limpe o cache do seu site, caso esteja usando um plugin de cache.
Após ativar o CDN, todas as URLs dos arquivos estáticos em seu site serão automaticamente modificadas para apontar para o CDN. Por exemplo:
# URL original: https://seusite.com/wp-content/themes/seu-tema/style.css # URL com CDN: https://seu-bucket.r2.cloudflarestorage.com/wp-content/themes/seu-tema/style.css
Se você configurou um domínio personalizado para o CDN, a URL será modificada para usar esse domínio:
# URL com domínio personalizado: https://cdn.seusite.com/wp-content/themes/seu-tema/style.css
Gerenciando Arquivos Estáticos
Depois que os arquivos forem enviados para o R2, você verá uma lista detalhada de todos os arquivos na seção "Arquivos Enviados". Esta seção oferece as seguintes funcionalidades:
- Filtrar arquivos: Pesquise rapidamente arquivos específicos por nome, tipo ou caminho.
- Visualizar detalhes: Veja informações detalhadas sobre cada arquivo, incluindo caminho e data de última atualização.
- Reenviar arquivos: Atualize arquivos individuais no R2 com um único clique.
- Limpar lista: Opção para limpar a lista de arquivos enviados (sem excluir os arquivos do R2).
A interface mostra um resumo prático dividido por tipos de arquivo (JavaScript, CSS, Fontes e SVG), permitindo que você tenha uma visão clara de todos os arquivos enviados.
Verificando o Funcionamento do CDN
Após ativar o CDN, é importante verificar se os arquivos estáticos estão sendo corretamente servidos a partir do Cloudflare R2:
- Visite seu site em uma janela anônima do navegador (para evitar interferência do cache do navegador).
- Abra as ferramentas de desenvolvimento do navegador (F12 ou botão direito > Inspecionar).
- Vá para a aba "Rede" (Network) e recarregue a página.
- Filtre por tipos de arquivo como "js" ou "css".
- Verifique se as URLs desses arquivos estão apontando para seu bucket R2 ou domínio personalizado do CDN.
Solução de problemas: Se os arquivos não estiverem sendo servidos pelo CDN, verifique:
- Se o cache do site foi limpo após ativar o CDN.
- Se há algum conflito com outros plugins de CDN (desative-os temporariamente para testar).
- Se as URLs estão sendo corretamente modificadas no HTML da página.
Atualização Automática de Arquivos
O plugin oferece funcionalidades para manter seus arquivos estáticos sempre atualizados no R2:
Upload Automático
Com o upload automático ativado, o plugin verifica periodicamente seu site em busca de novos arquivos estáticos ou arquivos modificados:
- A verificação ocorre de acordo com a frequência configurada (diária, a cada 3 dias ou semanal).
- Apenas arquivos novos ou modificados são enviados para o R2.
- O processo ocorre em segundo plano sem interferir na performance do seu site.
Upload na Atualização
Quando você atualiza temas ou plugins, novos arquivos estáticos podem ser adicionados ou modificados. Com a opção "Upload na Atualização" ativada, o plugin detecta automaticamente essas alterações e:
- Inicia uma verificação logo após a conclusão de atualizações de temas ou plugins.
- Envia apenas os arquivos novos ou modificados durante a atualização.
- Mantém o versionamento correto para garantir que os visitantes recebam as versões mais recentes.
Versionamento de Arquivos
A funcionalidade de versionamento adiciona um parâmetro de versão às URLs dos arquivos servidos pelo CDN. Isso garante que:
- Os visitantes sempre recebam a versão mais recente de cada arquivo.
- As atualizações sejam imediatamente visíveis, sem problemas de cache do navegador.
- O parâmetro de versão é baseado no timestamp de upload do arquivo.