Após o nosso redesenho, WPBv4, passamos algum tempo fazendo otimização de desempenho (ainda falta algum trabalho para fazer). Depois de fazer alguma otimização, vimos uma grande melhoria de desempenho no site. Foi notável o suficiente para que nossos usuários nos enviassem um email perguntando sobre isso. Nós ouvimos seus pedidos, e um guia completo sobre o que fizemos para acelerar nosso site será em breve. Mesmo tendo cobrado como instalar o MaxCDN no nosso tutorial sobre W3 Total Cache, nós fizemos algumas mudanças adicionais desde então. Neste artigo, mostraremos como instalar e configurar o MaxCDN no WordPress.
Aqui está o e-mail que recebemos de um dos nossos usuários:
“… o principal motivo pelo qual estou entrando em contato com você é perguntar sobre a velocidade do site. Como você consegue acelerar seu site tão rápido? A velocidade é insana e eu simplesmente adorei. ”
Nós fizemos inúmeros testes usando um site chamado Pingdom. O tempo de carregamento mais rápido da nossa página inicial foi de apenas 483ms. Executamos o teste várias vezes (horas e datacenters diferentes). Nosso intervalo de tempo de carga na página inicial foi de 483ms – 1,7s. Abaixo está uma das capturas de tela:
Muito entrou na otimização de desempenho (reduzindo consultas HTTP, como carregar scripts somente quando são necessárias, combinando scripts e folhas de estilo, otimizando imagens, etc.). Mas um dos principais componentes que torna o nosso site carregado rapidamente e nos impede de falhar é um ótimo CDN do WordPress. Estamos usando o MaxCDN, e você pode nossa avaliação do MaxCDN em nossa seção do Blueprint onde explicamos por que usamos o MaxCDN. Se você não sabe o que é um CDN ou porque você precisa de um CDN, então você deve verificar ou infografar “O que o Heck é um CDN”.
Depois de criar sua conta com o MaxCDN, você precisa instalar este plugin gratuito do WordPress chamado W3 Total Cache.
A primeira coisa que você precisa fazer é fazer o login na sua conta do MaxCDN e criar uma “Zona de pull”. Para fazer isso, clique no botão Gerenciar zonas e, em seguida, clique no ícone “Criar puxar zona”.
Na próxima página, você será solicitado a inserir os detalhes da sua nova zona Pull.
- Nome da zona do pull: pode ser qualquer coisa sem espaços, com um mínimo de 3 caracteres. Pense nisso como seu nome de usuário.
- URL do servidor de origem: digite o URL do seu blog wordpress. Deve ter “http: //” e a barra diagonal (/).
- Domínio CDN personalizado: use qualquer subdomínio, por exemplo: cdn.site.com
- Etiqueta: isto é como um campo de descrição. É opcional adicionar uma descrição.
- Compressão: Recomendamos que você ative isso, pois salvará o uso da largura de banda em sua conta.
Depois de clicar em Criar, você verá uma tela de sucesso. Nessa caixa verde, você terá um URL para o seu CDN. Isso parecerá algo como “wpb.site.netdna-cdn.com”. Vamos copiar este URL e salvá-lo em seu bloco de notas. Precisamos usá-lo em etapas posteriores. Se você for no seu painel, agora você verá a zona que você criou. Clique no ícone “gerenciar”.
Em seguida, você precisa clicar na guia “Configurações” e ver os domínios personalizados.
O objetivo aqui é adicionar vários subdomínios (CNAMEs), para que possamos melhorar o desempenho do pipeline no navegador. Para fazer isso, clique no botão de edição em Domínios personalizados e simplesmente adicione vários domínios personalizados.
Depois de adicionar os subdomínios personalizados, basta clicar em atualizar. Nas configurações de Compressão, certifique-se de habilitar a compressão GZip.
Agora que você configurou sua zona de puxar, pegue o urn CDN longo que você obteve em etapas anteriores que pareciam com este “wpb.site.netdna-cdn.com”. Nós vamos precisar disso para configurar os registros do CNAME. Vamos mostrar-lhe como criar o registro CNAME usando o cPanel. A maioria dos provedores de hospedagem do WordPress estão usando o cPanel. Faça login no seu cPanel e, em seguida, role para baixo na Seção de Domínios e clique em Editor de Zona DNS Simples .
Nesta página, você precisará preencher os campos para adicionar um registro CNAME. Os dois valores que você precisará preencher são: Nome e CNAME.
- Nome: Este é o nome do seu domínio CDN personalizado. Por exemplo, nosso domínio CDN personalizado é cdn.site.com, então colocamos “cdn” em nosso campo de nome.
- CNAME: Este será o URL fornecido pelo MaxCDN quando você criou a zona de puxar. Por exemplo: “wpb.site.netdna-cdn.com”.
Repita este processo para todos os domínios personalizados que você irá adicionar. O valor CNAME será o mesmo. Tudo o que você está mudando é o nome para gostar de “cdn”, “cdn2” etc. A adição do método CNAME pode ser diferente se você tiver um host não cPanel.
Agora que você configurou o MaxCDN, vamos avançar e integrá-lo com o WordPress. Precisamos usar o plugin W3 Total Cache. Instale e ative o plugin. Na tela Geral, se você rolar para baixo, você verá a caixa CDN. Habilite CDN e selecione a opção NetDNA / MaxCDN.
Salve as configurações. Agora, você precisará acessar o menu CDN no W3 Total Cache para configurar o MaxCDN com o WordPress. Esta página solicitará que você insira sua ID da API, chave da API e seus nomes de domínio personalizados.
Você pode obter sua identificação e chave da API do seu painel de controle MaxCDN. Se você for gerenciar conta »API. Clique na tecla adicionar e crie sua chave.
Depois de configurar a parte W3 Total Cache, você é bom para ir. Você pode clicar no botão Testar NetDNA, e você poderá obter o Teste aprovado.