O documento fornece 5 dicas para melhorar o desempenho de aplicações web, começando com separar componentes em subdomínios distintos para carregamento paralelo, carregamento tardio de scripts JavaScript para evitar bloqueios, manter conexões HTTP abertas com keep-alive, abusar de cabeçalhos de expiração para cache e uso de CDNs para distribuição de conteúdo.
2. Cleber Dantas
• 8+ anos de experiência na área de TI
• Especialista em desenvolvimento Web
• Responsável pela área técnica do grupo Minha
Vida
• Ministro treinamentos sobre desenvolvimento
Web
• Dou algumas palestras em eventos de tecnologia
• @cleberdantas
• http://www.cleberdantas.com
4. 1ª dica: Separe componentes em subdomínios distintos
• Motivos
– Carregamento de componentes em paralelo
– Fácil gerenciamento de canal de entrega do conteúdo
– Cookie-free domains
(http://www.cleberdantas.com/2011/11/cuidado-
com-os-cookies-cookie-free-domains/)
5. 2ª dica: Carregamento tardio/assíncrono de js
• Motivos
– Renderização bloqueada pelo browser
– Se não vai usar imediatamente o script para que
baixa-lo? ora pois...
• Ferramentas
– Labjs (http://labjs.com/)
– ControlJS (http://stevesouders.com/controljs/)
6. 3ª dica: Keep-alive sempre ligado
• Motivos
– Para cada requisição HTTP uma conexão TCP precisa
ser estabelecida
– Three-way handshake a todo momento é
desnecessário
7. 3ª dica: Keep-alive sempre ligado
Visão das requisições HTTP
Visão das conexões TCP
8. 4ª dica: Abuse dos cabeçalhos de expiração de conteúdo
• Motivos
– Cacher é bom truste me
– Visualizações futuras bem mais rápidas (afinal não é
preciso buscar componentes ainda “frescos”)
– Na dúvida cachear tudo (e ter um bom esquema pra
forçar a atualização caso necessário)
• Expires ou Cache-Control?
– Os dois (só pra garantir), mas entenda a diferença.
9. 5ª dica: Use uma CDN (Ou construa a sua... E me avise)
• Content Delivery Network
– Rede de distribuição de conteúdo
– Infraestrutura para ENTREGA do conteúdo
• Própria
• Terceirizada (Akamai, Ananke, UOL, etc)
• Pública (Microsoft, Google, etc)
– Distribuição de bibliotecas públicas (exemplo jQuery)
» http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.js
• http://www.cleberdantas.com/2011/11/content-
delivery-network-cdn-voce-ainda-vai-usar-uma/
10. 5ª dica: Use uma CDN (Ou construa a sua... E me avise)
http://ajax.aspnetcdn.com/ajax/jquery/jquery-1.5.1.min.js