0
SAPO Sessions #2
                              18 Março 2009




JAVASCRIPT
    DONE
                               RIGH
 ...
SAPO Sessions #2                  javascript, done right.




Antes de começar... um disclaimer. :)
SAPO Sessions #2                       javascript, done right.




                   Não venho pregar.
SAPO Sessions #2                      javascript, done right.




                   Nem vender nada.
SAPO Sessions #2                javascript, done right.




          Venho‐vos falar da minha 
               experiência.
SAPO Sessions #2             javascript, done right.




         Desde brincadeiras em javascript 
            no site du...
SAPO Sessions #2                javascript, done right.




              Até aplicações web inseridas 
                 n...
SAPO Sessions #2                   javascript, done right.




  Índice
          Uso dado ao Javascript
          Problem...
SAPO Sessions #2                         javascript, done right.




                                 javascript




Tem s...
SAPO Sessions #2                          javascript, done right.




                                                 200...
SAPO Sessions #2      javascript, done right.




                             2005




                         http://wh...
SAPO Sessions #2               javascript, done right.




                                2005
            st
       X qu...
SAPO Sessions #2        javascript, done right.




javascript é usado para
SAPO Sessions #2               javascript, done right.




javascript é usado para popups
SAPO Sessions #2               javascript, done right.




javascript é usado para efeitos de estilo
SAPO Sessions #2              javascript, done right.




javascript é usado para decorações
                          nat...
SAPO Sessions #2             javascript, done right.




javascript é usado para pré‐carregar
                            ...
SAPO Sessions #2            javascript, done right.




javascript é usado para mudar de página
SAPO Sessions #2                  javascript, done right.




javascript é usado para evitar recarregamento
              ...
SAPO Sessions #2                  javascript, done right.




javascript é usado para evitar recarregamento
              ...
SAPO Sessions #2                    javascript, done right.




javascript é usado para tudo
                  Am
     s  ...
SAPO Sessions #2              javascript, done right.




      Será que isto é um problema?
SAPO Sessions #2                                                      javascript, done right.




 problemas com o javascr...
SAPO Sessions #2                                              javascript, done right.




 problemas com o javascript
  Au...
SAPO Sessions #2                                          javascript, done right.




 problemas com o javascript
 Ausênci...
SAPO Sessions #2                                           javascript, done right.




 problemas com o javascript
 Ausênc...
SAPO Sessions #2                                                   javascript, done right.




problemas com o javascript
...
SAPO Sessions #2                                javascript, done right.




problemas com o javascript
Ausência de suporte...
SAPO Sessions #2                             javascript, done right.


Degradação Graciosa vs. Melhoramento Progressivo
  ...
SAPO Sessions #2                             javascript, done right.


 Degradação Graciosa vs. Melhoramento Progressivo
 ...
SAPO Sessions #2                             javascript, done right.


 Degradação Graciosa vs. Melhoramento Progressivo
 ...
SAPO Sessions #2                             javascript, done right.


Degradação Graciosa vs. Melhoramento Progressivo
  ...
SAPO Sessions #2                             javascript, done right.


Degradação Graciosa vs. Melhoramento Progressivo
  ...
SAPO Sessions #2                             javascript, done right.


Degradação Graciosa vs. Melhoramento Progressivo
  ...
SAPO Sessions #2       javascript, done right.




                   ?
SAPO Sessions #2                 javascript, done right.




          javascript não obstrutivo
SAPO Sessions #2                                                  javascript, done right.




         obstrutivo: adj.
  ...
SAPO Sessions #2                                                   javascript, done right.




         obstrutivo: adj.
 ...
SAPO Sessions #2                       javascript, done right.


                               javascript não obstrutivo
...
SAPO Sessions #2                      javascript, done right.


                               javascript não obstrutivo

...
SAPO Sessions #2                                 javascript, done right.


                                        javascr...
SAPO Sessions #2                                    javascript, done right.


                                            ...
SAPO Sessions #2                                    javascript, done right.


                                            ...
SAPO Sessions #2                         javascript, done right.


                                 javascript não obstrut...
SAPO Sessions #2                                               javascript, done right.



  Vannevar Bush




