Upgrade to Pro — share decks privately, control downloads, hide ads and more …

[this.javascript] State of Chrome

[this.javascript] State of Chrome

The rest of the presentation that I didn't get too :)

B590f0fb3aba34aee093cfa1406eac0b?s=128

Paul Kinlan

November 14, 2017
Tweet

Transcript

  1. Paul Kinlan @paul_kinlan

  2. None
  3. None
  4. 97% 150% Increase in engagement for Add to Home Screen

    users Overall increase in 
 conversions
  5. None
  6. Firefox Chrome Opera Samsung Internet UC Browser 360 Browser Baidu

    Mobile App Service Worker Support
  7. Service Worker Support Edge WebKit In Development!

  8. developers.google.com/web/tools/workbox

  9. self.addEventListener('fetch', event => {
 event.respondWith(
 caches.open('my-cache').then(cache => {
 return cache.match(event.request).then(cacheResponse

    => {
 const fetchPromise = fetch(event.request).then(response => {
 cache.put(event.request, response.clone());
 return response;
 })
 return cacheResponse || fetchPromise;
 });
 })
 );
 });
  10. workboxSW.strategies.staleWhileRevalidate();

  11. 5s

  12. None
  13. % of Pages Loaded via HTTPS in Chrome 10% 20%

    30% 40% 50% 60% 70% March 2015 October 2017 Android Windows
  14. None
  15. Autofill

  16. PaymentRequest

  17. None
  18. & Google Payment API developers.google.com/payment PaymentRequest

  19. One-Tap Sign-In Sign-Up & developers.google.com/identity

  20. None
  21. None
  22. Image Gallery

  23. MediaStream

  24. None
  25. Web Share API

  26. Native notifications

  27. Connected across devices Presentation API

  28. Connected across devices BLE API

  29. None
  30. Web Share Web Bluetooth Add to Home screen Background Download

    Web Authentication Shape Detection Web USB Presentation API Generic Sensor API Payment Handler Web NFC Share Target
  31. None
  32. Custom Tabs

  33. Trusted 
 Web Activity

  34. None
  35. Trusted 
 Web Activity

  36. Trusted 
 Web Activity

  37. Desktop PWA

  38. None
  39. None
  40. 22% Faster on Speedometer 5% Faster on top 25 websites

    40% Faster on ARES6
  41. None
  42. None
  43. None
  44. None
  45. None
  46. CSS Grid Layout Inspection

  47. Color contrast evaluation

  48. Top-level await in console

  49. Performance monitor

  50. Service Workers upgrades

  51. Lighthouse

  52. None
  53. github.com/GoogleChrome/puppeteer

  54. None
  55. Chrome User Experience Report

  56. None
  57. chromestatus.com

  58. developers.google.com/web/

  59. Thanks! Paul Kinlan @paul_kinlan