As traduções são geradas por tradução automática. Em caso de conflito entre o conteúdo da tradução e da versão original em inglês, a versão em inglês prevalecerá.
Amplify o suporte para Next.js SSR
O Amplify suporta implantação e hospedagem de aplicativos web renderizados no lado do servidor (SSR) criados usando apenas o Next.js. Next.js é uma estrutura React para o desenvolvimento de SPAs com JavaScript. Você pode implantar aplicativos criados com o Next.js 13 com recursos como otimização de imagens e scripts, regeneração estática incremental (ISR) e middleware.
Os desenvolvedores podem usar o Next.js para combinar geração de site estático (SSG) e SSR em um único projeto. As páginas SSG são pré-renderizadas no momento da criação e as páginas SSR são pré-renderizadas no momento da solicitação.
A pré-renderização pode melhorar o desempenho e a otimização dos mecanismos de pesquisa. Como o Next.js pré-renderiza todas as páginas no servidor, o conteúdo HTML de cada página está pronto quando chega ao navegador do cliente. Esse conteúdo também pode ser carregado mais rápido. Tempos de carregamento mais rápidos melhoram a experiência do usuário final com um site e impactam positivamente a classificação de SEO do site. A pré-renderização também melhora o SEO ao permitir que os robôs dos mecanismos de pesquisa encontrem e rastreiem o conteúdo HTML de um site com facilidade.
O Next.js fornece suporte de análise integrado para medir várias métricas de desempenho, como Time to first byte (TTFB) e First contentful paint (FCP). Para obter mais informações sobre o Next.js, consulte Introdução
Compatibilidade dos recursos do Next.js
A computação do Amplify Hosting gerencia totalmente a renderização do lado do servidor (SSR) para aplicativos criados com o Next.js 12 ou posterior. Se você implantou um aplicativo Next.js no Amplify antes do lançamento da computação do Amplify Hosting, seu aplicativo está usando o provedor SSR anterior do Amplify, Classic (somente Next.js 11). A computação do Amplify Hosting não oferece suporte a aplicativos criados usando o Next.js versão 11 ou anterior. É altamente recomendável que você migre seus aplicativos Next.js 11 para o provedor SSR gerenciado por computação da Amplify Hosting.
A lista a seguir descreve os recursos específicos que o provedor de SSR de computação da Amplify Hosting suporta.
Recursos compatíveis
-
Páginas renderizadas do lado do servidor (SSR)
-
Páginas estáticas
-
Rotas de API
-
Rotas dinâmicas
-
Detecção de todas as rotas
-
SSG (geração estática)
-
Regeneração estática incremental (ISR)
-
Roteamento de subcaminhos internacionalizado (i18n)
-
Roteamento de domínio internacionalizado (i18n)
-
Detecção automática de localidade internacionalizada (i18n)
-
Middleware
-
Variáveis de ambiente
-
Otimização de imagem.
Recursos do não compatíveis
-
Rotas de API
-
Regeneração estática incremental sob demanda (ISR)
-
Diretório de aplicativos Next.js 13 (beta)
Usando a otimização de imagem do Next.js
A documentação do Next.js recomenda que você instale o módulo de processamento de imagem Sharp para permitir que a otimização de imagens funcione corretamente na produção. No entanto, isso não é necessário para implantações do Amplify. O Amplify implanta automaticamente o Sharp para você.
O tamanho máximo de saída da imagem não pode exceder 6 MB. Você pode ter um arquivo de imagem maior armazenado em algum lugar e usar onext/image componente para redimensioná-lo e otimizá-lo em um formato Webp ou AVIF e, em seguida, servi-lo em um tamanho menor.
