Em primeiro lugar, você provavelmente já é um usuário regular de aplicações de Página Única (SPAs).aplicações de Página Única são uma ótima ferramenta para fazer experiências incrivelmente envolventes e únicas para seus usuários.alguns exemplos de Aplicação de uma única página são como Gmail, Google Maps, AirBNB, Netflix, Pinterest, Paypal, e muitos mais estão usando SPAs para construir uma experiência fluida e escalável.,
no entanto, no passado os SPAs deixaram os comerciantes no escuro quando se trata de gerir o conteúdo. Felizmente, agora é possível emparelhar seu SPA com o CMS direito para dar tanto desenvolvedores e comerciantes o nível de controle que eles precisam.
What’s Single Page Application?
aplicação de página única (SPA) é uma única página (daí o nome) onde muitas informações permanecem as mesmas e apenas algumas peças precisam ser atualizadas de cada vez.,
Por exemplo, quando você navega através do seu e – mail você vai notar que não há muitas alterações durante a navegação-a barra lateral e cabeçalho permanecem intocados à medida que você vai através da sua caixa de entrada.
O SPA apenas envia o que você precisa com cada clique, e seu navegador torna essa informação. Isto é diferente de uma carga de página tradicional onde o servidor rende uma página completa com cada clique que você faz e envia para o seu navegador.
esta peça por peça, o método do lado do cliente faz com que o tempo de carga tenha de ser mais rápido para os utilizadores e torna a quantidade de informação que um servidor tem de enviar muito menos e muito mais eficiente em termos de custos., Todos ganham.
o que é a arquitectura de Aplicação de uma única página? Como funciona?
a aplicação de página única é uma aplicação web ou site que interage com o usuário, reescrevendo dinamicamente a página atual, em vez de carregar páginas novas inteiras do servidor.
Esta abordagem anula a interrupção da experiência do Usuário entre páginas sucessivas, fazendo com que a aplicação se comporte mais como uma aplicação desktop.
na maioria dos sites há um monte de conteúdo repetitivo.,
alguns deles permanecem os mesmos não importa onde o usuário vai (cabeçalhos, rodapé, logotipos, barra de navegação, etc), alguns deles são constantes em apenas uma determinada seção (barras de filtro, banners), e há muitos layouts repetidos e modelos (blogs, auto-serviço, a configuração do google mail mencionado acima).
Aplicações de Página Única tirar vantagem desta repetição.digamos que a sua visão do site é uma pintura de uma casa e de uma árvore. Sites tradicionais e de várias páginas pintam todo o quadro para você no servidor e enviá-lo para o seu navegador.,
SPAs dá-lhe os guias de pintura por números para o site, incluindo os guias repetitivos que você provavelmente estará usando, e em seguida canaliza a tinta certa (dados e conteúdo) para preencher o modelo.
de qualquer forma você vê a mesma árvore, mas a velocidade do SPA vem quando você pede novo conteúdo – como clicando em “next”, filtrando resultados, abrindo um e – mail ou – nesta pequena metáfora-pedindo para ver uma árvore diferente.
numa página web tradicional o seu pedido de uma nova árvore faria com que o servidor pintasse a imagem inteira e a enviasse de volta.,
com uma única aplicação de página, o servidor diz: “Ei, eu tenho uma nova árvore para você, mas você já tem a casa, então deixe que o mesmo”, em seguida, envia instruções atualizadas para uma nova árvore e a pintura para fazê-lo.ao transferir o trabalho de pintura (renderização de página) do servidor para o cliente (você), a página pode ser reescrita dinamicamente, em vez de passar por uma recarga inteira.Isso torna as coisas muito mais rápidas.,vantagens para aplicações de Página Única há muitos benefícios para soluções SPA, tais como melhor desempenho e consistência da aplicação, e redução de tempo de desenvolvimento e custos de infraestrutura.ao separar a apresentação do conteúdo e dos dados, as equipas de desenvolvimento podem trabalhar a diferentes velocidades enquanto ainda estão integradas para a solução global. SPA é bom para fazer design responsivo para móveis, desktop e tablet.,
um ficheiro de tempo único carrega cada uma das aplicações HTML, CSS, JS
Página Única, após a carga inicial da página, o servidor não lhe envia mais HTML – você descarrega tudo no início.
o servidor envia-lhe uma página de shell e o seu navegador torna a interface de utilizador (UI).
em seguida, à medida que você clica, o SPA envia de volta os pedidos de dados e marcação, o servidor dispara de volta as matérias – primas necessárias, e o seu navegador pega-lo e torna uma atualizada UI-trocando peças sem nunca precisar atualizar a página completa.,esta rápida permutabilidade torna SPAs incrivelmente útil em páginas que são altamente navegadas e usam modelos repetitivos.
Sem acréscimo de Consultas para o Servidor
uma Vez que o servidor não precisa gastar tempo & energia, fazendo o total de desenho, SPAs diminuir o impacto sobre os servidores em geral – o que significa que você pode economizar dinheiro usando menos servidores para o mesmo volume de tráfego.
Front-end rápido e responsivo construído
juntamente com o tempo de desempenho mais rápido explicado acima, SPAs também permite que os desenvolvedores construir o front-end muito mais rápido.,isto é devido à arquitetura dissociada de SPAs, ou uma separação de Serviços back-end e front-end display.
muitas funcionalidades críticas de negócios não mudam muito no back-end.embora a forma como os seus clientes fazem login, registram, compram e track orders possam alterar a sua aparência ou apresentação de tempos em tempos, a lógica e a orquestração de dados por trás dela é bastante constante – e você não quer correr o risco de estragar tudo.
da mesma forma, o seu conteúdo bruto e os dados podem permanecer os mesmos, mas a forma como deseja mostrá-lo difere.,
by decoupling that back-end logic & data from how it’s presented you turn it into a” service”, and developers can build many different front-end ways to show and use that service.
com uma configuração dissociada, os desenvolvedores podem construir, implantar e experimentar com o front-end completamente independentemente da tecnologia back-end subjacente.eles projetam como eles querem que a experiência do Usuário para olhar e sentir, e, em seguida, puxar o Conteúdo, dados e funcionalidade através desses serviços.,isto é feito usando APIs, que são um conjunto padrão de regras entre aplicações sobre como elas irão estruturar, trocar e remontar dados.
Esta configuração da API permite que os desenvolvedores trabalhem rapidamente na IU, sem risco para as tecnologias de back-end críticas.
experiências de usuário aprimoradas
À medida que mais e mais funcionalidades são construídas como serviços modulares (uma arquitetura de microservice) que podem ser atualizadas de forma independente, torna-se mais fácil experimentar como elas são exibidas e usadas.,os frameworks SPAs são ótimos para brincar com esses serviços para criar experiências envolventes, dinâmicas e até animadas do Usuário.
também, muitas pessoas simplesmente gostam de desenvolver em uma determinada linguagem de programação (muitos frameworks SPA usam javascript) e, graças ao APIs, os SPAs que você constrói em uma única linguagem podem trabalhar felizes com serviços back-end desenvolvidos em diferentes linguagens.
aplicação de uma Página Única com Angular vs reacção vs Ember vs Vue?,
Angular e reate (e muitos outros como Ember e Vue) são frameworks que os desenvolvedores usam para criar SPAs de forma eficiente e eloquente.
simply put, these frameworks are a collection of reusable components, that many developers have contributed to, that follow a defined set of building rules.se você pensar nisso como construir uma casa, você pode misturar a argila, secar os tijolos, a mina e moldar o aço você mesmo-ou você pode usar os tijolos e canos que outras pessoas já projetaram e focar seu tempo no que faz sua casa única.,
Quanto às diferenças entre todos eles, eu não sou especialista (mas este cara parece ser), mas uma grande coisa sobre SPAs e os frameworks que os suportam é que, graças ao APIs, com as integrações certas você pode usar qualquer framework que você preferir com suas outras tecnologias API-habilitado.
por que as aplicações de Página Única e CMSs foram historicamente um emparelhamento difícil
ao usar SPAs, os desenvolvedores podem pensar na experiência como um” app”, mas o visitante ainda vai pensar nele como uma página web, e onde há uma página web há uma equipe de marketing ansioso para otimizá-lo.,porque SPAs são aplicativos que requerem trabalho de desenvolvimento para refinar com o display & entrega da experiência, os comerciantes estão tendo que voltar para a idade da pedra digital (também conhecida como os anos 90) e pedir ajuda para o desenvolvimento para cada ajuste causador de estrangulamentos inevitáveis.
removeu as ferramentas de edição Marketers são usados para
as funcionalidades de edição do CMS que as equipas de marketing dependem (live preview, drag-and-drop, WYSIWYG editing, etc) são normalmente ligadas ao nível de entrega no CMS.,
com SPAs, a entrega é determinada pelo SPA e o conteúdo é simplesmente armazenado no CMS de forma padrão que a APIs pode ler. Como o SPA é renderizado no front-end, o CMS back-end não tem idéia do que ele deve parecer e, portanto, não pode rodar uma prévia.assim, os usuários do CMS acabam ficando presos com uma abordagem muito datada – preencha um formulário, cruze os dedos, pressione publicar, e vá ver como ele se parece ao vivo.
para voltar ao nosso exemplo de pintura por números, o CMS armazena o conteúdo bruto (a tinta) e o SPA tem o Guia de pintura por números de como esse conteúdo deve ser visto., A antevisão não tem este guia, então não pode descobrir como o conteúdo deve ser.
This is a pure “headless” delivery of content (aka, it doesn’t have the CMS delivery tier as a “head”). É ótimo para se desenvolver rapidamente, mas um pouco difícil para os comerciantes que querem mudar o site por conta própria, sem ter que codificar.
ao lado disso, os profissionais de marketing estão acostumados a pensar nas coisas em ‘páginas’, mas porque um SPA é, bem, uma única página que o edifício da página e recursos de edição de marketing precisam não estão disponíveis.,se eles querem uma nova “página” (uma “rota” em um SPA), ou querem que a vista olhe de forma diferente, eles têm que perguntar a um desenvolvedor.
tornou difícil para reutilização de conteúdo
Este problema vem de duas razões principais, um com antiquado CMSs e outra de um SPA de design.
Em primeiro lugar, existem certos CMSs onde simplesmente não há um des-acoplamento de como o seu conteúdo parece e como ele é armazenado.,porque o armazenamento de conteúdo não está em um formato padrão, apresentação neutra o SPA não pode usá-lo na maneira baseada na API é o que quer.
isto não é apenas um problema quando se usa SPAs, é claro, este tipo de CMS configurado torna impossível reutilizar conteúdo através de canais em geral.porque o conteúdo Está ligado à forma como é exibido( um sistema baseado em página), as FAQs que você coloca em seu site não podem apenas ser tocadas para alguém para passar em seu relógio inteligente – você teria que armazenar o mesmo conteúdo de duas maneiras diferentes.,
SPA precisa de um CMS baseado em conteúdo para funcionar corretamente, de modo que ele pode puxar o conteúdo bruto e exibi-lo como quiser.
no lado SPA, A dificuldade vem do fato de que muitos sites vão ser uma configuração híbrida.embora você possa querer algumas partes como um SPA, você pode querer outros criados da maneira tradicional (muitas vezes melhor para SEO), e precisa haver uma sensação coesa entre estes.se a sua configuração for dois baldes de conteúdo, Peças para o site tradicional e o SPA, essa coesão vai quebrar., Você precisa de conteúdo que funcione através de tudo.
difícil com personalização / relevância
SPAs agarrar o conteúdo de uma forma “Serviço”, de modo que é uma pequena pepita de conteúdo sem muito contexto – Não uma grande ajuda na entrega relevante.em cima disso, muitos CMSs fazem sua personalização com base em qualquer página (não útil em um SPA), ou no lado do cliente-e essas regras de personalização javascript não jogam muito bem no topo do JavaScript SPA. Há demasiados cozinheiros na cozinha de personalização.os comerciantes estão condenados para sempre num mundo de SPA?claro que não!, Você simplesmente precisa de um CMS que tenha uma arquitetura pronta para uso em SPA.
One that is API-based, decouples content from presentation, can work with the SPA to provide a live preview & editing tools, supports a hybrid setup, and does personalization on the server side.In below parts i’ll walk you through the way Bloomreach does just that.
-
How Bloomreach offers Single Page Application Ease for Developers and Marketers
-
Personalization and Hybrid Support for Single Page Applications