Refactoring to Unobtrusive Javascript
Nov 29, 2014
Talk i gave at JsCamp09 on September 25th 2009.
Slides revised, corrected and expanded.
Also
http://www.javascriptcamp.com/
Follow me on Twitter!
https://twitter.com/federicogalassi
Slides revised, corrected and expanded.
Also
http://www.javascriptcamp.com/
Follow me on Twitter!
https://twitter.com/federicogalassi
- 1. Refactoring to Unobtrusive Javascript Federico Galassi [email protected] http://federico.galassi.net/
- 2. Separation of Concerns Keeping different aspects of an application separate
- 3. Separation of Concerns So that everyone can focus on one thing at a time
- 4. Unobtrusive Javascript Techniques to enforce separation of javascript from other web technologies
- 5. Web Technologies Html Content Css Presentation Javascript Presentation Logic Server side Business Logic
- 6. Rules of the Game 1 Javascript stays in its own les 2 Files are affected only by changes directly related to presentation logic
- 7. Game Strategy How do we play? Code refactoring is improving quality of existing code without changing its functional behavior
- 8. Game Strategy No refactoring without testing unit testing with jsTestDriver & friends minimal functional testing with selenium & friends mock the server by wrapping XMLHttpRequest
- 9. 1 Round Html You see an
- 10. 1 Bad Smell Html javascript in html
- 11. 1 Refactoring: Externalize Inline Script Html Js
- 12. 1 Refactoring: Externalize Inline Script Html Js // ... more code ...
- 13. 2 Round Html You see an event handler registration Refresh by element attribute
- 14. 2 Bad Smell Html Hey, its Refresh javascript in html
- 15. 2 Refactoring: Attribute Event to Dom Event Html Js Refresh
- 16. 2 Refactoring: Attribute Event to Dom Event Html Js var btnrefresh = document.getElementById( Refresh "btnRefresh" ); btnrefresh.addEventListener( "click", refreshView, false );
Related Documents See more >
