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

Universal Applications

Avatar for Stepan Parunashvili Stepan Parunashvili
March 06, 2016
Technology
110
1

Universal Applications

Talk on Universal (Isomorphic) Applications at Spotlight React

Avatar for Stepan Parunashvili

Stepan Parunashvili

March 06, 2016

More Decks by Stepan Parunashvili

See All by Stepan Parunashvili
Scaling React Applications
Avatar for Stepan Parunashvili stopachka
2
140
Universal Applications
Avatar for Stepan Parunashvili stopachka
0
100
Engineering Growth
Avatar for Stepan Parunashvili stopachka
0
87
ES2015 & React
Avatar for Stepan Parunashvili stopachka
0
87
ES2015
Avatar for Stepan Parunashvili stopachka
0
92

Other Decks in Technology

See All in Technology
[dbts2026]数十PBの超巨大データ×AI活用を支えるSnowflakeの実力〜大規模環境におけるアーキテクチャと運用のリアル〜
Avatar for Matsubara y_matsubara
0
130
The future of architectural work
Avatar for Uwe Friedrichsen ufried
0
190
[JAWS Festa 2026]一番いい仕事は、請求書に現れない / jawsfesta2026
Avatar for sh_fk2 sh_fk2
2
430
AIコーディングはじめました
Avatar for 田中みそ miso
0
160
In-Context Learning再入門。ICLの勾配降下的解釈の研究動向を追ってみる。
Avatar for Fukushima Daisuke dai08srhg
1
780
Kiro を使うコツ (頼み方、覚えさせ方、任せ方) | 目指せ Kiro マスター 09
Avatar for Riku INADA inariku
PRO
3
120
The Author Pays
Avatar for James Thomas hiccupps
0
150
AWSを利用する上で知っておきたい名前解決の話 2026
Avatar for nagisa_53 nagisa53
5
3.3k
bpf_arenaとstruct_opsを使うのが難しかった話
Avatar for KANAI Masumi masu_mi
0
220
AIエージェントの監視、思考を見るか行動を見るか / Monitoring AI Agents: Thoughts or Actions
Avatar for Yusuke Shimizu yusukeshimizu
2
180
JAWSコミュニティに 参加して1年経った結果
Avatar for ssakita ssakita
0
120
AI Agent 時代のデータ基盤： ClickHouse で実現する 超高速分析とコスト削減の両立
Avatar for jozono jozono
0
220

Featured

See All Featured
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
Avatar for r-kagaya rkaga
63
48k
技術選定の審美眼（2025年版） / Understanding the Spiral of Technologies 2025 edition
Avatar for Takuto WADA twada
PRO
121
130k
SEO in 2025: How to Prepare for the Future of Search
Avatar for Michael King ipullrank
3
3.9k
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
750
Breaking role norms: Why Content Design is so much more than writing copy - Taylor Woolridge
Avatar for UX Y'all uxyall
1
520
How to Talk to Developers About Accessibility
Avatar for Jason CranfordTeague jct
2
620
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
Avatar for Aleyda Solis aleyda
1
1.4k
Navigating the Design Leadership Dip - Product Design Week Design Leaders+ Conference 2024
Avatar for Andy Polaine apolaine
2
510
Intergalactic Javascript Robots from Outer Space
Avatar for Vicent Martí tanoku
273
28k
Navigating Weather and Climate Data
Avatar for Ryan Abernathey rabernat
0
590
The untapped power of vector embeddings
Avatar for Frank van Dijk frankvandijk
2
2k
Rails Girls Zürich Keynote
Avatar for Gregor Martynus gr2m
96
14k

Transcript

  1. Universal Applications Stepan Parunashvili 1

  2. @stopachka www.stepanp.com 2 Who am I?

  3. @stopachka www.stepanp.com 3 Who am I?

  4. Universal Applications 4

  5. Isomorphic? 5

  6. 6

  7. 7

  8. 8

  9. Isomorphic 9

  10. Universal 10

  11. 11

  12. ...2015 12

  13. ...2014 13

  14. ...2013 14

  15. ...2012 15

  16. ...2011 16

  17. ...2010 17

  18. ...2009 18

  19. 2008 19

  20. 20

  21. 21 v2.2.2

  22. 22

  23. 23

  24. 24 javascript?

  25. 25 javascript

  26. 26

  27. 27 routing validation views

  28. 28 routing validation views c00l animations

  29. 29 routing validation views c00l animations (in some browsers...b^.^d)

  30. 30

  31. 31

  32. 2009... 32

  33. 2010 33

  34. 34

  35. 35 v0.1.0

  36. 36

  37. 37

  38. 38

  39. 39

  40. 40 routing validation views

  41. 41 ...routing ...validation ...views routing validation views

  42. 42

  43. 43

  44. 44

  45. is it just the way things are? 45

  46. 46

  47. 47

  48. 48 routing validation views

  49. 49

  50. 50 what if we made our own representation of the

    dom...

  51. ...React! 51

  52. win 1: code sharing 52

  53. win 2: perceived performance 53

  54. win 3: SEO 54

  55. Can we build this? 55

  56. *rolls up sleeves* 56

  57. 57 server.js

  58. 58 server.js

  59. 59 server.js

  60. 60 server.js

  61. 61

  62. 62

  63. 63 server.js

  64. 64 server.js

  65. 65 server.js

  66. 66

  67. Time to react 67

  68. 68 components.js

  69. 69 server.js

  70. 70 server.js

  71. 71 server.js

  72. 72 server.js

  73. 73

  74. 74 components.js

  75. 75 components.js

  76. 76 components.js

  77. 77

  78. 78 server.js

  79. 79 server.js

  80. 80 server.js

  81. 81 load client side react client.js

  82. 82

  83. ...Now the views are shared 83

  84. What's the catch? 84

  85. build tools (webpack, babel & family) 85

  86. Time to route 86

  87. 87 client.js

  88. ReactRouter 88

  89. 89 server.js

  90. 90 server.js

  91. 91 components.js

  92. 92 load client side react components.js

  93. 93 load client side react routes.js

  94. 94 load client side react client.js

  95. 95 load client side react client.js

  96. show it working 96

  97. 97

  98. 98

  99. disable js 99

  100. 100 server.js

  101. 101 server.js server.js

  102. show it working 102

  103. How about data fetching? 103

  104. 104 api.js

  105. 105 api.js

  106. 106 components.js

  107. 107 server.js

  108. 108 server.js

  109. 109 server.js

  110. 110 server.js

  111. 111 server.js

  112. 112 client.js

  113. 113 client.js

  114. 114 client.js

  115. 115 client.js

  116. ...but there's a library for that 116

  117. react-resolver 117

  118. is it all rosy? 118

  119. not really 119

  120. but the payoff? 120

  121. 121

  122. 122

  123. 123

  124. 124 routing validation views

  125. wait... single-threaded backend? 125

  126. Clojurescript anyone? 126

  127. that's it : ) 127

  128. Questions? 128