12

Pelo que pude entender, as SPA (Single-Page Application) são basicamente páginas que não sofrem reload constante (por isso o nome, em tradução livre, "Aplicação de Página Única"), ou seja, alteram seu conteúdo de forma dinâmica pela interação do usuário, ao contrário de um site convencional, onde cada página com conteúdo diferente é carregada de forma individual.

Pesquisando sobre o assunto, vi informações de que sites grandes, como o YouTube, Gmail e Facebook utilizam tal recurso. Também percebi que quase tudo é tratado no lado cliente.

Por isso gostaria de saber quais as vantagens e desvantagens em usar uma SPA, em termos de segurança, SEO, manutenção, performance e o que puder acrescentar será de grande utilidade em termos de informação.

1
  • 1
    Se não é recarregado o tempo todo, os arquivos estáticos são carregados apenas uma vez cada. Porém, por ter apenas uma página é mais complicado, mas não impossível, tratar o SEO
    – Costamilam
    8/01/2019 às 11:10

1 Resposta 1

18

Vantagens

  • Uma das maiores vantagens, que engloba as outras, é a renderização ser no lado do cliente.
  • Há melhor experiência geral para o usuário, claro, desde que tudo bem feito, principalmente a latência até a renderização final é extremamente reduzida.
  • Há redução de tráfego até o servidor e isso obviamente é muito bom.
  • Especialmente partes que são sempre iguais simplesmente não trafegam mais.
  • Retira carga do servidor que tem muito o que fazer e pouca folga e procura economizar nele passando o trabalho pesado para o cliente que sempre tem muita folga, ajudando inclusive reduzir chances de ataques serem bem sucedidos.
  • Em tempos de portviews muito variáveis e até mesmo que muda no meio do caminho renderizar no lado do cliente é muito importante. Imagine cada mudança ter que ir ao servidor trazer toda página novamente.
  • Como está tudo lá monoliticamente é mais fácil controlar o estado entre os vários momentos da aplicação, quando envolve o HTTP não temos estado e temos que simular uma forma de controlar isso.
  • Se feito adequadamente, pode continuar funcionando algumas partes sem conexão.
  • Não pelo SPA em si, mas o fato da aplicação como um todo foi pensada para seu uso fica mais fácil usar a mesma aplicação para outros clientes.

