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

Blurring the Line Between Native and Web (Droidcon DE 2018)

54879f243e5b72eedb2d379bed6fda27?s=47 Jake Wharton
PRO
June 26, 2018
Technology
16
4.4k

Blurring the Line Between Native and Web (Droidcon DE 2018)

Video: https://youtu.be/yd-Xztr4fyY

54879f243e5b72eedb2d379bed6fda27?s=128

Jake Wharton
PRO

June 26, 2018
Tweet

More Decks by Jake Wharton

See All by Jake Wharton
What's new in Java 19: The end of Kotlin? (KotlinConf 2019)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
6
7.2k
Diffusing Changes in Your APKs (Droidcon Toronto 2019)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
5
3.8k
Using Kotlin/JS and Kotlin/Native on Android (Droidcon NYC 2019)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
4
6k
Mechanisms of Metaprogramming (Chicago Roboto 2019)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
5
7.1k
Kotlin: Write Once, Run Actually Everywhere (QCon SF 2018)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
19
3.8k
Helping Dagger Help You (Droidcon UK 2018)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
22
19k
A Multiplatform Delight (KotlinConf 2018)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
18
2.1k
Digging Into D8 and R8 (Droidcon NYC 2018)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
30
9.1k
Rinsing the Brush – Picasso 3.0 (Droidcon NYC 2018)
54879f243e5b72eedb2d379bed6fda27?s=48 jakewharton
PRO
18
2.6k

Other Decks in Technology

See All in Technology
情報の世界 2022年度 第11回「都市のデータ」 #情報の世界 / Data of City 2022
65241d0356dc5a93b0fec68bcf7b42ac?s=48 yumulab
0
110
要約 "Add Live Text interaction to your app"
9e64d2069945742c818421e884603b44?s=48 ushisantoasobu
0
150
Retca Cloud
7e116e0bb743dee7e0a906f01bd44082?s=48 bau
0
580
20220628event_ogura_part
E55fbffb4afd0a84d36c945ed68d8c19?s=48 caddi_eng
0
150
AWS Cognito で開発環境を守る
B16717ef4b7aab0b253d933c3934f280?s=48 mixi_engineers
PRO
0
120
さいきんのRaspberry Pi。 / osc22do-rpi
74476e142a767a018d68c5e72e34ee2f?s=48 akkiesoft
6
5.4k
Camp Digital 2022: tailored advice
8fadc4cc83e533c19a6d13db9d46cb3e?s=48 kyliehavelock
0
150
Lessons Learned from Scaling Infrastructure as Code
Be8b596c46f4c9a1aec6a7586af33134?s=48 joatmon08
0
800
【個人的】オブジェクト指向の現在地
6ab47a68ee78e84c34731ce12333deff?s=48 toranoana
0
200
ノーコードで Stripeを使いこなす３つの方法 / jp-stripes-online-vol-4
E77ca94266ffd3d69f8aee91f7468264?s=48 stripehideokamoto
0
320
MoT TechTalk #12 タクシーアプリ『GO』大規模トラフィックを捌く分析データ基盤の全容に迫る！
44a210d1299a727e9d601a47dfedeabf?s=48 mot_techtalk
1
430
ドメイン知識の蓄積が開発に起こす100のこと
6836f7627632154de0d1a788a4461680?s=48 codmoninc
0
120

Featured

See All Featured
Mobile First: as difficult as doing things right
0fe2973fa8d27d96547e43322341183a?s=48 swwweet
213
7.5k
Reflections from 52 weeks, 52 projects
E43f8dfd01057f8304f5f8fb9a294d7d?s=48 jeffersonlam
337
17k
Scaling GitHub
78b475797a14c84799063c7cd073962f?s=48 holman
451
140k
WebSockets: Embracing the real-time Web
E76911cbe088e5b850d966de3fc7435b?s=48 robhawkes
57
5.4k
Designing with Data
F57e2136eb9895eb95ff5dc8a1c02677?s=48 zakiwarfel
91
3.9k
Making Projects Easy
C4de88ea47538e4594750e3861a341c8?s=48 brettharned
98
4.3k
Statistics for Hackers
56c4053438af8e8b90d6f53cbb7573be?s=48 jakevdp
781
210k
Intergalactic Javascript Robots from Outer Space
6804f1775cb4babfcc3851298566fbce?s=48 tanoku
261
25k
Atom: Resistance is Futile
7fa6101cd43067653cf4ac6c7ca54305?s=48 akmur
255
20k
jQuery: Nuts, Bolts and Bling
9cde37f47e4a800ea081ea42de8d749a?s=48 dougneiner
56
6.4k
How STYLIGHT went responsive
F716e5f737fcfb03f2cf8d1a184f1dbe?s=48 nonsquared
85
3.9k
Pencils Down: Stop Designing & Start Developing
79acae287842acf29084005533a7fb3b?s=48 hursman
112
9.8k