1945: propôs...
SAPO Sessions #2                                              javascript, done right.




Ted Nelson




1960: Fundou proj...
SAPO Sessions #2                                                  javascript, done right.




 Douglas Engelbart




1963:...
SAPO Sessions #2         javascript, done right.




Tim Berners‐Lee




                                            tanak...
SAPO Sessions #2                                    javascript, done right.


                                            ...
SAPO Sessions #2                                          javascript, done right.


                                      ...
SAPO Sessions #2                                          javascript, done right.


                                      ...
SAPO Sessions #2                                          javascript, done right.


                                      ...
SAPO Sessions #2                    javascript, done right.


                                  javascript não obstrutivo
...
SAPO Sessions #2                    javascript, done right.


                             javascript não obstrutivo

Remo...
SAPO Sessions #2                          javascript, done right.


                                    javascript não obs...
SAPO Sessions #2                          javascript, done right.


                                    javascript não obs...
SAPO Sessions #2                        javascript, done right.


                                 javascript não obstruti...
SAPO Sessions #2                                javascript, done right.


                                         javascr...
SAPO Sessions #2                                  javascript, done right.


                                           jav...
SAPO Sessions #2                                  javascript, done right.


                                           jav...
SAPO Sessions #2                   javascript, done right.


                            javascript não obstrutivo

Remove...
SAPO Sessions #2                                             javascript, done right.


                                   ...
SAPO Sessions #2                                      javascript, done right.


                                          ...
SAPO Sessions #2                                   javascript, done right.


                                            j...
SAPO Sessions #2                            javascript, done right.


                                    javascript não o...
SAPO Sessions #2                                 javascript, done right.


                                         javasc...
SAPO Sessions #2           javascript, done right.


                   javascript não obstrutivo
SAPO Sessions #2              javascript, done right.


                     javascript não obstrutivo




               ...
SAPO Sessions #2              javascript, done right.


                     javascript não obstrutivo




               ...
SAPO Sessions #2                  javascript, done right.


                          javascript não obstrutivo




      ...
SAPO Sessions #2                           javascript, done right.


                                  javascript não obst...
SAPO Sessions #2                  javascript, done right.


                          javascript não obstrutivo

         ...
SAPO Sessions #2                   javascript, done right.


                           javascript não obstrutivo

       ...
SAPO Sessions #2                                        javascript, done right.


                                        ...
SAPO Sessions #2                             javascript, done right.


                                         javascript...
SAPO Sessions #2                                 javascript, done right.


                                         javasc...
SAPO Sessions #2                    javascript, done right.


                            javascript não obstrutivo




  ...
SAPO Sessions #2       javascript, done right.




                   ?
SAPO Sessions #2                             javascript, done right.




                   Scripts não‐bloqueantes
SAPO Sessions #2                      javascript, done right.


                              scripts não bloqueantes



 ...
SAPO Sessions #2                      javascript, done right.


                              scripts não bloqueantes



 ...
SAPO Sessions #2                                            javascript, done right.


                                    ...
SAPO Sessions #2                          javascript, done right.


                                    scripts não bloque...
SAPO Sessions #2                          javascript, done right.




                   Histórico em Webapps
SAPO Sessions #2                                            javascript, done right.


                                    ...
SAPO Sessions #2                                            javascript, done right.


                                    ...
SAPO Sessions #2       javascript, done right.




                   ?
SAPO Sessions #2                                   javascript, done right.




That’s all folks!

André Luís
aluis@co.sapo...
Upcoming SlideShare
Loading in...5
×

JavaScript done right

1,686

Published on

Práticas de JavaScript menos conhecidas.

Unobtrusive JavaScript, progressive enhancement vs graceful degradation, HIJAX, incompatibilidades entre browsers e mais.

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

