Chrome Dev Summit Summary 2013 part 1 - what’s hot ?
25
Sacha Leprêtre @sachalepretre 2013-12- 12 Blog http://gtugmontreal.blogspot.ca / Twitter: @gtugmontreal / Google+ page: GDG Montreal was… Chrome Dev Summit Summary what’s hot ? The tech you must be aware of part 1
-
Upload
sacha-lepretre -
Category
Technology
-
view
1.239 -
download
3
description
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.
Transcript of Chrome Dev Summit Summary 2013 part 1 - what’s hot ?
Sacha Leprêtre@sachalepretre
2013-12-12
Blog http://gtugmontreal.blogspot.ca / Twitter: @gtugmontreal / Google+ page: GDG Montreal
was…
Chrome Dev Summit Summary what’s hot ?
The tech you must be aware ofpart 1
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
• Rendering Performance– 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
• Networking Performance– Mobile data compression proxy (jpgeg to webp , video to WebM (VP9)– ServiceWorker an attempt fo rewrite App cache .
• API: – webgl webrtc (check https://apprtc.appspot.com) webaudio– Vibration API, Geolocation API, Web notification API
• UI Patterns– 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
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• 83% of site had hard to touch areas• A Tool to help:
http://developers.google.com/speed/pagespeed/insights/?ux=1
Network connectivity by Jake Archibald
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
#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
• 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
#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 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)
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 screencast !
• Mobile Simulation on Chrome dev tools !
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, SASS
and others in CDT
Dart for the modern web developerby Kasper Lund and Seth Ladd
Dart for the modern web developerby 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 !
GDG Montreal next talk:Chrome Apps (Pete Lepage)
Coffee break and after :• Pete Lepage (Google Inc.), will now present us
the Chrome Apps !
• In next slides, part 2 and 3 of the summary, will be discussed in next GDG Montreal meetings
• See you in our next events !
Chrome dev summit summaryTo be continued…
To be continued…
To be continued…
To be continued…
To be continued…
