É importante entender como é usar seu app ou site quando a conectividade é ruim ou não confiável e criar de acordo com isso. Há várias ferramentas que podem ajudar você.
Teste com baixa largura de banda e alta latência
Uma proporção crescente de pessoas usa a Web em dispositivos móveis. Mesmo em casa, muitas pessoas estão mudando da banda larga fixa para os dispositivos móveis.
Nesse contexto, é importante entender como é o uso do seu app ou site quando a conectividade é ruim ou não confiável. Várias ferramentas de software podem ajudar a emular e simular baixa largura de banda e alta latência.
Emular limitação de rede
Ao criar ou atualizar um site, você precisa garantir um desempenho adequado em diversas condições de conectividade. Várias ferramentas podem ajudar.
Ferramentas do navegador
O Chrome DevTools permite testar seu site com várias velocidades de upload/download e tempos de ida e volta, usando predefinições ou configurações personalizadas no painel "Rede". Consulte Começar a analisar o desempenho da rede para aprender os princípios básicos.
Ferramentas do sistema
O Network Link Conditioner é um painel de preferências disponível no Mac quando você instala o Hardware IO Tools para Xcode:
Emulação de dispositivo
O Android Emulator permite que você simule várias condições de rede durante a execução de apps no Android, incluindo navegadores da Web e apps da Web híbridos:
No iPhone, o Network Link Conditioner pode ser usado para simular condições de rede deficientes (veja acima).
Testar em diferentes locais e redes
O desempenho da conectividade depende do local do servidor e do tipo de rede.
O WebPagetest é um serviço on-line que permite executar um conjunto de testes de desempenho no seu site usando várias redes e locais de host. Por exemplo, é possível testar seu site em um servidor na Índia, em uma rede 2G, ou por cabo de uma cidade nos EUA.
Selecione um local e, nas configurações avançadas, um tipo de conexão. É possível até mesmo automatizar os testes usando scripts (por exemplo, para fazer login em um site) ou as APIs RESTful. Isso ajuda a incluir testes de conectividade nos processos de build ou na geração de registros de desempenho.
O onde é compatível com proxy global via GeoEdge, e as regras personalizadas dele podem ser usadas para simular velocidades de modem:
Testar em uma rede prejudicada
Os proxies de software e hardware permitem emular condições problemáticas de rede móvel, como limitação de largura de banda, atraso de pacotes e perda aleatória de pacotes. Um proxy compartilhado ou uma rede comprometida pode permitir que uma equipe de desenvolvedores incorpore testes de rede reais ao fluxo de trabalho.
O Controle de tráfego aumentado (ATC, na sigla em inglês) do Facebook é um conjunto de aplicativos licenciados pelo BSD que pode ser usado para moldar o tráfego e emular condições de rede prejudicadas:
O Facebook até instituiu as Terças-feiras do 2G para ajudar a entender como as pessoas usam o produto com 2G. Às terças-feiras, os funcionários recebem um pop-up com a opção de simular uma conexão 2G.
O proxy HTTP/HTTPS Charles pode ser usado para ajustar a largura de banda e a latência. O Charles é um software comercial, mas há uma versão de avaliação sem custo financeiro disponível.
Acesse codewithchris.com para mais informações sobre o Charles.
Lide com conectividade não confiável e "lie-fi"
O que é "lie-fi"?
O termo lie-fi remonta a pelo menos 2008 (quando os smartphones tinham esta aparência) e se refere a uma conectividade que não é o que parece. O navegador se comporta como se tivesse conectividade quando, por qualquer motivo, não tem.
Uma conectividade mal interpretada pode resultar em uma experiência ruim, já que o navegador (ou o JavaScript) continua tentando recuperar recursos em vez de desistir e escolher um substituto adequado. Na verdade, o lie-fi pode ser pior do que o off-line. Pelo menos, se um dispositivo estiver definitivamente off-line, o JavaScript poderá tomar as medidas evasivas adequadas.
É provável que o ment-fi se torne um problema maior à medida que mais pessoas migram para dispositivos móveis e deixam de usar a banda larga fixa. Os dados recentes do Censo dos EUA mostram um abandono da banda larga fixa. O gráfico a seguir mostra o uso doméstico da Internet para dispositivos móveis em 2015 em comparação com 2013:
Usar tempos limite para lidar com conectividade intermitente
No passado, métodos hackeados usando XHR foram usados para testar conectividade intermitente, mas o service worker permite métodos mais confiáveis para definir tempos limite de rede. Isso pode ser feito usando o Workbox com apenas algumas linhas de código:
workboxSW.router.registerRoute(
'/path/to/image',
workboxSW.strategies.networkFirst({networkTimeoutSeconds: 3}),
);
Saiba mais sobre o Workbox na palestra de Jeff Posnick na Conferência de Desenvolvedores do Chrome, Workbox: bibliotecas flexíveis de PWA.
A funcionalidade de tempo limite também está sendo desenvolvida para a API Fetch, e a API Streams deve ajudar otimizando a entrega de conteúdo e evitando solicitações monolíticas. Jake Archibald oferece mais detalhes sobre como lidar com a lie-fi em Supercharging page load.