LABjs e JQuery Templates

1,889 views

Published on

LABjs e JQuery Templates

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,889
On SlideShare
0
From Embeds
0
Number of Embeds
825
Actions
Shares
0
Downloads
5
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

LABjs e JQuery Templates

  1. 1. Cleber Dantas @cleberdantas http://www.cleberdantas.com
  2. 2. Agenda • LABjs • JQuery Templates
  3. 3. Front-End  Steve Sounders – “80% dos problemas de performance de aplicações Web estão no Front-end”  YSlow – Extensão do Firefox para análise de performance nas páginas – baseado nas 14 regras do livro High Performance Web Sites (existem outros templates)
  4. 4. Front-End  Regra 1: Minimize HTTP Requests  Regra 2: Use CDN´s (Content Delivery Network)  Regra 3: Use “Expires Header“  Regra 4: Utilize Gzip  Regra 5: Mova CSS para o topo  Regra 6: Mova scripts para baixo  Regra 7: Evite expressões em CSS  Regra 8: ‘Inlined’ JavaScript e CSS  Regra 9: Minimize Domínios  Regra 10: Minimize JavaScript  Regra 11: Evite Redirecionamentos  Regra 12: Remova Scritps Duplicados  Regra 13: Desabilite ETags  Regra 14: Cache AJAX
  5. 5. Carregamento assíncrono de Scripts  Com JQuery  $.getScript('@Url.Content("~/Scripts/math.js")')
  6. 6. Demo
  7. 7. LABjs  Carregamento assíncrono de scripts elegante  ~5KB <script> $LAB .script("framework.js").wait() .script("plugin.framework.js") .script("myplugin.framework.js").wait() .script("init.js").wait(); </script>
  8. 8. Demo
  9. 9. Ajax e JQuery Templates  Otimização do trafego de dados entre servidor e cliente (navegador)  Trafegar a menor quantidade possível de dados nas requisições  jQuery e JSON (JavaScript Object Notation) torna isso muito fácil  jQuery Templates (templates de HTML pré carregados nas páginas)
  10. 10. Demo
  11. 11. Links  http://labjs.com/  http://api.jquery.com/category/plugins/templates/  http://tecnologia.minhavida.com.br  http://www.cleberdantas.com

×