No Downloads
Views
Total Views
1,686
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
34
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "JavaScript done right"

  1. 1. SAPO Sessions #2 18 Março 2009 JAVASCRIPT DONE RIGH T! creative commons André Luís attribution non-commercial http://andr3.net share-alike 3.0 aluis@co.sapo.pt
  2. 2. SAPO Sessions #2 javascript, done right. Antes de começar... um disclaimer. :)
  3. 3. SAPO Sessions #2 javascript, done right. Não venho pregar.
  4. 4. SAPO Sessions #2 javascript, done right. Nem vender nada.
  5. 5. SAPO Sessions #2 javascript, done right. Venho‐vos falar da minha  experiência.
  6. 6. SAPO Sessions #2 javascript, done right. Desde brincadeiras em javascript  no site dum canal de IRC. 2000
  7. 7. SAPO Sessions #2 javascript, done right. Até aplicações web inseridas  no Webmail do SAPO. 2009
  8. 8. SAPO Sessions #2 javascript, done right. Índice Uso dado ao Javascript Problemas Como resolvê‐los Javascript Não Obstrutivo Hijax Scripts não bloqueantes Histórico com Javascript 2009
  9. 9. SAPO Sessions #2 javascript, done right. javascript Tem sido muito maltratado ao longo do tempo
  10. 10. SAPO Sessions #2 javascript, done right. 2001 ppopu s puop p pop p o u up pjavascript s popups s ps filho do diabo Em 2001, era o filho do diabo.
  11. 11. SAPO Sessions #2 javascript, done right. 2005 http://whit.me/ajax Até que...
  12. 12. SAPO Sessions #2 javascript, done right. 2005 st X que JA e A pR tt javascript H WebAp L M ps X everybody’s bitch lover Mashup s
  13. 13. SAPO Sessions #2 javascript, done right. javascript é usado para
  14. 14. SAPO Sessions #2 javascript, done right. javascript é usado para popups
  15. 15. SAPO Sessions #2 javascript, done right. javascript é usado para efeitos de estilo
  16. 16. SAPO Sessions #2 javascript, done right. javascript é usado para decorações natalícias
  17. 17. SAPO Sessions #2 javascript, done right. javascript é usado para pré‐carregar imagens
  18. 18. SAPO Sessions #2 javascript, done right. javascript é usado para mudar de página
  19. 19. SAPO Sessions #2 javascript, done right. javascript é usado para evitar recarregamento de páginas inteiras
  20. 20. SAPO Sessions #2 javascript, done right. javascript é usado para evitar recarregamento AJA X de páginas inteiras
  21. 21. SAPO Sessions #2 javascript, done right. javascript é usado para tudo Am s Valid a p a bie ação M  de  nte Form fline s Of s G s pp A ráf /Sub icos Emu Pub lador es de (spec  Jogo trum tes s ui e S , etc) ffic O
  22. 22. SAPO Sessions #2 javascript, done right. Será que isto é um problema?
  23. 23. SAPO Sessions #2 javascript, done right. problemas com o javascript Ausência de suporte para Javascript Intranets corp., screen-readers, search engine crawlers, NoScript, etc. Somando as pequenas percentagens destes factores, facilmente se chega acima dos 10%. Mais: um utilizador que veja um site quebrado, muito provavelmente, não volta.
  24. 24. SAPO Sessions #2 javascript, done right. problemas com o javascript Ausência de suporte para Javascript Não é bookmarkable Não oferece, de origem, mecanismos para guardar o estado duma webapp Soa a algo familiar? Argumento muitas vezes usado por *nós* contra sites 100% Flash.
  25. 25. SAPO Sessions #2 javascript, done right. problemas com o javascript Ausência de suporte para Javascript Não é bookmarkable Quebra o histórico (retroceder, avançar) Não oferece, de origem, mecanismos para guardar o histórico Permite-nos implementar mecanismos para isto, mas não fornece de origem.
  26. 26. SAPO Sessions #2 javascript, done right. problemas com o javascript Ausência de suporte para Javascript Não é bookmarkable Quebra o histórico (retroceder, avançar) Acessibilidade: navegação por teclado Eventos onmousedown, onmouseover não disparam se não se usar um disp. apontador focus para além do onmouseover, onclick em vez de onmousedown
  27. 27. SAPO Sessions #2 javascript, done right. problemas com o javascript Ausência de suporte para Javascript Não é bookmarkable Quebra o histórico (retroceder, avançar) Acessibilidade: navegação por teclado Usabilidade: controlar a abertura dum link Abrir numa nova tab, nova janela ou enviar link por mail. Problema: href=”#”
  28. 28. SAPO Sessions #2 javascript, done right. problemas com o javascript Ausência de suporte para Javascript Não é bookmarkable Boas notícias: tudo isto é evitável. Quebra o histórico (retroceder, avançar) Acessibilidade: navegação por teclado Usabilidade: controlar a abertura dum link
  29. 29. SAPO Sessions #2 javascript, done right. Degradação Graciosa vs. Melhoramento Progressivo Graceful Degradation Progressive Enhancement
  30. 30. SAPO Sessions #2 javascript, done right. Degradação Graciosa vs. Melhoramento Progressivo Graceful Degradation Progressive Enhancement Mostram‐se versões  alternativas no caso do  cliente não suportar todas  as tecnologias utilizadas. 
  31. 31. SAPO Sessions #2 javascript, done right. Degradação Graciosa vs. Melhoramento Progressivo Graceful Degradation Progressive Enhancement Exemplos: <img src=”foto.png” alt=”Fotografia”> Mostram‐se versões  <noscript> alternativas no caso do  <noframes> cliente não suportar todas  as tecnologias utilizadas. 
  32. 32. SAPO Sessions #2 javascript, done right. Degradação Graciosa vs. Melhoramento Progressivo Graceful Degradation Progressive Enhancement Constrói‐se uma versão  base/usável duma  funcionalidade e melhora‐se  progressivamente.
  33. 33. SAPO Sessions #2 javascript, done right. Degradação Graciosa vs. Melhoramento Progressivo Graceful Degradation Progressive Enhancement Exemplos: Constrói‐se uma versão  Substitução de Imagens por CSS base/usável duma  Javascript Não Obstrutivo funcionalidade e melhora‐se  progressivamente.
  34. 34. SAPO Sessions #2 javascript, done right. Degradação Graciosa vs. Melhoramento Progressivo Graceful Degradation Progressive Enhancement Exemplos: Melhorar  Constrói‐se uma versão  Substitução de Imagens por CSS progressivamente! base/usável duma  Javascript Não Obstrutivo funcionalidade e melhora‐se  progressivamente.
  35. 35. SAPO Sessions #2 javascript, done right. ?
  36. 36. SAPO Sessions #2 javascript, done right. javascript não obstrutivo
  37. 37. SAPO Sessions #2 javascript, done right. obstrutivo: adj. que causa obstrução; que serve para obstruir. Funny story: não foi possível colocar o link directo para “obstrutivo” pq a priberam usa JS obstrutivo.
  38. 38. SAPO Sessions #2 javascript, done right. obstrutivo: adj. que causa obstrução; que serve para obstruir. fonte: Priberam  http://priberam.pt/dlpo/ FAIL Funny story: não foi possível colocar o link directo para “obstrutivo” pq a priberam usa JS obstrutivo.
  39. 39. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Mas como?
  40. 40. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Revisão da matéria dada: Camadas de Separação Conteúdo HTML Comportamento Apresentação JAVASCRIPT CSS
  41. 41. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Revisão da matéria dada: Camadas de Separação /whatever.php Conteúdo HTML /css/style.css /js/whatever.js Comportamento Apresentação JAVASCRIPT CSS
  42. 42. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Revisão da matéria dada: Camadas de Separação /whatever.php Não misturar  Conteúdo tecnologias. HTML /css/style.css /js/whatever.js Comportamento Apresentação JAVASCRIPT CSS Loose coupling FTW!!
  43. 43. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Revisão da matéria dada: Carregamento e Eventos HTML onDomReady / domContentLoaded CSS JAVASCRIPT MEDIA window.onLoad DOMContentLoaded no HTML5
  44. 44. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Quão importante é um mero link?
  45. 45. SAPO Sessions #2 javascript, done right. Vannevar Bush 1945: propôs o Memex, um computador teórico que em vez de ordenar informação alfabeticamente, usava associações entre documentos. Inspirou a criação do conceito de hipertexto. Artigo: As We May Think.
  46. 46. SAPO Sessions #2 javascript, done right. Ted Nelson 1960: Fundou projecto Xanadu, definiu o conceito de Hipertexto. Apesar do seu conceito ser um pouco mais completo, xanadu falhou. (links que se quebram nem gestão de versões, na WWW do TBL)
  47. 47. SAPO Sessions #2 javascript, done right. Douglas Engelbart 1963: NLS (oNLine System), que utilizava ligações (links) do conceito do hipertexto.
  48. 48. SAPO Sessions #2 javascript, done right. Tim Berners‐Lee tanaka 1991: WWW, num lab do CERN.
  49. 49. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções <a href=”javascript:show( ‘wonderbra.png’, ... FAIL Link sem href = big no no. Motores de busca não seguem. Não há JS, não há link. Não tem de ser assim...
  50. 50. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções <a href=”#” onclick=”show( ‘wonderbra.png’, ... FAIL Ainda assim... Está a definir um handler por Javascript... mas não tem href. AVISO: Sempre que escreverem “#”. YOU’RE DOIN’ IT WRONG!
  51. 51. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções <a href=”#” onclick=”show( ‘wonderbra.png’, ... FAIL Ainda assim... I CAN HAZ CHEEZBURGER http://whit.me/doinitwrong Está a definir um handler por Javascript... mas não tem href. AVISO: Sempre que escreverem “#”. YOU’RE DOIN’ IT WRONG!
  52. 52. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções <a href=”wonderbra.png” onclick=”show(‘wonderbra.png’); return false;”>... menos mau Já tem href. ATENÇÃO: return false; impede o browser de seguir o href= Mas... javascript inline é má idea.
  53. 53. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções <a href=”wonderbra.png” onclick=”show(this.href); return false;”>... menos mau DRY - don’t repeat yourself. ;)
  54. 54. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções <a href=”wonderbra.png” class=”preview” >... melhor
  55. 55. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções meanwhile... in a js file not far from there var prevs = document.getElementsByClassName(‘preview’); for (var i=0,len=prevs.length;i<len;i++) { prevs[i].addEventListener (‘click’, show); prevs[i].onclick = ‘return false’; }
  56. 56. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções meanwhile... in a js file not far from there var prevs = document.getElementsByClassName(‘preview’); for (var i=0,len=prevs.length;i<len;i++) { prevs[i].addEventListener (‘click’, show); prevs[i].onclick = ‘return false’; } In your dreams, sucker!
  57. 57. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções Frameworks ajudam a lidar com as  incoerências dos browsers
  58. 58. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções jQuery jQuery (document).ready ( function () { jQuery('a.jquery').click (function () { alert('jQuery!'); return false; } ); } );
  59. 59. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções Prototype.js document.observe ( 'dom:loaded', function () { $$('a.prototype').each (function (el) { Event.observe (el, 'click', function () { alert('Prototype!'); }); el.setAttribute( 'onclick', 'return false;'); }); });
  60. 60. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções Prototype.js document.observe ( 'dom:loaded', function () { $$('a.prototype').each (function (el) { Event.observe (el, 'click', function (ev) { alert('Prototype!'); }); Event.stop(ev); }); });
  61. 61. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Remover obstruções demo
  62. 62. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Exemplo Lightbox http://www.lokeshdhakar.com/projects/lightbox2/ Fonte das imagens: http://brunoluis.com
  63. 63. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Exemplo Lightbox Links para as imagens: href=”wonderbra.jpg” 1 on dom:loaded, procurar links com rel=”lightbox” 2 Definir funções para mostrar o Loading... e carregar  3 imagem dentro da página Cancelar a acção de “click” para o browser não seguir o  4 que está no href.
  64. 64. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Exemplo Lightbox <a href=”wonderbra.jpg” rel=”lightbox”> 1 a[rel=lightbox] todos os links com atributo rel=lightbox 2 addEventListener (w3c) / attachEvent (IE) 3 return false; 4
  65. 65. SAPO Sessions #2 javascript, done right. javascript não obstrutivo E formulários?
  66. 66. SAPO Sessions #2 javascript, done right. javascript não obstrutivo http://web.mail.sapo.pt/
  67. 67. SAPO Sessions #2 javascript, done right. javascript não obstrutivo
  68. 68. SAPO Sessions #2 javascript, done right. javascript não obstrutivo onSubmit DOM LOADED!
  69. 69. SAPO Sessions #2 javascript, done right. javascript não obstrutivo onSubmit DOM LOADED!
  70. 70. SAPO Sessions #2 javascript, done right. javascript não obstrutivo demo
  71. 71. SAPO Sessions #2 javascript, done right. javascript não obstrutivo Mais aplicações: Ecrãs de registo, transformar link  “Termos e condições” num overlay. Reconhecer microformatos e inserir links  para as transformações.
  72. 72. SAPO Sessions #2 javascript, done right. javascript não obstrutivo AJAX
  73. 73. SAPO Sessions #2 javascript, done right. javascript não obstrutivo AJAX ! W PO KA
  74. 74. SAPO Sessions #2 javascript, done right. javascript não obstrutivo HIJAX by Jeremy Keith Construir um site que utilize links e formulários  1 tradicionais. Sem recurso a javascript. Entrar no DOM, definir eventListeners para os eventos certos e  2 substituir os carregamentos de páginas completas por pequenos  pedidos AJAX.
  75. 75. SAPO Sessions #2 javascript, done right. javascript não obstrutivo HIJAX by Jeremy Keith Planear para o AJAX desde as wireframes. 1 Implementá‐lo no final. 2
  76. 76. SAPO Sessions #2 javascript, done right. javascript não obstrutivo HIJAX by Jeremy Keith Mais info, no blog DomScripting.org http://whit.me/hijax
  77. 77. SAPO Sessions #2 javascript, done right. javascript não obstrutivo http://unobtrusify.com
  78. 78. SAPO Sessions #2 javascript, done right. ?
  79. 79. SAPO Sessions #2 javascript, done right. Scripts não‐bloqueantes
  80. 80. SAPO Sessions #2 javascript, done right. scripts não bloqueantes <head> <script> <script> <body>
  81. 81. SAPO Sessions #2 javascript, done right. scripts não bloqueantes <head> <body> <script> <script>
  82. 82. SAPO Sessions #2 javascript, done right. scripts não bloqueantes <script type=”text/javascript”> (function () { <head> var scr = document.createElement(‘script’); scr.type = ‘text/javascript’; <body> scr.src = ‘ficheiro_de_js_nao_obstrutivo.js”; var cabeca = document.getElementsByTagName(‘head’)[0]; cabeca.appendChild(scr); )( ); </script> <script> <script> Função Anónima, auto-executável e limpa. (nada no scope global)
  83. 83. SAPO Sessions #2 javascript, done right. scripts não bloqueantes <script type=”text/javascript”> (function () { <head> var scr = document.createElement(‘script’); scr.type = ‘text/javascript’; Esquecer: document.write <body> scr.src = ‘ficheiro_de_js_nao_obstrutivo.js”; var cabeca = document.getElementsByTagName(‘head’)[0]; cabeca.appendChild(scr); )( ); </script> <script> <script>
  84. 84. SAPO Sessions #2 javascript, done right. Histórico em Webapps
  85. 85. SAPO Sessions #2 javascript, done right. Histórico em Webapps Quebra o histórico (retroceder, avançar) Não oferece, de origem, mecanismos para guardar o histórico Alterar o location.href.hash 1 Verificar se o location.href.hash mudou e  2 lidar com essa mudança
  86. 86. SAPO Sessions #2 javascript, done right. Histórico em Webapps Quebra o histórico (retroceder, avançar) Não oferece, de origem, mecanismos para guardar o histórico Alterar o location.href.hash 1 Verificar se o location.href.hash mudou e  2 lidar com essa mudança Inconsistências de browsers *cof*IE*cof* 3 http://developer.yahoo.com/yui/history/
  87. 87. SAPO Sessions #2 javascript, done right. ?
  88. 88. SAPO Sessions #2 javascript, done right. That’s all folks! André Luís aluis@co.sapo.pt me@andr3.net http://domscripting.org creative commons http://www.alistapart.com/topics/code/scripting/ attribution http://talks.andr3.net/2009/js,doneright.pdf non-commercial http://slideshare.net/andr3 share-alike 3.0
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×