Vercel Anuncia Novidades no Next.js para Facilitar o Auto-Hospedagem
A versão 15 do Next.js traz um suporte aprimorado e documentação atualizada para auto-hospedagem, além de uma nova API de cache, conforme anunciado por Lee Robinson, Vice-Presidente de Produto da Vercel, durante a conferência de Next.js realizada em outubro em San Francisco.
Vercel Anuncia Novidades no Next.js para Facilitar o Auto-Hospedagem
“Embora já tivéssemos documentação e exemplos sobre como realizar a auto-hospedagem, esses materiais careciam de profundidade em alguns aspectos, como otimização de imagens e configuração de cache, especialmente em ambientes com múltiplos contêineres,” informou Robinson. “Existiam muitos elementos que exigiam configuração manual.”
Com a nova versão do Next.js, ficou mais simples definir o manipulador de cache padrão. Agora, os desenvolvedores podem utilizar o cache em memória e personalizar um manipulador que empregue qualquer adaptador desejado, complementou Robinson.
Ele também apresentou uma nova comunidade no GitHub dedicada ao Next.js, que será um espaço para templates, exemplos de implantação, adaptadores comunitários e outros recursos úteis.
A melhoria na documentação sobre auto-hospedagem foi destacada. Os desenvolvedores agora têm acesso a um vídeo tutorial apresentado por Robinson, que demonstra o processo de auto-hospedagem, incluindo a implantação em um servidor privado virtual (neste caso, um VPS de $4 com Docker) e como configurar todas as funcionalidades necessárias. O vídeo ainda aborda as possíveis decisões e configurações que podem ser feitas.
Utilização de Cache, CacheTag e CacheLife
A nova API “use cache” foi apresentada por Delba de Oliveira, engenheira de experiência do desenvolvedor na Vercel, como uma forma de acelerar aplicações web. “O use cache implementa um cache em memória, que pode ser configurado posteriormente para se adaptar à arquitetura do desenvolvedor, permitindo que, no futuro, seja possível hospedá-lo em qualquer lugar,” esclareceu ela.
A introdução desse modo torna o caching completamente opcional e explícito. Os desenvolvedores podem usar o cache dentro de uma função de busca de dados, garantindo que, enquanto o valor de entrada permanecer o mesmo, o recurso será reutilizado. “Isso torna o uso do cache, na verdade, muito acessível em toda a aplicação,” afirmou.
Os desenvolvedores familiarizados com a API de cache instável reconhecerão a diferença no novo use cache. “Podemos ver o use cache como uma evolução do cache instável, que era eficiente para armazenar dados JSON; agora, o use cache suporta qualquer coisa renderizada pelo React, desde que seja serializável,” detalhou.
A nova função também possibilita o uso de cache com fetch, clientes de banco de dados ou até dentro do próprio componente. Foram adicionadas duas novas APIs para revalidação de dados: CacheTag, que permite revalidações sob demanda, e cacheLife, que facilita revalidações baseadas no tempo.
Além disso, o Next.js agora conta com perfis de cache que descrevem a duração do cache em termos compreensíveis, como segundos, minutos, horas e dias. “Os perfis de cache estão integrados nas camadas de cache do framework, permitindo que os desenvolvedores se concentrem menos nas diferentes camadas de cache e nos limites de rede,” comentou Delba, ressaltando que esses perfis podem ser personalizados.
“O nosso objetivo com essa API é reduzir a fadiga de decisão relacionada à revalidação,” acrescentou.
Diante das atualizações no Next.js, há funcionalidades que os desenvolvedores não precisarão mais utilizar. Delba mencionou especificamente o cache instável, mas também opções de configuração de rotas, como dinâmicas, fetch, cache e revalidação, assim como extensões de fetch, e a configuração global de tempos de expiração.
“Essas APIs visam facilitar o trabalho dos desenvolvedores, eliminando a sobrecarga de informações. Resumindo, nós buscamos e renderizamos dados de forma dinâmica com componentes assíncronos para caminhos dinâmicos e usamos Suspense para aproveitamento de streaming. Quando desejamos pré-renderizar algo, utilizamos cache e, para revalidação, empregamos cacheLive e cacheTag. Basicamente, é isso,” finalizou.
Melhorias na Estrutura do Next.js
Além das mudanças para facilitar a auto-hospedagem, Robinson mencionou outros aprimoramentos no núcleo do Next.js.
“No passado, usávamos uma biblioteca de otimização de imagens baseada em WebAssembly, que, embora rápida na instalação, consumia mais memória ao ser implantada em um servidor de auto-hospedagem,” explicou. “Não estávamos satisfeitos com essa compensação.”
Como solução, o Next.js passou a utilizar o Sharp, uma biblioteca Node.js altamente eficiente para processamento de imagens. “O legal do Sharp é que, além de ter uma instalação rápida, é também muito eficiente em termos de consumo de memória. Com o Next.js 15, instalamos o Sharp automaticamente para você, garantindo que nossos usuários na auto-hospedagem tenham o melhor dos dois mundos,” ressaltou.
Outra melhoria importante foi a atualização dos cabeçalhos de controle de cache padrão, tornando mais fácil a modificação desses padrões, algo que antes era complicado. O Next.js 15 também simplificou a configuração do manipulador de cache padrão, permitindo que os desenvolvedores façam uso do cache em memória e definam um manipulador personalizado, com a opção de integrar soluções como o Redis. Isso deve resultar em tempos de resposta mais rápidos e menor carga no servidor.
Os novos recursos de caching são compatíveis tanto com o Pages Router quanto com o novo App Router, abrangendo todas as funcionalidades de cache do Next.js, como ISR (Incremental Static Regeneration) e o use cache, e enquanto a configuração padrão é em memória, os programadores têm a opção de persistir o cache em armazenamento, se assim desejarem.
Por fim, o Next.js agora oferecerá suporte ao ambiente de execução Node.js para middleware. “Em sua configuração, você pode contar com novas opções que possibilitam uma personalização completa do seu cache de acordo com a estrutura do seu CDN, permitindo uma configuração sob medida,” concluiu. “Nossa intenção com o Next.js é impulsionar todo o ecossistema e compartilhar nossas descobertas com todos vocês.”
Robinson também lembrou que o CEO da Vercel, Guillermo Rauch, tem criticado as CDNs. Ele reconheceu que o Next.js desenvolve suas funções em paralelo com a aplicação prática na infraestrutura da Vercel, promovendo uma “alta coesão entre o framework e a infraestrutura.” Ao mesmo tempo, enfatizou a busca por um acoplamento mais flexível ao implantar na prática.
“Nossa ambição com o Next.js é oferecer um framework robusto, mas acessível, para o próximo milhão ou bilhão de aplicações web,” comentou. “Precisamos garantir que a experiência de começo seja simples, flexível para atender às diversas necessidades e suficientemente poderosa para suportar qualquer nível de aspiração para seu aplicativo ou requisitos de negócio.”
