performance e otimização (e servidores web)
Post on 05-Dec-2014
1.140 Views
Preview:
DESCRIPTION
TRANSCRIPT
Performance e Otimização(e servidores web)
JoomlaDay São Paulo 2013Paulino Michelazzo
por quê WPO?web performance optimization
43%
57%
3 sec> 3 sec
57% dos visitantes de
sites de viagens saem após 3
segundos 25% mobile
1 segundo é...
- 11%pageviews
- 7%conversões
- 16%satisfação
1.6 bilhões de dólares em vendas anuais
25% de acréscimo em pageviews7 a 12% aumento nas vendas50% de redução de hardware
definindo performance
é lento ou está lento?
O Joomla é lento?
Não!Desenvolvedores e designers o tornam lento
1ª regra
definir se o website é lento ou se está lento
o que é lento?
aquilo que impacta na conversão de usuários
14% 86%
backend frontend
10.91.6
Top 300K
80 a 90% das lesmas estão no front-end
Mate-as antes
2ª regra
80 ~ 90% no Joomla!
template
• Arquivos JavaScript
• Arquivos CSS
• Imagens
• Requisições HTTP
• DNS Lookup’s
JavaScript
• Colocá-los no fim do código
• Minificar arquivos
• Carregar arquivos externos assincronamente
• Combinar arquivos
Carga assíncrona
var script = document.createElement('script'), scripts = document.getElementsByTagName('script')[0];script.async = true;script.src = url;scripts.parentNode.insertBefore(script, scripts);
FiF - frame in frame(function() { var url = 'http://example.org/js.js'; var iframe = document.createElement('iframe'); (iframe.frameElement || iframe).style.cssText = "width: 0; height: 0; border: 0"; iframe.src = "javascript:false"; var where = document.getElementsByTagName('script')[0]; where.parentNode.insertBefore(iframe, where); var doc = iframe.contentWindow.document; doc.open().write('<body onload="'+ 'var js = document.createElement(\'script\');'+ 'js.src = \''+ url +'\';'+ 'document.body.appendChild(js);">'); doc.close();}());
https://www.facebook.com/note.php?note_id=10151176218703920
CSS
• Colocá-los no início do código
• Minificar arquivos
• Fugir de @import
• Combinar arquivos
98k 25k
73k
Imagens
53k 1.9k51.1k
97%
Imagens
Imagens
• JPG
• Progressivas
• Qualidade
• PNG
• Indexadas
DPI não se usa em monitor!!!
requisições HTTP
• Não fazer
• Não fazer
• Precisa fazer, reduza
• (menos css, menos js, menos imagens)
DNS Lookup’s
• Reduza
• Reduza
• Precisa mesmo? Traga para mais perto(perto = dentro)
3ª regra
10 e 20% = rede e servidor
difícil, mas não impossível
tempo para 1º byte
DNS lookup
Conexão inicial
Tempo de espera
cache
• APC - Alternative PHP Cache
• cache de código PHP
• Memcached
• cache banco e código
• Varnish
• cache não-autenticado
verdades, meias verdades e mentiras
aquilo que nunca contaram para você
vários arquivos pequenos é melhor que
um enorme
Mentira
• + requisições = mais tempo
• Tempo de download menor
• Técnicas de compressão e minificação
servidores no Brasil são melhores
Meia verdade (meinha mesmo)
• 1ª conexão pode ser maior ou menor, dependendo do TLD, rede, etc.
• 150ms podem valer a pena pela tranquilidade com suporte e custo menor.
• A otimização do frontend reduz a necessidade de hosting fora.
template responsivo serve para mobile
Renan Calheiros (aquela mentira!)
• Reponsividade é paliativo.
• Menor performance e pouco uso das funcionalidades de mobile.
• Quer/precisa de velocidade no mobile, faça um site para mobile.
performance começa no servidor
Mentira
• Performance começa no projeto do website.
• Estudo das melhores extensões, módulos e templates.
• Codificação consciente com meta na melhor performance.
otimização de performace é complicada
Verdade
• Possui regras simples mas...
• Tem-se alguma dificuldade para implementação
• Requer conhecimento multidisciplinar na maioria dos casos
performance não é importante
Fale isso para sua namorada, noiva, esposa,
amante...
Last words
• Otimização é trabalhosa(mas o resultado vale a pena)
• Otimização é experiência(combinar ingredientes e cenários)
• Serviços de otimização de performance
• Configurações de servidores de alto desempenho
• Projetos especiais
• Cursos e treinamentos
www.sitelento.com.br
obrigado
Paulino Michelazzo
about.me/pmichelazzo
top related