Chrome Dev Summit Summary 2013 part 1 - what’s hot ?

1,689 views

Published on

Google Developer Group Montreal:
"We will summarize the recent conference Google Chrome Dev Summit day1 and day2 of mid-November and talk about the many new technologies around Chrome you must know !"

Presentation from +Sacha Leprêtre Nteo Inc.

Published in: Technology, Design
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,689
On SlideShare
0
From Embeds
0
Number of Embeds
646
Actions
Shares
0
Downloads
4
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Chrome Dev Summit Summary 2013 part 1 - what’s hot ?

  1. 1. Chrome Dev Summit Summary what’s hot ? The tech you must be aware of part 1 Sacha Leprêtre @sachalepretre Blog http://gtugmontreal.blogspot.ca / Twitter: @gtugmontreal / Google+ page: GDG Montreal 2013-12-12
  2. 2. Credits and full information http://developer.chrome.com/devsummit
  3. 3. Keynote by Linus Upson VP Engineering for Chrome
  4. 4. Keynote by Linus Upson VP Engineering for Chrome • Web History • GOAL: Close the gap between native app and web app • Rendering Performance – – – – – – • Networking Performance – – • webgl webrtc (check https://apprtc.appspot.com) webaudio Vibration API, Geolocation API, Web notification API UI Patterns – – – – • Mobile data compression proxy (jpgeg to webp , video to WebM (VP9) ServiceWorker an attempt fo rewrite App cache . API: – – • Expectation on mobile: everything is minimum 60 frame/s Ex: GPU, webanimations EX: Reducing Garbage collection pause time … working with v8 team Performance measure and dashboard In mobile: javascript performance improved 50% in the last year Octane benchmark for v8 : + javascript latency measure + emscripten code + asm.js style code + large javscript code Request auto complete: for form , usefull for payments Polymer, HTML tags in HTML tags, on top of webcomponents Add to home screen on chrome for android Source in : multiple resolution images Développer Productivity – – – The layer panel DART Dart.js PNACL pepperjs contributing to cordova
  5. 5. Mobile UX by Paul Kinlan
  6. 6. Mobile UX by Paul Kinlan • • • • 53% of sites still had a desktop experience 25% of sites didn’t fit in a mobile viewport 83% of site had hard to touch areas A Tool to help: http://developers.google.com/speed/pagespe ed/insights/?ux=1
  7. 7. Network connectivity by Jake Archibald
  8. 8. Network connectivity by Jake Archibald • App cache is not a solution  • Navigator.online  • Service Worker  ! – as a background page – Check html5rocks next month for more on serviceworker
  9. 9. #perfmatters: 60fps layout and rendering by Tom Wiltzius and Nat Duca
  10. 10. #perfmatters: 60fps layout and rendering by Tom Wiltzius and Nat Duca • A challenge to fit every thing in 16ms • • • • Painting is slow ! : avoid repainting Use dev tools Use layers http://jankfree.org/examples/parallax.html On mobile: Touch latency, Avoid big listeners.. while page load, Touch Cancel is important, click has a 300 ms delays
  11. 11. #perfmatters: Optimizing network performance by Ilya Grigorik
  12. 12. #perfmatters: Optimizing network performance by Ilya Grigorik • Since M26, Chrome uses it’s own Async DNS Resolver • SPDY open networking internet protocol for reducing page loading time • Experimental QUIC (Quick UDP Internet Connection) tunneling protocol atop UDP: LOW LATENCY! • Chrome Data Compression • WebSocket Compression • Timing-Allow-Origin:* (allows your server to transmit full timing info.. Google analytics can analyze and check w3c User Timing : polyfill)
  13. 13. Chrome DevTools for Mobile by Paul Irish
  14. 14. Chrome DevTools for Mobile by Paul Irish • Plug your android Device – check on chrome: chrome://inspect/#devices – Toggle screencast ! • Mobile Simulation on Chrome dev tools !
  15. 15. Chrome DevTools for Mobile by Paul Irish • And NOW Mobile Simulation on Chrome dev tools !
  16. 16. Chrome DevTools for Mobile by Paul Irish • http://www.youtube.com/watch?v=gZH1d2Co1X0&feature=youtu.be&t=14m20s
  17. 17. Chrome DevTools for Mobile by Paul Irish • For CSS: soon available : the layer panel (in 3D) • LESS, SAS S and others in CDT
  18. 18. Dart for the modern web developer by Kasper Lund and Seth Ladd
  19. 19. Dart for the modern web developer by Kasper Lund and Seth Ladd • DART = Language and libraries +Tools + VM + Compiler to JavaScript • DART is easy and powerfull (inlining, types or not etc…) • DART compiler to js most of the time better of direct js ! And cross browser javascript !
  20. 20. GDG Montreal next talk: Chrome Apps (Pete Lepage) Coffee break and after : • Pete Lepage (Google Inc.), will now present us the Chrome Apps !
  21. 21. Chrome dev summit summary To be continued… • In next slides, part 2 and 3 of the summary, will be discussed in next GDG Montreal meetings • See you in our next events !
  22. 22. To be continued…
  23. 23. To be continued…
  24. 24. To be continued…
  25. 25. To be continued…

×