Skip to content

Instantly share code, notes, and snippets.

@netojoaobatista
Created July 6, 2012 12:49
Show Gist options
  • Save netojoaobatista/3059996 to your computer and use it in GitHub Desktop.
Save netojoaobatista/3059996 to your computer and use it in GitHub Desktop.
Chat do hangout sobre Web Performance Optimization
Al3xsandro: http://vsarbranchingguide.codeplex.com/downloads/get/101549
Al3xsandro: https://docs.google.com/open?id=0B3TxkJ9ZFyzWUHFuUWE4TEtqTEE
Eduardo: é recente sim, teve um evento de otimização para web com o Steve Souders
Eduardo: aí eles fizeram uma promoção de ebooks dele
Eduardo: e lançaram esse aí
Eduardo: aproveitei e comprei
Eduardo: fica a disposição se alguém quiser
netojoaobatista: http://youtu.be/ZHZemt32SNw
junin: Bora pro youtube!
Miguel_Oliveira: http://www.youtube.com/watch?v=ZHZemt32SNw&feature=youtu.be
Guest34236: pow, vlw, mas no youtube eu tô assistindo. O do hang mesmo!
Al3xsandro: http://www.sultansofspeed.com/
Hicaro: esse tipo de experiencia e bem observado no instagram
Hicaro: observada*
Hicaro: GITHUB faz muito isso né?
netojoaobatista: github, twitter, facebook
- HiagoDrigo entrou na sala
millermedeiros: dividir requests em multiplos sub-dominios de forma fácil: http://www.phpied.com/simple-sharding-logic/
millermedeiros: regras do Yahoo: http://developer.yahoo.com/performance/rules.html
millermedeiros: esse link do yahoo cobre a maioria das coisas que estão sendo discutidas
Hicaro: Hj em dia vejo muitos falarem mais sobre UX para minimizar esse tempo perdido, certo que muito para apps nativos mas tambem para websites, justo por isso website/app
Jhon: vale falar do autoload do php... poe arquivos separados e carrega só o necessário
millermedeiros: http://imageoptim.com/
Hicaro: acho interessante esta tambem: http://www.smushit.com/ysmush.it/
Al3xsandro: http://www.jpegmini.com/
millermedeiros: esse image optim é pro mac mas as ferramentas que ele usa sao de linha de comando e funcionam em outros OS.
leobetosouza: https://github.com/globocom/thumbor/
Hicaro: Esta aqui http://yeoman.io/
Hicaro: muito bom, vi um video sendo integrado com o sublime text 2 hehehe muito bom mesmo
- ciro_nunes entrou na sala
millermedeiros: o build do HTML5-boilerplate tbm roda o jpegtran e optipng: http://html5boilerplate.com/docs/Build-script/
millermedeiros: alem de compactar tudo e concatenar o css/js
millermedeiros: o CDN do google: https://developers.google.com/speed/libraries/devguide
millermedeiros: e outras libs menos populares: http://cdnjs.com/
- Mauricio entrou na sala
- 00:40:25 -
millermedeiros: configs basicas de cache/etags para o apache: https://gist.github.com/2910118
millermedeiros: o HTML5-boilerplate tem configs bem melhores e mais robustas: https://github.com/h5bp/server-configs
MiguelOliveira: Eu não sei se vou ficar até o fim...
MiguelOliveira: esse chat depois tem como eu pegar? ver o que foi postado ?
leobetosouza: tem... depois o neto vai colocar as coisas na descricao do youtube
MiguelOliveira: Ah, beleza... valeu
millermedeiros: "There are only two hard things in Computer Science: cache invalidation and naming things." -- Phil Karlton.
Al3xsandro: List of HTTP header fields http://en.wikipedia.org/wiki/List_of_HTTP_header_fields
netojoaobatista: melhor que a wikipedia
netojoaobatista: é a própria especificação
netojoaobatista: http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html
millermedeiros: tamo seguindo essa lista: http://developer.yahoo.com/performance/rules.html - próximo tópico é gzip
HiagoDrigo: http://forum.imasters.com.br/
millermedeiros: http://yslow.org/
millermedeiros: http://www.html5rocks.com/en/tutorials/developertools/auditpanel/
millermedeiros: https://developers.google.com/speed/pagespeed/
Al3xsandro: YSlow para firefox https://addons.mozilla.org/pt-br/firefox/addon/yslow/
millermedeiros: dynaTrace: http://www.compuware.com/application-performance-management/ajax-performance-testing.html
millermedeiros: http://www.webpagetest.org/ (screenshots da renderização do site + waterfall)
Al3xsandro: https://developers.google.com/speed/pagespeed/ para firefox
Al3xsandro: e chorme
millermedeiros: https://developers.google.com/speed/pagespeed/insights
millermedeiros: configs basicas de cache/etags para o apache: https://gist.github.com/2910118
millermedeiros: o HTML5-boilerplate tem configs bem melhores e mais robustas: https://github.com/h5bp/server-configs
- testeteste desconectou (Quit: Page closed)
millermedeiros: várias otimizações automaticas: http://code.google.com/p/modpagespeed/
Hicaro: o gente vlw ai pelas aulas de hj hehe ^~ muito legal essa iniciativa, tenho q ir ja, até a proxima
millermedeiros: o htaccess do html5bp: https://github.com/h5bp/html5-boilerplate/blob/master/.htaccess
leobetosouza: htaccess do html5 boilerplate, eh o melhor q tem: https://github.com/h5bp/html5-boilerplate/blob/master/.htaccess
- andresantos entrou na sala
Giverny: leobetosouza, millermedeiros cara usa o nginx.conf e usa o nginx server
Giverny: tem no html5boilerplate tb um ex.
millermedeiros: http://mathiasbynens.be/demo/jquery-size
leobetosouza: mals, cara
leobetosouza: sou tao multitarefa assim nao hehe
Giverny: leobetosouza, =<
leobetosouza: entao, o boilerplate tem várias configs recomendadas pra vários servers diferentes
Giverny: leobetosouza, nery aqui pow to zoando aheuahe
millermedeiros: explicando os problemas: http://www.alistapart.com/articles/application-cache-is-a-douchebag/
millermedeiros: (do cache manifest)
Giverny: sim porque o CSS e interpretado netojoaobatista
Giverny: assim como o JS
Giverny: vai passar pelo proxy
MiguelOliveira: site de cantor sertanojo é cheio de imagem...
leobetosouza: http://www.stubbornella.org/content/2009/03/27/reflows-repaints-css-performance-making-your-javascript-slow/
millermedeiros: http://mathiasbynens.be/notes/async-analytics-snippet
Giverny: leobetosouza, e o melhor SO que existe cara
Giverny: Linux forever
Giverny: =<
netojoaobatista: Linux forever!
netojoaobatista: \m/
millermedeiros: http://code.google.com/p/modpagespeed/
Giverny: \,,,/
MiguelOliveira: Não está aparecendo no youtube
MiguelOliveira: a tela compartilhada
MiguelOliveira: =\ está aparecendo apenas na miniatura ,,,
- xuxuco entrou na sala
MiguelOliveira: Ah, não da para ver
MiguelOliveira: está apenas miniatura no youtube
Giverny: 2.6.37-ARCH
Giverny: meu kernel ta atrasado =<
- andresantos desconectou (Quit: Page closed)
millermedeiros: http://calendar.perfplanet.com/2011/why-inlining-everything-is-not-the-answer/
leobetosouza: http://www.stubbornella.org/content/2009/03/27/reflows-repaints-css-performance-making-your-javascript-slow/
Giverny: http://mathiasbynens.be/notes/async-analytics-snippet
Giverny: leobetosouza, olha ae
MiguelOliveira: de onde vocês estão seguindo esses temas?
Giverny: MiguelOliveira
MiguelOliveira: essa ordem que vocês estão abordando, está em algum link?
Al3xsandro: http://www.phpied.com/rendering-repaint-reflowrelayout-restyle/
leobetosouza: http://www.youtube.com/watch?v=I2MJiJxGQsY
Giverny: MiguelOliveira, http://youtu.be/ZHZemt32SNw
MiguelOliveira: Eu estou assistindo já... só queria saber se está em algum link a ordem dos assuntos abordados
netojoaobatista: http://www.youtube.com/watch?v=UJPdhx5zTaw
MiguelOliveira: está apenas o do leo em miniatura
MiguelOliveira: só está aparecendo o neto...
MiguelOliveira: no youtube
xuxuco: Com esse conhecimento, Wanderley conseguiu conquistar seu primeiro milhão antes de completar 30 anos.
MiguelOliveira: realmente, miler nem aparece na tela grande
MiguelOliveira: Faz tempo que a tela do léo não aparece antes... desde quando ele mostrou o site
MiguelOliveira: em javascript
Nery: netojoaobatista, fumando e bocejando
Nery: aheuha
netojoaobatista: hehehehe
MiguelOliveira: Bom, o final do vídeo ficará para eu assistir final de semana. Muito bom, vou rever ele novamente no inicio para pegar tudo que perdi :-)
Nery: tranquilidade MiguelOliveira
MiguelOliveira: Depois gostaria de todos os links postados aqui, obrigado galera e bom termino de houngout. Estão de parabéns!
millermedeiros: http://ejohn.org/blog/javascript-trie-performance-analysis/
Al3xsandro: Your Script Just Killed My Site https://www.youtube.com/watch?v=aHDNmTpqi7w
leobetosouza: ferramenta muito boa pra automatizar tarefas (como minify) em js: http://net.tutsplus.com/tutorials/javascript-ajax/meeting-grunt-the-build-tool-for-javascript/
leobetosouza: build script do html5 boilerplate, tb muito bom: http://html5boilerplate.com/docs/Build-script/
leobetosouza: projeto q o miller falou no inicio, q prometo facilitar a vida de todo mundo: http://yeoman.io/
millermedeiros: e o build do requirejs tbm minifica e junta os JS/CSS tudo: http://requirejs.org/docs/optimization.html
millermedeiros: a lista de links que eu fiz antes de começar o hangout: https://gist.github.com/3057782
millermedeiros: http://developer.yahoo.com/performance/rules.html
Al3xsandro: http://developer.yahoo.com/performance/rules.html
leobetosouza: millersegundos, sacou? kkkkkkkkkk
millermedeiros: :-D
millermedeiros: document.getElementsByTagName('*').length
millermedeiros: http://blog.millermedeiros.com/the-lost-art-of-delegating-click-events-on-the-iphone/
leobetosouza: http://updates.html5rocks.com/2012/04/Round-up-of-Web-Browser-Internals-Resources
millermedeiros: http://requirejs.org/docs/optimization.html#onecss
millermedeiros: http://calendar.perfplanet.com/2010/png-that-works/
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment