A web é um ambiente inquieto. Desenvolvedores lutam para enxugar suas aplicações na tentativa de manter ligados aos seus smartphones usuários com mais dificuldade de concentração do que um peixinho dourado, tanto no Front-End quanto no Back-End.
A velocidade de apresentação de conteúdo é um fator determinante, seja na leitura de artigos em blogs ou em decisões de compras online. Junte a isso nossa 88ª colocação no ranking mundial de velocidade de conexão, com meros 3,2 Mbps nos dispositivos móveis e arquiteturas mais eficientes e enxutas tomam uma importância ainda maior.
Foi pensando em melhorar a navegação de seus usuários que a Google desenvolveu o Projeto AMP, uma iniciativa Open Source que promete acelerar em até 85% o carregamento de páginas, desde jornais renomados como o The New York Times a postagens em plataformas como LinkedIn, Medium, WordPress e até suporte a vídeos como Vimeo e YouTube.
A lista de adeptos já conta com mais de 250 participantes de peso e 640.000 páginas, e as atualizações mais recentes do padrão atraem ainda mais usuários.
Você confere em mais detalhes como o AMP entrega o que promete e como você pode disponibilizar seu conteúdo em um piscar de olhos nesse post especial.
Acelerando Páginas Mobile
Lutando contra pesados scripts de análises de dados, propagandas automáticas e efeitos visuais extravagantes, o AMP é uma nova arquitetura HTML que busca dar todo enfoque ao conteúdo, ao mesmo tempo que fornece uma experiência de navegação simplificada, mas funcional e extremamente rápida.
Na prática, o que muda é a nova declaração <html ⚡> (ou <html amp>) no cabeçalho dos documentos, o uso de uma biblioteca JavaScript padronizada (o AMP JS) além de uma série de otimizações para minimizar o tempo de abertura de novas páginas.
Todos os scripts são carregados de maneira assíncrona, o que previne que seu carregamento impeça a renderização dos textos, e o navegador sabe a priori o tamanho de todos os elementos visuais do layout. Mesmo antes de baixar as imagens, a página pode ser montada com os espaçamentos corretos e com o texto completamente carregado, o que acelera a experiência de leitura, evitando scrolls indesejados.
É possível adicionar scripts de terceiros como propagandas e botões de compartilhamento através de iframes encapsulados, para evitar bloqueios no carregamento do conteúdo principal.O padrão também impõe certas restrições como o tamanho do CSS (50KB) e que o layout completo com as fontes seja carregado em uma única requisição HTTP.
Mas a cereja do bolo fica por conta da pré-renderização, recurso que inicia o carregamento das páginas logo na busca, baixando apenas o essencial (ou a primeira janela que o usuário consegue ler, de cada resultado), fazendo com que ao acessar o artigo, ele apareça instantaneamente.
Combinado ao novo AMP Cache da Google, o AMP entrega um carregamento ultra-rápido, que tem caído nas graças de empresas mesmo fora do mercado editorial, como o eBay, e em breve, passará a incluir outros segmentos como viagens e comércio eletrônico.
Começando com AMP
Por se tratar de um modelo baseado em HTML, criar ou adaptar páginas para o AMP não é difícil. A última versão do projeto lançada em Agosto ainda permite suporte a algumas ferramentas de Analytics e Login. Na documentação, um guia completo ensina passo a passo a criação dos primeiros códigos, que podem ser testados localmente sem a necessidade de pré-processadores.
Além disso, ferramentas de desenvolvimento na própria biblioteca do projeto permitem que o usuário verifique todos os requisitos e valide a página pela adição da tag #development=1 ao final da URL. Eventuais erros ou funcionalidades não permitidas serão listadas no console, o que facilita a depuração e a adaptação de páginas antigas.
Para usuários de CMS como WordPress ou Drupal, módulos prontos tornam a transição para o novo modelo ainda mais simples, em poucos cliques é possível obter páginas mobile-friendly com o sufixo /amp/, além das versões completas para desktops e notebooks.
Apesar de a adoção do padrão (ainda) não ser levada em conta em algoritmos de SEO, a recomendação geral é ficar em dia com os lançamentos implementando páginas em AMP quando possível, deixando seus sistemas preparados para uma possível alteração futura do rankeamento, além de oferecer uma melhor experiência para os usuários desde agora, o que pode influenciar na relevância de suas publicações.
Aprendizado que vai além
No final, AMPs são apenas páginas da web comuns e simplificadas que implementam otimizações em sua arquitetura para acelerar o carregamento, especialmente em dispositivos móveis.
A intenção não é competir com scripts otimizados, feitos-a-mão para aplicações específicas, mas sim propor um novo paradigma para que um número muito maior de páginas possa se beneficiar do carregamento instantâneo através de uma implementação simples, que coloca sempre os conteúdos em primeiro lugar, sejam artigos, produtos ou resenhas.
Mesmo que as capacidades das páginas enxutas ainda não permitam ou justifiquem uma adaptação, você ainda pode se beneficiar estudando a arquitetura do modelo e implementando alguns de seus fundamentos em sistemas mais complexos, e reduzir em alguns bons segundos o carregamento de suas páginas.
Você já se deparou com alguma página AMP? Acha que o tempo de carregamento é relevante para os resultados do seu negócio ou empresa? Quais funcionalidades você gostaria de ver nas páginas enxutas? Deixe seu comentário e siga o nosso blog para novidades em desenvolvimento.
5 melhores linguagens de programação para Android
Redação GeekHunter
Marco King