Desempenho Móvel | Como fazer um site móvel amigável

Por que o desempenho móvel é importante?

A web está se tornando móvel. De acordo com a Statista, 51% das visualizações globais de páginas da web estão em dispositivos móveis. Em algumas regiões, como Ásia e África, o percentual é muito maior. Em cada caso, esse percentual cresce constantemente ano após ano.

Estatísticas de uso em dispositivos móveis e computadores em área de trabalho

Os principais mecanismos de pesquisa estão cientes dessa tendência, e é por isso que eles estão priorizando sites com tempos de carregamento de dispositivos móveis rápidos. Os usuários de dispositivos móveis podem ter largura de banda limitada, mas ainda querem encontrar informações rapidamente. Esses usuários tendem a ter menos paciência, o que significa altas taxas de rejeição para sites de carregamento lento. (‘Taxa de rejeição’ é a porcentagem de visitantes do site que deixam o site depois de visualizar apenas uma única página).

O Google e outras autoridades de velocidade do site determinaram que o tempo máximo de carregamento de um site para dispositivos móveis deve ser de aproximadamente três segundos. Após três segundos, a retenção de usuários cai drasticamente. Os mecanismos de pesquisa “punirão” os sites que são carregados lentamente, colocando-os mais abaixo nos resultados de pesquisa, principalmente para usuários móveis.

Um limite de tempo de carregamento de três segundos em uma conexão móvel não é muito tolerante, mas existem estratégias testadas e verdadeiras para manter os tempos de carregamento de dispositivos móveis baixos.

Portanto, não basta investir em qualquer agencia de criação de sites, caso contrário você pode estar entrando numa enrascada. Não adianta ter um site se ele é lento, certo?

Como melhorar o desempenho do celular

Há diversos fatores que afetam o desempenho de dispositivos móveis, portanto, várias estratégias e práticas recomendadas podem melhorar os tempos de carregamento.

– Minimizar o tamanho dos arquivos e a contagem de arquivos

Para garantir um tempo de carregamento mais rápido, todos os arquivos do site devem ser reduzidos o mínimo possível. As imagens geralmente são os maiores arquivos solicitados, e eles podem ser reduzidos usando otimizadores de imagem ou convertendo-os em um formato de imagem leve, como o SVG.

Os arquivos HTML, JavaScript e CSS também podem ser reduzidos por meio de minificação. Minificação de código significa retirar todo o espaço em branco e comentários do código e reestruturá-lo da maneira mais compacta possível. Isso reduzirá o tamanho do arquivo ao mínimo. Enquanto isso torna o código praticamente ilegível para um ser humano, um navegador da Web ainda será capaz de executar o código muito bem.

Além de criar tamanhos de arquivo menores, o número de arquivos gerais deve ser mantido no mínimo. Cada arquivo adicional necessário para carregar um site significa uma solicitação e uma resposta adicionais, e essas viagens de ida e volta contribuem para o tempo de carregamento. Sites com vários arquivos JavaScript e CSS devem consolidar todo o código JavaScript em um arquivo e fazer o mesmo com o CSS. Para páginas que exigem muito pouco JavaScript ou CSS, o uso de estilos embutidos * pode melhorar significativamente os tempos de carregamento.

* Normalmente, os desenvolvedores da web escrevem código HTML, JavaScript e CSS em arquivos diferentes. Usando uma técnica chamada ‘inline styles’, um desenvolvedor pode escrever seu código JavaScript e / ou CSS no mesmo arquivo que seu HTML.

-Cache recursos na borda

Normalmente, quando um usuário visita um site, o dispositivo do usuário precisa se comunicar com o servidor da Web para obter os arquivos do site. Se o servidor da Web estiver em São Francisco e o usuário estiver em Berkeley (a 10 km de distância), isso deve ser bem rápido. Mas e se o usuário estiver em Tóquio (5.000 milhas de distância)? Isso significa que cada solicitação e resposta terá que percorrer milhares de quilômetros, adicionando atraso significativo ao carregamento do site.

CDN Global

Uma maneira comum de atenuar esse problema é utilizando uma Content Delivery Network (CDN) . Uma CDN global armazena em cache o conteúdo na borda da rede . Isso significa que o CDN tem servidores de armazenamento em cache que residem em data centers em todo o mundo. Qualquer pessoa com acesso à Internet nunca está muito longe de um data center. Esses servidores de data center podem se comunicar com servidores da Web de origem para armazenar em cache os dados do site, de modo que os usuários que visitam um site que utiliza o CDN possam obter arquivos de sites de seu data center local. Isso garante um tempo de resposta de solicitação rápido para os usuários, independentemente de sua localização.

-Cache chamadas de API

Chamadas de API são solicitações HTTP para buscar dados de recursos externos. Por exemplo, um site de revisão de filmes como o Rotten Tomatoes pode fazer chamadas de API para um serviço de emissão de bilhetes como o Fandango, para que os usuários que estiverem navegando no Rotten Tomatoes possam ver os horários de exibição de filmes locais. Embora as chamadas de API possam ajudar a criar uma experiência robusta e reduzir o trabalho redundante, elas também criam novas solicitações HTTP, o que pode reduzir o tempo de carregamento.

Chamadas de API podem ser armazenadas em cache para minimizar essas solicitações HTTP extras. Em nosso exemplo de showtime do filme acima, Rotten Tomatoes só precisa buscar os horários de exibição de filmes de Los Angeles uma vez por dia. Eles podem configurar seu site para armazenar em cache essa chamada da API uma vez por dia. Dessa forma, se 10.000 usuários de Los Angeles visitarem o Rotten Tomatoes todos os dias, apenas o primeiro desses usuários terá que esperar pela chamada da API para o Fandango.

Priorize o conteúdo visível

O que um usuário vê imediatamente ao carregar uma página da Web costuma ser a ponta do iceberg; eles devem rolar para baixo para ver o resto da página. O conteúdo que aparece na tela de um usuário antes de qualquer rolagem ocorrer é chamado de conteúdo “acima da dobra”. Os desenvolvedores da Web devem escrever código de maneira que o conteúdo acima da dobra seja sempre carregado primeiro. Uma técnica para conseguir isso é chamada de carregamento lento, que funciona carregando dinamicamente o conteúdo abaixo da dobra conforme o usuário rola a página.

-Evite redirecionamentos

Por vários motivos, alguns sites criam redirecionamentos nos carregamentos de página. Por exemplo, redirecionamentos 301 são comumente usados ​​em sites renomeados ou renomeados. Essa prática deve ser evitada sempre que possível, pois os redirecionamentos consomem tempo precioso de carregamento.

Resumo

A navegação móvel assume a Web, torna-se cada vez mais importante ter um site para dispositivos móveis de alto desempenho. Sites móveis rápidos são recompensados ​​com maior engajamento e melhores taxas de conversão, além de um aumento de SEO. Os proprietários de sites devem implementar algumas ou todas as estratégias descritas acima para colher esses benefícios.

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *