Upgrade to Pro — share decks privately, control downloads, hide ads and more …
Sign up for free

Going Progressive with Ember

Avatar for Samanta de Barros Samanta de Barros
March 28, 2017
Programming
780
0

Going Progressive with Ember

Avatar for Samanta de Barros

Samanta de Barros

March 28, 2017

Other Decks in Programming

See All in Programming
Streamlitで実現する自然言語データアプリ開発
Avatar for Ayumu Yamaguchi ayumu_yamaguchi
1
330
Unity6 URPによる海底をテーマにしたVJシステムの解説 | Unity Shader 完全に理解した 勉強会
Avatar for がむ gam0022
0
290
Intent as Code
Avatar for Shoppingjaws shoppingjaws
6
1.1k
MVNOの申込からeSIM開通までをiOSアプリでつなぐ- 本人確認・MNP・通信事業者基盤をまたぐ実装
Avatar for Sato Takeshi satotakeshi
0
520
Apple Intelligence を用いた個人情報誤送信防止、及びユーザーリクエスト体験の改善について
Avatar for Yuki Kuwashima yukiny
0
270
標準パッケージに uuid が追加された 背景から見る Go らしい意思決定 / go_127_uuid_decision
Avatar for convto convto
5
9.4k
AGENTS.md Is Not Enough: Build Skills, Don't Download Them
Avatar for Alex T lx_t
0
130
スマートフォンでモールス信号を送受信する 〜スマートフォンのLEDとカメラで作る光通信の設計と実装〜
Avatar for Atsuki Seo atsuki_seo
0
220
20260914 AIエージェント時代のPlatform Engineering　LLM基盤とプロダクトの責務境界線
Avatar for Taiki Kanzaki kanfab1
7
2.3k
WebRTC映像をAirPlayに対応させる挑戦.pdf
Avatar for monolithic-adam monolithic_adam
0
330
すこし踏み込む CancellationToken
Avatar for tkym htkym
2
1.6k
マイコン向けの軽量Ruby「PicoRuby」で各種デバイスを制御するネイティブアプリの実現手法
Avatar for bash0C7 bash0c7
0
470

Featured

See All Featured
Art, The Web, and Tiny UX
Avatar for Lynn Fisher lynnandtonic
304
22k
Typedesign – Prime Four
Avatar for Hannes Fritz hannesfritz
42
3.2k
Testing 201, or: Great Expectations
Avatar for Joseph Mastey jmmastey
46
8.3k
Taking LLMs out of the black box: A practical guide to human-in-the-loop distillation
Avatar for Ines Montani inesmontani
PRO
3
2.4k
Pawsitive SEO: Lessons from My Dog (and Many Mistakes) on Thriving as a Consultant in the Age of AI
Avatar for David Carrasco davidcarrasco
0
250
Six Lessons from altMBA
Avatar for Skipper Chong Warson skipperchong
29
4.5k
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto WADA twada
PRO
120
120k
Rebuilding a faster, lazier Slack
Avatar for samanthasiow samanthasiow
85
9.7k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
440
Are puppies a ranking factor?
Avatar for Jono Alderson jonoalderson
2
4k
Marketing to machines
Avatar for Jono Alderson jonoalderson
1
5.8k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
390

Transcript

  1. GOING PROGRESSIVE WITH SAMANTA DE BARROS EMBERCONF 2017

  2. +

  3. PROGRESSIVE WEB APP CARMELO, URUGUAY

  4. “Progressive Web Apps take advantage of new technologies to bring

    the best of mobile sites & native apps to users. They’re reliable, fast, and engaging. They originate from a secure origin and load regardless of network state.“ - Addy Osmani

  5. I HAVE A DREAM…

  6. None
  7. None
  8. None
  9. None

  10. PROGRESSIVE WEB APP? LA PEDRERA, URUGUAY

  11. LOOKS GOOD

  12. LOOKS GOOD INSTALLS ON DEVICE

  13. LOOKS GOOD INSTALLS ON DEVICE WORKS OFFLINE

  14. LOOKS GOOD INSTALLS ON DEVICE WORKS OFFLINE WORKS FAST

  15. PUNTA DEL ESTE, URUGUAY LOOKS GOOD?

  16. NATIVE VS WEB

  17. PUNTA DEL DIABLO, URUGUAY INSTALLS ON DEVICE?

  18. THE WEB APP MANIFEST

  19. None
  20. None
  21. None
  22. None
  23. None

  24. BEFORE

  25. AFTER

  26. None
  27. None

  28. BEFORE

  29. AFTER

  30. None

  31. ember-web-app Generates App Manifest and iOS tags from config file

    github: san650/ember-web-app

  32. config/manifest.js

  33. LOOKS GOOD INSTALLS ON DEVICE WORKS OFFLINE WORKS FAST

  34. WORKS OFFLINE? LA PEDRERA, URUGUAY

  35. None

  36. THE SERVICE WORKER

  37. It’s a script Runs in the background Doesn't need a

    web page or user interaction
  38. None
  39. None
  40. None
  41. None

  42. SAVE ASSETS ON INSTALL EVENT

  43. SAVE ASSETS ON INSTALL EVENT INTERCEPT EVERY REQUEST

  44. SAVE ASSETS ON INSTALL EVENT INTERCEPT EVERY REQUEST BACKGROUND SYNC

  45. SAVE ASSETS ON INSTALL EVENT INTERCEPT EVERY REQUEST BACKGROUND SYNC

    PUSH NOTIFICATIONS

  46. SAVE ASSETS ON INSTALL EVENT INTERCEPT EVERY REQUEST BACKGROUND SYNC

    PUSH NOTIFICATIONS ALL YOU CAN DREAM OF

  47. ember-service-worker broccoli-serviceworker

  48. ember-service-worker Plugable approach Base addon just registers SW Add plugins

    for different cache strategies github: dockyard/ember-service-worker

  49. ember-service-worker ember-service-worker-index ember-service-worker-asset-cache ember-service-worker-cache-fallback

  50. broccoli-serviceworker Generates SW based on configuration Pre-caches app files by

    default github: jkleinsc/broccoli-serviceworker

  51. app/config/environment.js

  52. None
  53. None
  54. None
  55. None

  56. BEFORE

  57. AFTER

  58. AFTER

  59. None

  60. Chrome 37.7% MOBILE BROWSER USAGE WORLDWIDE Safari 22.2% Firefox 0.1%

    IE 0.1% Samsung Internet 5.4% Opera 8.6% http://gs.statcounter.com/browser-market-share/mobile-tablet/worldwide/#monthly-201602-201702-bar

  61. MOBILE BROWSER USAGE Safari 55.9% Chrome 31.4% USA http://gs.statcounter.com/browser-market-share/mobile-tablet/united-states-of-america/#monthly-201602-201702-bar

  62. None

  63. THE APPLICATION CACHE

  64. None
  65. None
  66. None
  67. None

  68. Generates appcache manifest with app resources Can be configured to

    ignore certain paths broccoli-manifest github: racido/broccoli-manifest

  69. app/config/environment.js

  70. USER DATA OFFLINE?

  71. LOCAL STORAGE

  72. LOCAL STORAGE WEBSQL

  73. LOCAL STORAGE WEBSQL INDEXED DB

  74. LOCAL STORAGE WEBSQL INDEXED DB LOCAL FORAGE (WRAPS ALL 3)

  75. ember-localstorage-adapter ember-localforage-adapter ember-pouch

  76. ember-localstorage-adapter Ember data adapter for local storage Local storage: key/value

    pair store, works with strings github: locks/ember-localstorage-adapter

  77. ember-localforage-adapter github: genkgo/ember-localforage-adapter Ember data adapter for local forage LocalForage:

    wrapper for indexedDb and WebSQL that falls back to local storage

  78. ember-pouch Ember Data for PouchDB/ CouchDB Saves data client side

    to IndexedDB or WebSQL Can sync to PouchDB github: nolanlawson/ember-pouch

  79. LOOKS GOOD INSTALLS ON DEVICE WORKS OFFLINE WORKS FAST

  80. DOES IT WORK FAST? MONTEVIDEO, URUGUAY

  81. NATIVE VS PWA

  82. FIRST PAGE RENDER

  83. ember-cli-fastboot Server side rendering Still beta github: ember-fastboot/ember-cli-fastboot

  84. SECOND PAGE RENDER

  85. Service Worker / App Cache

  86. TIME TO INTERACTION

  87. Allows composition of apps into a single app Lazy loading

    of engines ember-engines github: ember-engines/ember-engines

  88. TOOLS JOSE IGNACIO, URUGUAY

  89. LIGHTHOUSE

  90. None
  91. None

  92. web manifest + service worker + app cache

  93. None

  94. + fastboot

  95. None

  96. + ember-engines?

  97. None

  98. BACK TO THAT DREAM… PUNTA DEL ESTE, URUGUAY

  99. 1. IT IS POSSIBLE

  100. 1. IT IS POSSIBLE 2. IT IS DOABLE WITH EMBER

  101. 1. IT IS POSSIBLE 2. IT IS DOABLE WITH EMBER

    3. IT CAN GET EVEN BETTER

  102. WE NEED YOUR HELP!

  103. THANKS! @sami_dbc @sdebarros CABO POLONIO, URUGUAY