web (ui) development

Download Web (UI) Development

If you can't read please download the document

Upload: michael-kerrin

Post on 17-May-2015

2.010 views

Category:

Technology


0 download

TRANSCRIPT

  • 1. Web (UI) Development Michael Kerrin [email_address] http://mkerrin.wordpress.com/

2. Part 1 3. Current Web Frameworks

  • Django

4. Zope 5. Turbogears 6. WSGI 7. Don't Repeat Yourself

  • DRY Principle

8. Every piece of knowledge must have a single,unambiguous, authoritative representation within a system 9. Just don't repeat yourself.... 10. What does that mean?

  • Object-relational mapper

11. Admin interface / Zope Management Interface / Turbogrears admin 12. Sessions 13. Authentication 14. RSS 15. .... 16. Templates

  • Django

17. Zope Page Templates 18. Genshi 19. Kid 20. Part 2 21. UI Frameworks

  • jQuery

22. YUI 23. Dojo 24. ExtJS 25. Part 3 26. Speed matters

  • Best practices for speeding up your website
  • Yahoo! http://developer.yahoo.com/performance/rules.html

27. Googlehttp://code.google.com/speed/page-speed/docs/rules_intro.html 28. Best practice according to Yahoo!

  • 1. Make Fewer HTTP Requests

29. 2. Use a Content Delivery Network (CDN) 30. 3. Add Expires or Cache-Control Header 31. 4. Gzip Components 32. 5. Put Stylesheets at Top 33. 6. Put Scripts at Bottom 34. 7. Avoid CSS Expressions 35. 8. Make JavaScript and CSS External 36. 9. Reduce DNS Lookups 37. 10. Minify JavaScript and CSS 38. 11. Avoid Redirects 39. 12. Remove Duplicate Scripts 40. 13. Configure ETags 41. 14. Make Ajax Cacheable 42. 15. Flush Buffer Early 43. 16. Use GET for Ajax Requests 44. 17. Postload Components 45. 18. Preload Components 46. 19. Reduce the Number of DOM Elements 47. 20. Split Components Across Domains 48. 21. Minimize Number of iframes 49. 22. Avoid 404s 50. 23. Reduce Cookie Size 51. 24. Use Cookie-Free Domains for Components 52. 25. Minimize DOM Access 53. 26. Develop Smart Event Handlers 54. 27. Choose Over @import 55. 28. Avoid Filters 56. 29. Optimize Images 57. 30. Optimize CSS Sprites 58. 31. Do Not Scale Images in HTML 59. 32. Make favicon.ico Small and Cacheable 60. 33. Keep Components Under 25 KB 61. 34. Pack Components Into a Multipart Document 62. 35. Avoid Empty Image src 63. In nutshell

  • Reduce size (HTML, CSS, JavaScript)

64. Reduce the number of resources 65. Defer the what you need until when you need it 66. Experiment

  • break the rules

67. See what works for you 68. Its an art!

  • What works on one site may not work on an other

69. What was bad experiment on an other site may work on our site 70. Cost of implementing a feature 71. Cost of not implementing a feature 72. Tools

  • Yslow

73. PageSpeed 74. Speed tracer 75. Part 4 76. DRY UI 77. Speed matters but...

  • Combining JavaScript and CSS files is hard

78. Deferring JavaScript is hard 79. As a site evolves JavaScript is added 80. JavaScript p lug-insare added 81. .... and removed 82. not used often 83. Templates

  • But the web is made up of
  • HTML

84. JavaScript 85. CSS 86. And a crap load of images 87. and videos But templates Product textual data into a part or all of a response 88. Part 5 89. Solutions

  • ToscaWidgets

90. Maybe

  • Widgets

91. Resource injection 92. Python API to dynamically create JavaScript function calls 93.