Desvantagens

  • De forma geral é mais difícil fazer certo, quase tudo o que vemos por aí é cheio de problemas.
  • Especialmente é difícil codificar SPAs, difícil testar, monitorar, analisar, reformular, entender passagens de estado, detectar erros, pegar problemas de segurança, etc.
  • Abre mais buracos de segurança.
  • Você não tem controle sobre o que ocorre no cliente, e precisa mais cuidado com o que vem de lá, embora esse cuidado deveria ser absoluto sempre.
  • É bem mais difícil manter alguns estados, histórico, posição e outros controles que complicam justamente por manter estado ou porque o cliente não sabe como lidar já que ele foi preparado mais para lidar com várias páginas transacionadas, enfim, a navegação pode ser piorada.
  • Pode ser bem complicado manter bom SEO, por isso SPA funcionam melhor em aplicações, preferencialmente fechadas para usuários logados, e não para websites de conteúdo que precisam ser achados. Embora alguns achem que hoje isso não é problema, é fácil cair em situações que o conteúdo não é indexado, principalmente quando a pessoa quer fazer graça com o conteúdo e precisa de interação humana para ele aparecer. É possível resolver todas situações, mas com muito trabalho, muita dificuldade para saber se atendeu tudo e piorando a experiência para o usuário. Em geral não compensa, e quase ninguém sabe fazer certo, por isso é melhor considerar que o SEO será prejudicado sempre.
  • Precisa ter mecanismos quando cai em conteúdo que não é ponto de entrada do site, e isso não é tão simples, e quase sempre negligenciado.
  • Grande parte dos programadores web não entendem o meio e não conseguem produzir usabilidade adequada para algo mais complexo assim, e que ele precisa cuidar, e que não é fácil.
  • Se tiver uma mudança de versão no servidor precisa ter um mecanismo para o cliente saber disto e fazer a transição adequadamente. Não é simples fazer sem perdas, e quase ninguém faz, provavelmente nem tem consciência da necessidade disto.
  • Qualquer mudança de versão no browser ou uso diferente do normal pode causar mais problemas. Não é que seja livre se escolher renderizar no servidor, mas quanto mais você usa recursos modernos, mais abusa de JavaScript, mais complica o código ali, menos tem controle sobre a renderização exata. Lembrando que tem gente que não habilita JS ou mesmo usa um navegador capaz de executar isso. A manutenção pode se tornar um show de horrores, e tudo pra ontem, muito do trabalho é apagar incêndio que você não criou. Claro, muitos não fazem isso, até porque elas não tem mecanismos de controle se o cliente está funcionando e criam páginas que poucas pessoas usam, então passa tudo desapercebido. Por isso cada vez mais tem sites que não funcionam. Você entra em contato pra avisar que não funciona? Só se for fundamental para você. Em geral passa a vida toda sem funcionar.
  • O browser é uma plataforma muito pesada e ruim. Uma página rapidamente ocupa mais recursos que todo o Windows XP usa com várias aplicações rodando. E as pessoas reclamavam que o XP era pesado, agora tudo é lindo, vai entender a cabeça das pessoas... Se eu abandonar o uso de web (posso manter os sites simples, sem SPA) eu preciso de um computador com metade ou até 1/4 da capacidade. A aplicação não escala bem.
  • JavaScript não é uma linguagem criada para grandes aplicações e por isso não escala bem. No mínimo TypeScript deveria ser usado. Na verdade TS tem vários dos problemas do JS e por isso evitar o uso dessas linguagens pode trazer mais qualidade ao todo (ainda que isso também tenha suas implicações negativas). O desenvolvimento não escala bem.
  • A maioria das pessoas que trabalham com web não são programadores reais e não sabem como fazer aplicações complexas. Elas se viram bem com uma linguagem de script no servidor para entregar páginas simples renderizadas lá e eventualmente algum script no cliente para fazer uma firula, mas fazer uma aplicação completa em cima de um único documento é bem mais complicado e vemos show de horrores por aí. Parece que as pessoas se sentem mal em não fazer algo simples, elas querem fazer igual ao Facebook achando que eles são o Facebook, sem entender o quanto a rede social líder investe em talento para fazer funcionar.
  • Quando o SPA é usado no lugar de uma aplicação desktop ou mobile pode estar prejudicando a experiência do usuário de várias formas.
  • A carga inicial pode ser significativamente maior, o que pode espantar o internauta. Não só carga, há casos que a experiência é pior por latência mesmo, ou incrivelmente aumenta o acesso ao servidor. Tá cheio de página que responde mais lentamente com SPA. É sempre um problema de quem não sabe fazer, mas um problema que ocorre bastante.
  • É comum SPAs serem menos acessíveis para pessoas com necessidades especiais.
  • O pessoal quer fazer graça, abusa, parece irresistível colocar firulas desnecessárias.

Como curiosidade eu vejo muita gente falando que SPA é mais responsivo, e o termo é usado corretamente. O problema é que as pessoas também usam "responsivo" para diferenças de medidas do viewport. Esse termo nunca foi adequado e nesse momento vemos que eles tem dois problemas, além de não ter significado, ele é ambíguo com outra característica no mesmo contexto. Responsivo é isso: responder rápido; esqueça o outro uso, precisamos de outro termo para a adequação à tela.

Coloquei no GitHub para referência futura.

1
  • Por favor evitem longas discussões nos comentários; a conversa de vocês foi movida para o chat e pode prosseguir clicando no link
    – Square Obama
    25/08/2020 às 15:23

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .