Chrome Dev Summit Summary
what’s hot ?
The tech you must be aware of
part 1

Sacha Leprêtre
@sachalepretre

Blog http://gt...
Credits and full information

http://developer.chrome.com/devsummit
Keynote by Linus Upson
VP Engineering for Chrome
Keynote by Linus Upson
VP Engineering for Chrome
•

Web History

•

GOAL: Close the gap between native app and web app

•
...
Mobile UX by Paul Kinlan
Mobile UX by Paul Kinlan
•
•
•
•

53% of sites still had a desktop experience
25% of sites didn’t fit in a mobile viewport...
Network connectivity by Jake
Archibald
Network connectivity by Jake
Archibald
• App cache is not a solution 
• Navigator.online 
• Service Worker  !
– as a ba...
#perfmatters: 60fps layout and
rendering by Tom Wiltzius and Nat Duca
#perfmatters: 60fps layout and
rendering by Tom Wiltzius and Nat Duca
• A challenge to fit every thing in 16ms

•
•
•
•

P...
#perfmatters: Optimizing network
performance by Ilya Grigorik
#perfmatters: Optimizing network
performance by Ilya Grigorik
• Since M26, Chrome uses it’s own Async DNS Resolver
• SPDY ...
Chrome DevTools for Mobile
by Paul Irish
Chrome DevTools for Mobile
by Paul Irish
• Plug your android Device
– check on chrome: chrome://inspect/#devices
– Toggle ...
Chrome DevTools for Mobile
by Paul Irish
• And NOW Mobile Simulation on Chrome dev
tools !
Chrome DevTools for Mobile
by Paul Irish
•

http://www.youtube.com/watch?v=gZH1d2Co1X0&feature=youtu.be&t=14m20s
Chrome DevTools for Mobile
by Paul Irish
• For CSS:
soon
available :
the layer
panel
(in 3D)
• LESS, SAS
S and
others in
C...
Dart for the modern web developer
by Kasper Lund and Seth Ladd
Dart for the modern web developer
by Kasper Lund and Seth Ladd
• DART = Language and libraries +Tools + VM +
Compiler to J...
GDG Montreal next talk:
Chrome Apps (Pete Lepage)
Coffee break and after :
• Pete Lepage (Google Inc.), will now present u...
Chrome dev summit summary
To be continued…
• In next slides, part 2 and 3 of the
summary, will be discussed in next GDG
Mo...
To be continued…
To be continued…
To be continued…
To be continued…
Prochain SlideShare
Chargement dans…5
×

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

1 719 vues

Publié le

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.

Publié dans : Technologie, Design
0 commentaire
0 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

  • Soyez le premier à aimer ceci

Aucun téléchargement
Vues
Nombre de vues
1 719
Sur SlideShare
0
Issues des intégrations
0
Intégrations
646
Actions
Partages
0
Téléchargements
4
Commentaires
0
J’aime
0
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

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…

×