Transcript

  1. #NATIVE&WEB @JAKEWHARTON

  2. None
  3. None
  4. None
  5. None
  6. None
  7. None
  8. None

  9. JavaScriptCore

  10. JavaScriptCore JNI

  11. JavaScriptCore VM / Main Thread JNI

  12. JavaScriptCore UI Toolkit VM / Main Thread JNI

  13. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore

  14. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

  15. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread

  16. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit

  17. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit V8

  18. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit V8 DOM

  19. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit V8 DOM

  20. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit V8 DOM

  21. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit V8 DOM

  22. JavaScriptCore UI Toolkit VM / Main Thread JNI JavaScriptCore Runtime

    Main Thread UI Toolkit V8 DOM

  23. JavaScriptCore JNI JavaScriptCore Runtime V8

  24. V8 JNI JavaScriptCore Runtime V8

  25. Duktape JNI JavaScriptCore Runtime V8

  26. Duktape JNI JavaScriptCore Runtime V8

  27. Duktape JNI JavaScriptCore Runtime V8

  28. React Native Platform Duktape JNI JavaScriptCore Runtime V8

  29. JS Engine + Abstraction Your App Duktape JNI JavaScriptCore Runtime

    V8
  30. None
  31. None
  32. None
  33. None

  34. Shared Library + Abstraction Your App

  35. Shared Library + Abstraction Your App ????

  36. None
  37. None
  38. None
  39. None

  40. Multiplatform Abstraction Your App

  41. Your App

  42. Your App

  43. J2ObjC

  44. J2ObjC

  45. J2ObjC

  46. None
  47. None
  48. None
  49. None
  50. None
  51. None
  52. None
  53. None
  54. None
  55. None
  56. None
  57. None
  58. None
  59. None
  60. None
  61. None
  62. None
  63. None
  64. None

  65. app feature 1 feature 2 feature 3

  66. app feature 1 feature 2 feature 3 myapp.apk

  67. app feature 1 feature 2 feature 3 myapp.apk base.apk

  68. app feature 1 feature 2 feature 3 myapp.apk base.apk feature1.apk

  69. app feature 1 feature 2 feature 3 myapp.apk base.apk feature1.apk

    HTML CSS JS PNG PNG /index.html HTML /feature1.html

  70. app feature 1 feature 2 feature 3

  71. feature 1 feature 2 feature 3

  72. feature 2 feature 3

  73. feature 3

  74. None

  75. DEX DEX DEX DEX

  76. DEX ARM x86 DEX DEX DEX

  77. DEX ARM x86 en-US de DEX DEX DEX en-US en-US

    en-US de de de

  78. app_arm_en-US.apk DEX ARM en-US DEX en-US DEX en-US DEX en-US

    DEX en-US de DEX en-US de ARM x86 en-US de DEX en-US de DEX

  79. app_arm_en-US.apk DEX ARM en-US DEX en-US DEX en-US DEX en-US

    DEX en-US de DEX en-US de ARM x86 en-US de DEX en-US de DEX de de de de app_de.apk

  80. DEX en-US de DEX en-US de ARM x86 en-US de

    DEX en-US de DEX ARM en-US DEX DEX en-US de

  81. DEX en-US de DEX en-US de ARM x86 en-US de

    DEX en-US de DEX ARM en-US DEX base_arm_en-US.apk DEX en-US

  82. DEX en-US de DEX en-US de ARM x86 en-US de

    DEX en-US de DEX ARM en-US DEX base_arm_en-US.apk DEX en-US feature1_arm_en-US.apk

  83. ARM en-US DEX base_arm_en-US.apk DEX en-US feature1_arm_en-US.apk HTML CSS JS

    PNG PNG /index.html HTML /feature1.html
  84. None
  85. None
  86. None
  87. None
  88. None
  89. None
  90. None
  91. None
  92. None
  93. None
  94. None
  95. None
  96. None
  97. None
  98. None
  99. None
  100. None
  101. None

  102. native_app.apk DEX ... ART

  103. native_app.apk DEX ... ART Int JIT AOT

  104. native_app.apk DEX ... ART Int JIT AOT CPU

  105. native_app.apk DEX ... ART ART Int JIT AOT CPU chrome.apk

    ... DEX

  106. native_app.apk DEX ... ART ART V8 Int JIT AOT CPU

    chrome.apk ... DEX

  107. native_app.apk DEX ... ART ART V8 Int JIT AOT CPU

    chrome.apk ... DEX ... JS cache/

  108. native_app.apk DEX ... ART ART V8 Int JIT AOT CPU

    Int JIT chrome.apk ... DEX ... JS cache/

  109. native_app.apk DEX ... ART ART V8 Int JIT AOT CPU

    CPU Int JIT chrome.apk ... DEX ... JS cache/

  110. native_app.apk DEX ... ART ART V8 Int JIT AOT CPU

    CPU Int JIT JIT & AOT cache chrome.apk ... DEX ... JS cache/

  111. native_app.apk DEX ... ART ART V8 Int JIT AOT CPU

    CPU Int JIT JIT & AOT cache chrome.apk ... DEX ... JS cache/
  112. None

  113. Shared Library + Abstraction Your App ????

  114. Shared Library + Abstraction Your App WASM

  115. Multiplatform Abstraction Your App

  116. Multiplatform Abstraction Your App WASM

  117. ART V8 CPU Int JIT chrome.apk ... DEX ... JS

    cache/

  118. ART V8 CPU Int JIT chrome.apk ... DEX ... JS

    cache/

  119. ART V8 CPU Int JIT chrome.apk ... DEX ... JS

    cache/ airhorner.apk ... DEX
  120. None
  121. None
  122. None
  123. None

  124. ART V8 CPU Int JIT chrome.apk ... DEX ... JS

    cache/

  125. ART V8 CPU Int JIT airhorner.apk ... DEX ... JS

    cache/

  126. ART V8 CPU Int JIT airhorner.apk ... DEX ... JS

    cache/ JIT & AOT cache
  127. None
  128. None
  129. None
  130. None
  131. None

  132. app.apk

  133. app.aab app.apk

  134. app.aab app.apk

  135. app.aab app.apk

  136. app.ipa app.aab app.apk

  137. app.ipa app.aab app.apk

  138. app.ipa app.aab app.apk

  139. website/ index.html feature1.html feature2.html feature3.html app.js styles.css app.ipa app.aab app.apk

  140. app-fat.jar website/ index.html feature1.html feature2.html feature3.html app.js styles.css app.ipa app.aab

    app.apk
  141. None
  142. None

  143. apk via aab via url

  144. apk via aab via url

  145. apk via aab via url apk via aab via url

  146. apk via aab via url apk via aab via url

  147. apk apk via aab via url apk via aab via

    url

  148. apk apk via aab via url apk via aab via

    url

  149. apk via aab apk apk via aab via url apk

    via aab via url

  150. apk via aab apk apk via aab via url apk

    via aab via url

  151. apk via aab apk via aab apk apk via aab

    via url apk via aab via url

  152. apk via aab apk via aab apk apk via aab

    via url apk via aab via url

  153. apk via aab apk via aab apk apk via aab

    via url apk via aab via url Chrome app

  154. apk via aab apk via aab apk apk via aab

    via url apk via aab via url Chrome app

  155. apk via aab apk via aab apk apk via aab

    via url apk via aab via url Chrome app url

  156. apk via aab apk via aab apk apk via aab

    via url apk via aab via url Chrome app url

  157. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url

  158. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url

  159. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url

  160. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url

  161. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url

  162. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url ipa url

  163. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url ipa url

  164. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url ipa url

  165. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url ipa url

  166. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url pwa ipa url

  167. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url pwa ipa url

  168. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url pwa ipa ipa url

  169. apk via aab apk via aab apk webapk apk via

    aab via url apk via aab via url Chrome app url url pwa ipa ipa url

  170. apk via aab apk via aab apk webapk apk via

    aab via url url apk via aab via url Chrome app url url pwa ipa ipa url url

  171. #NATIVE&WEB @JAKEWHARTON