SPA

Single Page Applications

A idéia de um Single Page Application é carregar todos os elementos que devem ser apresentados ao usuário de uma só vez ou em pequenas partes incrementais.

Modelo Dinâmico "Tradicional"

Modelo Dinâmico "Tradicional"

Modelo SPA

Modelo SPA

Modelo SPA

Bacana, mas...

Como Faiz?

O estranho caso de onde estou

No modelo tradicional, a URL indica onde o usuário se encontra.

O usuario pode salvar a URL e retornar a mesma posição depois.

Se o conteúdo é lido por partes, perde-se a informação de posição.

Você sabia que...

É possível criar um link que pula pro meio da página?

...e mais adiante...



							

Ou HTML5:



							

Ou TUDO:



							

Mas o que acontece se fizer

... mas não tiver um id ou name "meio-da-pagina"?

... ao clicar, a URL fica


http://meuservidor/servico#usuario-1040
							

E quando a página carrega, a primeira coisa que se faz é verifica a URL inteira e fazer o parse do conteúdo.

Chato, né?

É por isso que para esses caso se usa um framework que já faça todo esse controle.

Angular.JS, por exemplo, tem todo um controle de rotas do lado do cliente (!!) que gera URLs do tipo


http://meuservidor/servico#/usuario/1040
							

BEEEM melhor, não?

Exemplo do Gmail: https://mail.google.com/mail/u/1/#all/14841018b0ce8bb1