A Nova Forma de Geração Estática do Next js (SSG e ISG)
Next.js é uma estrutura de aplicativo da web de código aberto que permite a construção de aplicativos da web estáticos e renderizados no lado do servidor. Recentemente, o Next.js lançou uma nova forma de geração estática de conteúdo, conhecida como SSG (geração estática no build time) e ISG (gerações estáticas incrementais).
SSG – Geração Estática no Build Time
Com o SSG, o conteúdo é gerado durante o tempo de construção do aplicativo. Isso significa que o conteúdo é pré-renderizado e o resultado final é salvo como arquivos HTML estáticos, que são servidos aos usuários sem a necessidade de gerar o conteúdo em tempo real. Isso melhora significativamente o desempenho e a experiência do usuário final, pois o conteúdo está pronto para ser exibido imediatamente.
ISG – Gerações Estáticas Incrementais
O ISG leva a geração estática um passo adiante, permitindo que o conteúdo seja regerado de forma incremental conforme necessário. Isso significa que partes específicas do conteúdo podem ser atualizadas sem a necessidade de regerar o site inteiro. Isso é extremamente útil para aplicativos com conteúdo em constante mudança, pois permite a atualização rápida e eficiente do conteúdo sem comprometer o desempenho geral do aplicativo.
Vantagens do SSG e ISG
A implementação de SSG e ISG no Next.js oferece diversas vantagens, incluindo:
- Melhoria no desempenho do aplicativo, pois o conteúdo pré-renderizado é entregue de forma mais rápida aos usuários.
- Melhoria na experiência do usuário final, pois o conteúdo é exibido imediatamente, sem atrasos na renderização.
- Maior eficiência na atualização e regeração do conteúdo, especialmente com a funcionalidade de ISG.
- Melhoria na capacidade de escala do aplicativo, pois o conteúdo estático pode ser facilmente cacheado e distribuído em CDNs.
Em resumo, a introdução do SSG e ISG no Next.js representa um avanço significativo na geração estática de conteúdo para aplicativos da web, trazendo benefícios tangíveis em termos de desempenho, eficiência e experiência do usuário. Essas novas formas de geração estática são, sem dúvida, uma adição bem-vinda ao arsenal de ferramentas para desenvolvedores web.
Eai, o que achou dessa nova forma de gerar os arquivos? E não esquece: se inscreva no Thon Labs para ficar por dentro de todas as novidades que forem saindo, principalmente em relação aos componentes UI (é de graça e sem span): https://www.thonlabs.io/
Não existe alguma forma no next.js de quando eu altere alguma informação aí sim ele vai e traz essa alteração? Ao invês de ficar a cada 10s como foi definido ali. Porque isso no caso em um site de larga escala que vários usuários utilizam custaria muito recurso a ponto de travar ou sabe sei lá o que aconteceria, não?
É possível renderizar do lado do servidor SSR e usar hooks tbm ?
Parabéns pelo conteúdo, estou estudando next pela documentação e não tinha ficado muito claro como funcionava essa função. Ajudou bastante.
Eu ficou intrigado com uma coisa… você teve que colocar um revalidate a cada 10 segudos…. isso fica rodando em memoria como de fato funciona isto é bem estranho o correto seria ouve alteração no conteudo atualiza o mesmo… só processa algo quando algo é alterado…. Uma coisa que não gosto muito no Next é que abistrai demais e não sabemos de fato como as coisas a contencem… quando precisamos de algo que seja fora do que foi pensando é um parto para enmtender as coisas…. Muita "Facilidade" por ter uma preço muito caro na depedência da empresa que fornece isso e poderá virar um transtorno total….
Bacana o video agora idepedente disto tudo… uma dúvida que talvez não tenha nada ver com isso… Utilizando Next13, eu preciso configurar o React-Router-Dom, criar as rotas e links, como eu gerencio a criação rotas a respeito do Lazy carremento conforme o usuario deseja… ou seja como eu organizo as minhas rotas da mesmo forma que faço normalmente?
Muito massa
Gus! Continua irmão! Eu estou vindo do php html css… e com esse seu conteúdo ficou um pouco mais fácil de entender o Java…
Eu fico perdido em como ficam as conexões com banco de dados…
Eu tô querendo aprender a construir um blog usando o Next…
Muitas dúvidas… perdido e consumindo muito conteúdo
Massa!!!
Nossa parabéns, enfim um canal para ensinar Next JS, atualizado..