Successfully reported this slideshow.
JSConf.eu JavaScript Berlin 7-8 Nov 2009
[email_address] j Solutions n Solutions i Solutions Java .NET IBM  i
JSConf.EU
JS in Browser Performance <ul><li>Yahoo!
Google
Velocity (conf)
Rules and tools
YSlow & Page Speed </li></ul>
Stairway to heaven
High Performance Web Sites <ul><li>14 regler </li><ul><li>fewer http requests
use a CDN
expires content-cache
gzip
stylesheets at top
scripts at bottom
... </li></ul></ul>
Even Faster Web Sites <ul><li>web 2.0 - front end </li><ul><li>Responsive webapps
Splitting initial load
Loading w/o blocking
Coupling async scripts
Writing efficient js
Optimize images
Flush document early
Simplify CSS selectors </li></ul></ul>
Loading JS - LABjs <ul><li>Olika tekniker </li><ul><li>XHR Eval
Upcoming SlideShare
Loading in …5
×

Presentation of JSConf.eu

2,050 views

Published on

I went to JSConf.eu 2009 and was asked to present a "summary" of my take aways from the conference at Gothenburg DotnetForum in December 2009.

Published in: Technology
  • Be the first to comment

Presentation of JSConf.eu

  1. 1. JSConf.eu JavaScript Berlin 7-8 Nov 2009
  2. 2. [email_address] j Solutions n Solutions i Solutions Java .NET IBM i
  3. 3. JSConf.EU
  4. 4. JS in Browser Performance <ul><li>Yahoo!
  5. 5. Google
  6. 6. Velocity (conf)
  7. 7. Rules and tools
  8. 8. YSlow & Page Speed </li></ul>
  9. 9. Stairway to heaven
  10. 10. High Performance Web Sites <ul><li>14 regler </li><ul><li>fewer http requests
  11. 11. use a CDN
  12. 12. expires content-cache
  13. 13. gzip
  14. 14. stylesheets at top
  15. 15. scripts at bottom
  16. 16. ... </li></ul></ul>
  17. 17. Even Faster Web Sites <ul><li>web 2.0 - front end </li><ul><li>Responsive webapps
  18. 18. Splitting initial load
  19. 19. Loading w/o blocking
  20. 20. Coupling async scripts
  21. 21. Writing efficient js
  22. 22. Optimize images
  23. 23. Flush document early
  24. 24. Simplify CSS selectors </li></ul></ul>
  25. 25. Loading JS - LABjs <ul><li>Olika tekniker </li><ul><li>XHR Eval
  26. 26. XHR Injection
  27. 27. Script in Iframe
  28. 28. DOM Element
  29. 29. Script Defer
  30. 30. document.write </li></ul><li>Cavemen can do it! </li></ul>
  31. 31. BAD BAD BAD <script src=&quot;framework.js&quot;></script> <script src=&quot;plugin.framework.js&quot;></ <script src=&quot;myplugin.js&quot;></script> <script> myplugin.init(); </script> <script> framework.init(); framework.doSomething(); </script>
  32. 32. What is good?
  33. 33. LABjs - LoadingAndBlocking <script> $LAB .script(&quot;framework.js&quot;). wait () .script(&quot;plugin.framework.js&quot;) .script(&quot;myplugin.js&quot;) .wait(function(){ myplugin.init(); framework.init(); framework.doSomething(); }); </script>
  34. 34. Objektorienterad CSS <ul><li>CSS </li><ul><li>easy to break existing code
  35. 35. immature profession </li></ul><li>variables
  36. 36. prototypes
  37. 37. mixins </li></ul>
  38. 38. CSS Wish List - Variables @variables hex { facebookBlue : #3b5998; highlight : #ff9933; } h2, h4, h6 { color: hex . facebookBlue ; } @variables <var group name> { <var name>: <value> }
  39. 39. CSS Wish List - Mixins @mixin .clearfix { zoom:1 } .clearfix :after { content: &quot;.&quot;; display: block; height: 0; clear: both; visibility: hidden; }
  40. 40. CSS Wish List - Including .introduction { include: .clearfix ; } .introduction {zoom:1} .introduction:after { content: &quot;.&quot;; display: ...; }
  41. 41. node.js - Evented I/O for V8 <ul><li>Most popular servers are doing it wrong
  42. 42. Most APIs are synchronous
  43. 43. The world is async
  44. 44. node.js is all async </li></ul>
  45. 45. node.js - DNS example var dns = require(&quot;dns&quot;); var resolution = dns.resolve4(&quot;www.google.com&quot;); resolution.addCallback( function(addresses, ttl, cname) { puts(&quot;addresses: &quot;); puts(JSON.stringify(addresses)); } );
  46. 46. JS - from birth to closure <ul><li>Genomgång av JavaScript
  47. 47. Conditionals, Comparison, Data Types, Functions, Function Arguments, Objects, Inheritance, Scope, Function Scope, Closure, Namespacing, Syntax </li></ul>
  48. 48. Using dojox.* <ul><li>dojox.gfx
  49. 49. dojox.charting stunning portable cross-browser real-time 2D graphics </li></ul>
  50. 50. Party!
  51. 51. ECMAScript 5 <ul><li>repair the language </li><ul><li>block problem
  52. 52. variadic functions
  53. 53. syntactic sugar </li></ul><li>IBM - IEEE 754r
  54. 54. Close Patent Office
  55. 55. SDC 2010 </li></ul>
  56. 56. Douglas Crockford Just because something is a standard doesn’t mean it is the right choice for every application. Like XML, for example.
  57. 57. HTML5 <ul><li>web forms
  58. 58. <video>
  59. 59. <canvas>
  60. 60. offline apps prop: navigator.online events: online, offline window. applicationCache <html manifest=&quot;FIL&quot;> </li></ul>
  61. 61. The Future of Web-Apps <ul><li>Everything's amazing and nobody's happy
  62. 62. Many devices - lots of propietary APIs
  63. 63. The stuff the user does is SACRED
  64. 64. Nielsen gäller ännu: 0.1, 1.0, 10 sekunder </li></ul>
  65. 65. Tack, frågor och cred flickr.com/ipom/ flickr.com/janlehnardt/ labjs.com nodejs.com stubbornella.org stevesouders.com javascript.crockford.com

×