É importante entender como é usar seu app ou site quando a conectividade é ruim ou instável e criar de acordo com isso. Há várias ferramentas que podem ajudar você.
Testar com baixa largura de banda e alta latência
Uma proporção cada vez maior de pessoas acessa a Web em dispositivos móveis. Mesmo em casa, muitas pessoas estão abandonando a banda larga fixa em favor da móvel.
Nesse contexto, é importante entender como é usar seu app ou site quando a conectividade é ruim ou instável. Uma variedade de ferramentas de software pode ajudar você a emular e simular baixa largura de banda e alta latência.
Emular limitação de rede
Ao criar ou atualizar um site, é preciso garantir um desempenho adequado em várias condições de conectividade. Várias ferramentas podem ajudar.
Ferramentas do navegador
O Chrome DevTools permite testar seu site com uma variedade de velocidades de upload/download e tempos de retorno, usando predefinições ou configurações personalizadas do painel Network. Consulte Primeiros passos com a análise de desempenho de rede para aprender o básico.
Ferramentas do sistema
O Network Link Conditioner é um painel de preferências disponível no Mac se você instalar as ferramentas de E/S de hardware para o Xcode:
Emulação de dispositivo
O Android Emulator permite simular várias condições de rede ao executar apps (incluindo navegadores da Web e apps da Web híbridos) no Android:
No iPhone, o Network Link Conditioner pode ser usado para simular condições de rede prejudicadas (veja acima).
Testar em diferentes locais e redes
O desempenho da conectividade depende da localização 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, você pode testar seu site em um servidor na Índia em uma rede 2G ou por cabo em uma cidade nos EUA.
Selecione um local e, nas configurações avançadas, escolha 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 em processos de build ou geração de registros de desempenho.
O Fiddler é 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 prejudicada pode permitir que uma equipe de desenvolvedores incorpore testes de rede reais ao fluxo de trabalho.
O Augmented Traffic Control (ATC) do Facebook é um conjunto de aplicativos licenciados pela BSD que podem ser usados para moldar o tráfego e emular condições de rede prejudicadas:
O Facebook até instituiu as Terças-feiras 2G para ajudar a entender como as pessoas usam o produto em uma conexão 2G. Às terças-feiras, os funcionários recebem um pop-up que oferece 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á um teste sem custo financeiro disponível.
Mais informações sobre o Charles estão disponíveis em codewithchris.com (em inglês).
Lidar 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 eram assim) e se refere a uma conectividade que não é o que parece. Seu navegador se comporta como se tivesse conectividade quando, por qualquer motivo, não tem.
A conectividade mal interpretada pode resultar em uma experiência ruim, já que o navegador (ou o JavaScript) persiste em tentar recuperar recursos em vez de desistir e escolher um substituto sensato. O Lie-Fi pode ser pior do que o modo off-line. Pelo menos, se um dispositivo estiver definitivamente off-line, o JavaScript poderá tomar as medidas necessárias.
O Lie-Fi provavelmente vai se tornar um problema maior à medida que mais pessoas migrarem para dispositivos móveis e se afastarem da banda larga fixa. Dados recentes do censo dos EUA mostram um afastamento da banda larga fixa. O gráfico a seguir mostra o uso da internet para dispositivos móveis em casa em 2015 em comparação com 2013:
Usar tempos limite para lidar com conectividade intermitente
No passado, métodos de hack usando XHR eram usados para testar a 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 no Chrome Dev Summit, Workbox: Flexible PWA Libraries.
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 dá mais detalhes sobre como lidar com o lie-fi em Supercharging page load (link em inglês).