Categorias
Desenvolvimento Web

Next.js + Vercel + WordPress

Uso e trabalho com PHP há muitos anos e lá atrás as coisas eram bem complicadas – CMS era um palavrão que ninguém entendia muito bem como funcionava, as opções eram escassas e invariavelmente a gente caia no colo do phpnuke (ou aspnuke, dependendo do seu azar), que era terrível de customizar e estender. Até que um dia surge o WordPress, essa coisa linda que gerencia quase metade das páginas da internet ainda hoje.

Como todo gerenciador de conteúdo dinâmico, exige certo processamento no servidor, e todo processamento toma tempo, por menor que seja.

Daí pulamos para 2021, com zilhões de páginas espalhadas por aí, uma competindo com a outra por alguns segundos de atenção e a gente com a vida corrida, picos e mais picos de ansiedade onde cada segundo de espera para abrir uma página gera frustração de desinteresse: a solução? otimizar a resposta da página para que carregue o mais rápido possível. Como fazer a página responder mais rápido? vamos fazer todo processamento antes do usuário acessar, e quando ele precisar, só enviamos o resultado que já está prontinho, e preferencialmente, em um servidor próximo.

Nessa direção comecei a estudar o Next.js, um framework baseado na biblioteca React (que por sua vez é baseado em JavaScript) que facilita a construção de páginas renderizadas estaticamente. Isso resolve a primeira parte do problema, retirando qualquer processamento no servidor no momento que alguém acessa a página.

A última parte, deixar as páginas o mais próximo possível do usuário, é feita pelo Vercel (que por sinal, é quem criou/mantém o Next.js). Ele abstrai a construção da página (com uma infraestrutura própria de CI/CD) e a sua distribuição.

E onde entra o WordPress? Bom, essa solução não oferece uma interface rica para edição de conteúdo como o WP (existem outras integrações para isso, mas o foco aqui é em quem já usa WP). A ideia é manter o WP para criar páginas/posts e usar o Next.js+Vercel para servir esse conteúdo de forma mais rápida.

Como fazer isso? Existem várias formas, mas uma das mais simples é instalar o plugin WP Graphql para expor seu conteúdo em uma API GraphQL estruturada, consumir essa API com o Next.js e aí ter sua versão estaticamente gerada.

E fica mais rápido? Compare aí: cauancabral.vercel.app

Para poucos acessos e uso pessoal, não tem nenhum custo envolvido.

Por Cauan Cabral

Desenvolvedor com 2 dígitos de experiências, especialista em PHP e CakePHP mas com bagagens em JavaEE, Node.js, Javascript (ES6, jQuery, Angular) e Python. Interessado em automação, Machine Learning e cozinha.

Deixe um comentário

O seu endereço de e-mail não será publicado.

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.