JQUERY CONF 2011                                           Kenji Yamamoto                                         Desenvol...
Pontos a destacar                                      Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezemb...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison                                             ...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Attributes and Properties in jQuery                                                 por Timmy Willison                    ...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    Como era processado o...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    Como era processado o...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    Como era processado o...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    Então, qual a diferen...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    Então, qual a diferen...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    Então, qual a diferen...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    O que mudou no jQuery...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    O que mudou no jQuery...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    O que mudou no jQuery...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    O que mudou no jQuery...
Attributes and Properties in jQuery    por Timmy Willison, membro do jQuery Core Team | @timmywil    O que mudou no jQuery...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison                                             ...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison                                             ...
Chrome Dev Tools: Tips and Tricks                                                  por Paul Irish                         ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Controle sobre o StyleShe...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Controle sobre o StyleShe...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Controle sobre o StyleShe...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Controle sobre o StyleShe...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Controle sobre o StyleShe...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Network                  ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Network    • Timeline: In...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Network    • Timeline: In...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Console API              ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Console API    • Existem ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Console API    • Existem ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Console API    • Existem ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging                ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Debugging    • Script “Pr...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Task Manager             ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Javascript APIs para moni...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Javascript APIs para moni...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Javascript APIs para moni...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Javascript APIs para moni...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Javascript APIs para moni...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Javascript APIs para moni...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Extenções para o DevTools...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Extenções para o DevTools...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Extenções para o DevTools...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Extenções para o DevTools...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Extenções para o DevTools...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Extenções para o DevTools...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Fica a dica !            ...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Fica a dica !    • Docume...
Chrome Dev Tools: Tips and Tricks    por Paul Irish, Chrome Developer at Google | @paul_irish    Fica a dica !    • Docume...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
jQuery 1.7 - Events                                         por Dave Methvin                                              ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Quais são as metas ?                ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Quais são as metas ?    • Simplificar...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Quais são as metas ?    • Simplificar...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Quais são as metas ?    • Simplificar...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Quais são as metas ?    • Simplificar...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Quais são as metas ?    • Simplificar...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Novos métodos .on() e .off()        ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Novos métodos .on() e .off()    • Un...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Novos métodos .on() e .off()    • Un...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Novos métodos .on() e .off()    • Un...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Novos métodos .on() e .off()    • Un...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios                          ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Benefícios    • Acaba com a confusão...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Event Delegation é legal, mas…      ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Event Delegation é legal, mas…    • ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Event Delegation é legal, mas…    • ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Event Delegation é legal, mas…    • ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    “Don’t Make Me Bubble” !            ...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Perfil do caso de teste com jQuery 1...
jQuery 1.7 - Events    por Dave Methvin, membro do jQuery Core Team | @davemethvin    Perfil do caso de teste com jQuery 1...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Progressive Enhancement 2.0                                           Because the Web isnt Print                          ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Progressive Enhancement 2.0 - Because the Web isnt Print    por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet ...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
Pontos a destacar        • Attributes e Properties no jQuery - Timmy Willison        • Chrome Dev Tools: Tips and Tricks -...
OBRIGADO                                                 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de deze...
OBRIGADO             Slides:                               contato:             http://bit.ly/gwt-kenji               cont...
Upcoming SlideShare
Loading in …5
×

[GWT] Kenji - Highlights do Jquery Conference

1,142 views

Published on

Será um espaço para compartilhar informações que foram destaques no jQuery Conference deste ano.
- Attributes e Properties no jQuery - Timmy Willison
- Chrome Dev Tools: Tips and Tricks - Paul Irish
- jQuery 1.7 - Events - Dave Methvin
- Progressive Enhancement 2.0 - Nicholas C. Zakas

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

No Downloads
Views
Total views
1,142
On SlideShare
0
From Embeds
0
Number of Embeds
15
Actions
Shares
0
Downloads
16
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

