Quem nunca brincou com o autocompletar do Google? Recentemente estive fazendo uma pesquisa com a pesquisa “porque o(s)”, juntando com vários substantivos.

Como por exemplo “porque os americanos”1Porque são mais bonitos? Sério?
Bem, no meu ponto de vista não são mais bonitos, e sim mais ricos.. Em uma dessas, me deparei com o Facebook:

Tentando ver algum padrão, procurei pelo Twitter:

Podemos ver alguns resultados parecidos, como “fica lento”, “trava”, “não funciona”, “parou”, logo fiquei curioso, e tentei aumentar a abrangência com outros temas:

Logo fui pro mais abrangente possível:

Para analisar isso, seria necessário antes definir o que é “ficar lento”.
Depois de algumas pesquisas2CARD, S. K.; ROBERTSON, G. G; MACKINLAY, J. D. The information visualizer: An information workspace.. Proc. ACM CHI’91 Conf., New Orleans, LA, p. 181-188, mai. 1.3MILLER, R. B. Response time in man-computer conversational transactions. Proc. AFIPS Fall Joint Computer Conference, San Francisco, CA, v. 33, p. 267-277, dez. 1.4NIELSEN, Jakob. Response times: the 3 important limits. Disponível em: <https://www.nngroup.com/articles/response-times-3-important-limits/>. Acesso em: 16 ago. 2017., constatei alguns “marcos” temporais importantes na experiência do usuário:

• 0,1 segundo, que é aproximadamente o limite de onde o usuário sente o sistema reagindo de forma instantânea.
• 1 segundo é aproximadamente o limite para que a linha de pensamento do usuário não seja interrompida, onde apesar de notar a “pausa”, não irá realmente incomodar o usuário5A não ser que as pausas fiquem frequentes.
• 10 segundos é o limite da “atenção” do usuário, ou seja, mais que isso o usuário percebe que realmente está demorando, e “resultados” de futuras interações são esperados (telas de carregamento ou exibição de alguma informação).

Tendo nossos marcos, vamos ás possíveis causas:

• Primeiro e mais importante, é a distância entre seu computador e o servidor6isso também passando pela longa rota já que não é exatamente linha reta. Hoje, o limite máximo é a velocidade da luz, o que significa que é impossível transmitir qualquer informação por exemplo de Sydney na Austrália para Londres na Inglaterra em um tempo menor que ~0,056 segundos, e já que o processo de carregamento de um website representa uma requisição e uma resposta, efetivamente dobrando o tempo.
• Hoje, sites não são somente o arquivo HTML,possuindo diversos arquivos estáticos como imagens, arquivos JavaScript e CSS, ou seja, são várias requisições, efetivamente uma para cada arquivo. O navegador possuí um limite no número de arquivos que ele busca em paralelo.7Uma solução seria unificar imagens similares em um arquivo só, e o mesmo pode ser feito com os arquivos CSS e JavaScript, que podem ser combinados e minificados.
• Um outro problema é que o próprio protocolo HTTP não suporta que uma única conexão busque vários arquivos em paralelo.
• Hoje muitos sites são HTTPS8O que é correto pois aumenta a segurança contra ataques do tipo “man in the middle“, o problema é que o SSL tem um processo longo de requisição, sendo necessário uma validação do certificado, utilizando mais da CPU quando enviando e recebendo informação.
• Outro problema é a sincronização desnecessária das aplicações Web. Faz um longo tempo que é possível que os desenvolvedores atualizem somente as porções dos sites que realmente precisam ser atualizadas, porém antigamente além de complicado de fazer o controle de estado, as ferramentas disponíveis ainda não ajudavam muito nesse controle.9Atualmente isso mudou, diversos frameworks JavaScript modernos criaram novas oportunidades nisso, por exemplo, o AngularJS
• Um problema grave também é a mal utilização dos recursos de cache, seja do servidor ou do próprio navegador. Entender o conceito de desenvolvimento e como a web funciona é bem fácil, porém utilizar corretamente os recursos de cache é relativamente complicado.
• Muitas aplicações ainda não utilizam uma CDN10Principalmente as públicas. Se todos utilizassem, os usuários teriam uma chance bem maior de ter os arquivos comuns como bibliotecas CSS e frameworks JavaScript já no cache do navegador.
• Outro problema são as estruturas complexas dos sites, ao utilizar o recurso “selectors” seja do CSS, ou de bibliotecas JavaScript como o JQuery, deixa a renderização do site bem lenta devido ao longo processamento necessário da estrutura.
• Diversos dos servidores atuais não entregam o conteúdo das respostas HTTP de forma comprimida, utilizando o GZip por exemplo.
• Muitos desenvolvedores não entendem as implicações de utilizar recursos lentos de terceiros. Sim, estou falando de você empresas de Analytics e Ad. Estes tipos de recurso quando lentos fazem com que o visitante ache que o carregamento está lento porém o site já pode ter carregado todos os recursos necessários e estão somente aguardando este.
• Muitos desenvolvedores utilizam recursos JavaScript quando não são realmente necessários. Hoje o CSS3 já permite algumas lógicas simples sem a utilização do mesmo.
• Porque estamos enviando cookies em diversos conteúdos que não precisam de cookies.
• Porque fazemos o HTML maior do que precisa realmente ser. A utilização correta das classes e hierarquias CSS, principalmente sua reutilização possibilita uma ótima redução do HTML final.
• Porque ainda utilizamos também imagens que poderiam muito bem ser um CSS11Essa aqui me incomoda bastante..