O que é renderização do lado do servidor (SSR)?

A renderização do lado do servidor (SSR) é o processo pelo qual uma página web é gerada no servidor em resposta a uma solicitação do cliente. Em vez de enviar ao cliente um documento HTML vazio e um pacote de JavaScript para renderização posterior no navegador, o servidor cria um documento HTML completo com o conteúdo já inserido.

Vantagens do SSR:

• Otimização SEO: Os robôs de busca indexam mais facilmente o conteúdo, pois recebem um HTML pronto, em vez de JavaScript gerado dinamicamente.
• Tempo de primeira pintura (FCP): O usuário vê o conteúdo da página mais rapidamente, pois o servidor já forneceu um HTML pronto para ser exibido imediatamente pelo navegador.
• Desempenho em dispositivos de baixa potência: Consome menos recursos no dispositivo cliente, pois a maior parte do trabalho de geração da página é feita no servidor.
• Melhor interação em redes sociais: Ao compartilhar, as redes sociais recebem um conteúdo pronto para visualização, em vez de uma página vazia.

Desvantagens do SSR:

• Aumento da carga no servidor: O servidor precisa processar as solicitações de renderização de cada página, o que pode ser custoso em recursos.
• Redução da interatividade até a hidratação: Após receber o HTML, o navegador precisa de tempo para "hidratar" — vincular a lógica JavaScript ao DOM já exibido. Até a conclusão da hidratação, a página pode estar parcialmente ou totalmente não interativa.
• Complexidade no desenvolvimento: Requer uma arquitetura específica de aplicação e frameworks especiais (por exemplo, Next.js para React, Nuxt.js para Vue.js, Angular Universal para Angular).

Com SSR, o cliente envia uma solicitação ao servidor, que a processa, gera uma cadeia HTML com o conteúdo e a estrutura prontos, e a envia de volta ao cliente. O navegador exibe o HTML recebido e, em seguida, carrega e executa o JavaScript do cliente para adicionar interatividade (processo de hidratação).