[GWT] Kenji - Highlights do Jquery Conference

  1. 1. JQUERY CONF 2011 Kenji Yamamoto Desenvolvedor Web @ Esporte1terça-feira, 20 de dezembro de 2011
  2. 2. Pontos a destacar Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  3. 3. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  4. 4. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  5. 5. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish • jQuery 1.7 - Events - Dave Methvin Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  6. 6. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish • jQuery 1.7 - Events - Dave Methvin • Progressive Enhancement 2.0 - Nicholas C. Zakas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  7. 7. Attributes and Properties in jQuery por Timmy Willison Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  8. 8. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil Como era processado o método .attr() Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  9. 9. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil Como era processado o método .attr() • Atributos e Propriedades são processados da mesma forma; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  10. 10. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil Como era processado o método .attr() • Atributos e Propriedades são processados da mesma forma; • Muitos bugs, com isso a manutenção ficou difícil de ser mantida. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  11. 11. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil Então, qual a diferença? Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  12. 12. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil Então, qual a diferença? <input class="foo"> // attribute <input id="bar"> // attribute $(input)[0].className // property $(#bar)[0].id // property Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  13. 13. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil Então, qual a diferença? <input class="foo"> // attribute <input id="bar"> // attribute $(input)[0].className // property $(#bar)[0].id // property Atributos estão no html, interpretados pelo browser para formar o DOM, e (geralmente) correspondem às propriedades. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  14. 14. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil O que mudou no jQuery 1.6? Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  15. 15. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil O que mudou no jQuery 1.6? • A propriedade .attr() foi reescrita Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  16. 16. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil O que mudou no jQuery 1.6? • A propriedade .attr() foi reescrita • Aumento significante na performance dos métodos .attr() e .val() Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  17. 17. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil O que mudou no jQuery 1.6? • A propriedade .attr() foi reescrita • Aumento significante na performance dos métodos .attr() e .val() • Inclusão dos métodos .prop() e .removeProp() Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  18. 18. Attributes and Properties in jQuery por Timmy Willison, membro do jQuery Core Team | @timmywil O que mudou no jQuery 1.6? • A propriedade .attr() foi reescrita • Aumento significante na performance dos métodos .attr() e .val() • Inclusão dos métodos .prop() e .removeProp() http://bit.ly/attr_prop Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  19. 19. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  20. 20. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  21. 21. Chrome Dev Tools: Tips and Tricks por Paul Irish Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  22. 22. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Controle sobre o StyleSheet Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  23. 23. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Controle sobre o StyleSheet • Manipulação rápida de cor; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  24. 24. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Controle sobre o StyleSheet • Manipulação rápida de cor; • Interpretação de CSS3 ; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  25. 25. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Controle sobre o StyleSheet • Manipulação rápida de cor; • Interpretação de CSS3 ; • Intervenção fácil no seletores via psuedo-classes. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  26. 26. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Controle sobre o StyleSheet • Manipulação rápida de cor; • Interpretação de CSS3 ; • Intervenção fácil no seletores via psuedo-classes. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  27. 27. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Network Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  28. 28. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Network • Timeline: Informações sobre tempo de renderização Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  29. 29. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Network • Timeline: Informações sobre tempo de renderização • Settings: Desabilitar Cache & outras configurações Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  30. 30. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Console API Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  31. 31. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Console API • Existem mais coisas do que apenas o console.log ! Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  32. 32. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Console API • Existem mais coisas do que apenas o console.log ! • Command Line API Ex.: dir(), inspect(), $0, $1 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  33. 33. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Console API • Existem mais coisas do que apenas o console.log ! • Command Line API Ex.: dir(), inspect(), $0, $1 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  34. 34. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  35. 35. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  36. 36. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  37. 37. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  38. 38. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! • Breakpoints no DOM Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  39. 39. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! • Breakpoints no DOM • Breakpoints nos Event Listeners Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  40. 40. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! • Breakpoints no DOM • Breakpoints nos Event Listeners • Edição live no JS Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  41. 41. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Debugging • Script “Pretty-Printing” ! • Breakpoints no DOM • Breakpoints nos Event Listeners • Edição live no JS • “No-refresh development™!” Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  42. 42. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Task Manager Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  43. 43. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Javascript APIs para monitoração Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  44. 44. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Javascript APIs para monitoração • performance.timing Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  45. 45. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Javascript APIs para monitoração • performance.timing • performance.memory Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  46. 46. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Javascript APIs para monitoração • performance.timing • performance.memory • window.onerror Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  47. 47. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Javascript APIs para monitoração • performance.timing • performance.memory • window.onerror • console.profile() / console.profiles[] Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  48. 48. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Javascript APIs para monitoração • performance.timing • performance.memory • window.onerror • console.profile() / console.profiles[] • console.timeStamp() Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  49. 49. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Extenções para o DevTools Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  50. 50. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Extenções para o DevTools • Painel customizado e Sidebars chrome.devtools.panels Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  51. 51. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Extenções para o DevTools • Painel customizado e Sidebars chrome.devtools.panels Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  52. 52. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Extenções para o DevTools • Painel customizado e Sidebars chrome.devtools.panels • Audits plugáveis chrome.devtools.audits Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  53. 53. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Extenções para o DevTools • Painel customizado e Sidebars chrome.devtools.panels • Audits plugáveis chrome.devtools.audits Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  54. 54. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Extenções para o DevTools • Painel customizado e Sidebars chrome.devtools.panels • Audits plugáveis chrome.devtools.audits • Ferramenta de desenvolvimento experimental para o Chrome API chrome.devtools.network Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  55. 55. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Fica a dica ! Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  56. 56. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Fica a dica ! • Documentação e alguns vídeos code.google.com/chrome/devtools Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  57. 57. Chrome Dev Tools: Tips and Tricks por Paul Irish, Chrome Developer at Google | @paul_irish Fica a dica ! • Documentação e alguns vídeos code.google.com/chrome/devtools • Customização do DevTools smus.com/devtools-cheatsheet Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  58. 58. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  59. 59. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  60. 60. jQuery 1.7 - Events por Dave Methvin Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  61. 61. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Quais são as metas ? Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  62. 62. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Quais são as metas ? • Simplificar a API; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  63. 63. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Quais são as metas ? • Simplificar a API; • Torná-la mais rápida; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  64. 64. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Quais são as metas ? • Simplificar a API; • Torná-la mais rápida; • Reduzir o tamanho total; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  65. 65. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Quais são as metas ? • Simplificar a API; • Torná-la mais rápida; • Reduzir o tamanho total; • Solucionar bugs existentes; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  66. 66. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Quais são as metas ? • Simplificar a API; • Torná-la mais rápida; • Reduzir o tamanho total; • Solucionar bugs existentes; • Não quebrar o que já está funcionando; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  67. 67. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Novos métodos .on() e .off() Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  68. 68. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Novos métodos .on() e .off() • Unificar eventos vinculados e delegados Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  69. 69. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Novos métodos .on() e .off() • Unificar eventos vinculados e delegados $().on(events, “selector”, data, handler); $().off(events, “selector”, handler); Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  70. 70. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Novos métodos .on() e .off() • Unificar eventos vinculados e delegados $().on(events, “selector”, data, handler); $().off(events, “selector”, handler); • Mapear eventos para retrocompatibilidade na API: Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  71. 71. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Novos métodos .on() e .off() • Unificar eventos vinculados e delegados $().on(events, “selector”, data, handler); $().off(events, “selector”, handler); • Mapear eventos para retrocompatibilidade na API: $(“a”).bind(“click change”, { mydata: 42 }, fn); $(“a”).on(“click change”, { mydata: 42 }, fn); $(“.box”).delegate(“a”, “click.myplugin”, fn); $(“.box”).on(“click.myplugin”, “a”, fn); $(“a”).live(“click”, fn); $(document).on(“click”, “a”, fn); Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  72. 72. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  73. 73. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  74. 74. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  75. 75. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); • Pronúncia consistente (ao contrário de live/die ) Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  76. 76. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); • Pronúncia consistente (ao contrário de live/die ) • Métodos encadeados com traversal/filter (ao contrário do live ) Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  77. 77. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); • Pronúncia consistente (ao contrário de live/die ) • Métodos encadeados com traversal/filter (ao contrário do live ) • A ordem dos argumentos é consistente (ao contrário do delegate ) Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  78. 78. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); • Pronúncia consistente (ao contrário de live/die ) • Métodos encadeados com traversal/filter (ao contrário do live ) • A ordem dos argumentos é consistente (ao contrário do delegate ) • Mais curto para digitar (off vs. undelegate ) Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  79. 79. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); • Pronúncia consistente (ao contrário de live/die ) • Métodos encadeados com traversal/filter (ao contrário do live ) • A ordem dos argumentos é consistente (ao contrário do delegate ) • Mais curto para digitar (off vs. undelegate ) • Nenhuma confusão com ECMAScript5 Function.bind Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  80. 80. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Benefícios • Acaba com a confusão sobre a interação entre as APIs de evento $(“a”).live(“click”, function(){ alert(“Hello”); }); $(document).unbind(“click”); // ‘live is now dead!’ $(document).on(“click”, “a”, function(){ alert(“Hello”); }); $(document).off(“click”); • Pronúncia consistente (ao contrário de live/die ) • Métodos encadeados com traversal/filter (ao contrário do live ) • A ordem dos argumentos é consistente (ao contrário do delegate ) • Mais curto para digitar (off vs. undelegate ) • Nenhuma confusão com ECMAScript5 Function.bind • Economia de 1,122 bytes removendo bind/live/delegate no jQuery 1.7 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  81. 81. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Event Delegation é legal, mas… Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  82. 82. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Event Delegation é legal, mas… • Um event handler não pode ser mudado depois que um event handler subseqüente for chamado, isso é chamado de .stopPropagation() .stopImmediatePropagation(); Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  83. 83. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Event Delegation é legal, mas… • Um event handler não pode ser mudado depois que um event handler subseqüente for chamado, isso é chamado de .stopPropagation() .stopImmediatePropagation(); • O jQuery deve igualar o seletor ao ponto de delegação; Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  84. 84. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Event Delegation é legal, mas… • Um event handler não pode ser mudado depois que um event handler subseqüente for chamado, isso é chamado de .stopPropagation() .stopImmediatePropagation(); • O jQuery deve igualar o seletor ao ponto de delegação; • Deve ser delegado evento para o elemento mais próximo possível. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  85. 85. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin “Don’t Make Me Bubble” ! Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  86. 86. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Perfil do caso de teste com jQuery 1.6.3: 15,1 segundos Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  87. 87. jQuery 1.7 - Events por Dave Methvin, membro do jQuery Core Team | @davemethvin Perfil do caso de teste com jQuery 1.7: 5.6 segundos Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  88. 88. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish • jQuery 1.7 - Events - Dave Methvin Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  89. 89. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish • jQuery 1.7 - Events - Dave Methvin Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  90. 90. Progressive Enhancement 2.0 Because the Web isnt Print por Nicholas C. Zakas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  91. 91. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Graceful Degradation Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  92. 92. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Graceful Degradation • Premissa: criar o melhor e mais completo produto possível, suportado pelos browsers mais novos, e a partir daí, as funcionalidades que não são suportadas pelos browsers ou devices simplesmente não são visualizadas. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  93. 93. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 1.0 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  94. 94. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 1.0 • Premissa: foco no conteúdo. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  95. 95. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 1.0 • Premissa: foco no conteúdo. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  96. 96. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 1.0 • Premissa: foco no conteúdo. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  97. 97. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 2.0 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  98. 98. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 2.0 Chrome Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  99. 99. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 2.0 Firefox Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  100. 100. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 2.0 Internet Explorer 9 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  101. 101. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 2.0 Internet Explorer 6 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  102. 102. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Progressive Enhancement 2.0 Netscape 4 Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  103. 103. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  104. 104. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos • Rounded Corners • Drag and Drop • Drop Shadows • Geolocation • Gradients • Cross-Domain Ajax • Transitions • Cross-Domain Messaging • Transforms • Client-Side Data Storage • Multiple Background Images • Canvas/WebGL Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  105. 105. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos • Rounded Corners • Drag and Drop • Drop Shadows • Geolocation • Gradients • Cross-Domain Ajax • Transitions • Cross-Domain Messaging • Transforms • Client-Side Data Storage • Multiple Background Images • Canvas/WebGL A melhor experiência possível, dada a capacidade do device. Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  106. 106. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Valores: Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  107. 107. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Valores: Maravilha ! OK OK Aí não né... valor esforço Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  108. 108. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  109. 109. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos • Rounded Corners • Drop Shadows • Gradients Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  110. 110. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos • Rounded Corners • Drop Shadows Apenas com CSS • Gradients Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  111. 111. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos • Rounded Corners • Drop Shadows Apenas com CSS • Gradients •Comportamentos e scripts avançados Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  112. 112. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Compatibilidade dos navegadores mais novos • Rounded Corners • Drop Shadows Apenas com CSS • Gradients •Comportamentos e Apenas com scripts avançados APIs Nativas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  113. 113. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Tentando fazer com que os navegadores mais antigos façam coisas que nunca foram destinadas a fazer... Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  114. 114. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Tentando fazer com que os navegadores mais antigos façam coisas que nunca foram destinadas a fazer... • Longo tempo de desenvolvimento Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  115. 115. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Tentando fazer com que os navegadores mais antigos façam coisas que nunca foram destinadas a fazer... • Longo tempo de desenvolvimento Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  116. 116. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Tentando fazer com que os navegadores mais antigos façam coisas que nunca foram destinadas a fazer... • Longo tempo de desenvolvimento • Muitos bugs e uma manutenção cara Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  117. 117. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Tentando fazer com que os navegadores mais antigos façam coisas que nunca foram destinadas a fazer... • Longo tempo de desenvolvimento • Muitos bugs e uma manutenção cara • Páginas lentas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  118. 118. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  119. 119. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet “Navegadores antigos muitas vezes precisam de muito mais código para fazer a mesma coisa.” Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  120. 120. Progressive Enhancement 2.0 - Because the Web isnt Print por Nicholas C. Zakas, desenvolvedor Web no Yahoo | @slicknet “Navegadores antigos muitas vezes precisam de muito mais código para fazer a mesma coisa.” “Para prevenir que os browsers de ontem se tornem um fardo para os desenvolvedores web e torná-lo menos feio para o público.” Nicholas C. Zakas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  121. 121. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish • jQuery 1.7 - Events - Dave Methvin • Progressive Enhancement 2.0 - Nicholas C. Zakas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  122. 122. Pontos a destacar • Attributes e Properties no jQuery - Timmy Willison • Chrome Dev Tools: Tips and Tricks - Paul Irish • jQuery 1.7 - Events - Dave Methvin • Progressive Enhancement 2.0 - Nicholas C. Zakas Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  123. 123. OBRIGADO Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011
  124. 124. OBRIGADO Slides: contato: http://bit.ly/gwt-kenji contato@kenjiyamamoto.com Links do evento: twitter: http://bit.ly/links-jqueryconf @kenjiyamamoto Kenji Yamamoto | web developer @ Globo.comterça-feira, 20 de dezembro de 2011

×