Performance em WordPress Headless tem sido um aspecto mais facilitado do que em projetos convencionais. O site deixa de ter, por exemplo, uma estrutura com códigos back-end e front-end misturados para serem otimizados.
O trabalho de otimização é mais organizado e focado e os resultados têm sido ainda mais convincentes. Cada pilar tem suas particularidades e respectivos desafios, mas a análise estratégica para a melhoria efetiva de performance em WordPres, continua se baseando nos três pilares:
- Servidor/Infraestrutura;
- Tecnologia/Desenvolvimento;
- Conteúdo/Integração.
Os pilares da performance em WordPress Headless
Vamos considerar os pilares de Servidor/Infraestrutura e Tecnologia/Desenvolvimento para pensarmos sobre o assunto. Essa separação nos permite compreender melhor os desafios e adotar estratégias correspondentes a cada cenário.
Servidor/Infraestrutura
Temos dois pontos de atenção: a área administrativa e os endpoints da REST API. Sobre a área administrativa, me refiro especificamente ao editor, WordPress em si, e à quantidade de pessoas que farão o trabalho de gestão. Quanto mais pessoas estiverem trabalhando simultaneamente, maior é o desafio de infraestrutura.
A equipe precisa ter uma resposta rápida às suas operações que estão ligadas diretamente ao banco de dados da aplicação. Ou seja, inserção, edição, atualização e exclusão de conteúdos diversos. O esforço de performance estará centralizado no banco de dados. Ele precisará ser adequado ao volume esperado e ter alto poder de performance/escrita.
Em alguns cenários, é possível ir além e trabalhar com uma replicação e estrutura com base de dados master e slaves. A grande vantagem com estrutura Headless é qufe a concorrência de acessos com os visitantes do site de uma forma geral são centralizados unicamente nos endpoints da WP REST API. Os retornos dessa API são JSON; logo, um arquivo estático. Portanto, podem ser cacheados e servidos mais rapidamente e com economia de recursos.
E para termos esse pilar colaborando ainda mais com a performance em WordPress Headless, podemos considerar o Redis, um banco de dados de chave-valor que armazena os dados com a durabilidade desejada. Cada retorno em JSON das consultas a API serão armazenados nessa estrutura e o purge precisa ser devidamente tratado para garantir a limpeza e atualização do conteúdo.
Tecnologia/Desenvolvimento
A camada de visualização em projetos headless é inteiramente baseada em tecnologias front-end. Essa camada será desenvolvida do zero e pode ter a concepção de performance desde o início.
Além disso, o servidor pode ser equipado com uma estrutura que ajudará no trabalho, como a adoção do IPv6, o protocolo HTTP/2 e o servidor web NGINX, por exemplo.
É preciso ter cuidado com os frameworks utilizados. Me refiro, por exemplo, ao React, Vue.js, Angular e Bootstrap, considerando o carregamento somente dos arquivos a serem utilizados no projeto.
Os demais: desconsidere e evite seu carregamento. Serão arquivos a menos, e por conseguinte haverá uma melhoria de performance.
Os assets também devem ser otimizados. Me refiro aos arquivos CSS, JavaScript, imagens e fontes web. E todos podem ser entregues com o GZIP aplicado. CSS e JavaScript devem ser minificados para terem uma compactação e redução em seu tamanho. As imagens precisam ser tratadas para eliminar todos os bytes desnecessários, e como estamos tratando de arquivos estáticos, uma estrutura de CDN pode acelerar a entrega.
Ferramentas tradicionais podem ser utilizadas para medir a performance em WordPress Headless:
Conclusão
Performance em qualquer projeto web será um ponto central. Os usuários preferem uma aplicação otimizada, com menor tempo de resposta e mais leve para sua navegação. Bom tempo de carregamento também vai lhe ajudar na preferência dos algoritmos do Google e Facebook.
E esses dois são grandes responsáveis por direcionarem tráfego para o seu site. Como vimos, performance em WordPress Headless pode ser facilitada se o projeto – desde o início – for bem concebido.
De 0 a 10, o quanto você recomendaria este artigo para um amigo?