Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Universal Applications
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Stepan Parunashvili
March 06, 2016
Technology
1
91
Universal Applications
Talk on Universal (Isomorphic) Applications at Spotlight React
Stepan Parunashvili
March 06, 2016
Tweet
Share
More Decks by Stepan Parunashvili
See All by Stepan Parunashvili
Scaling React Applications
stopachka
2
100
Universal Applications
stopachka
0
80
Engineering Growth
stopachka
0
59
ES2015 & React
stopachka
0
61
ES2015
stopachka
0
65
Other Decks in Technology
See All in Technology
~Everything as Codeを諦めない~ 後からCDK
mu7889yoon
3
280
入社1ヶ月でデータパイプライン講座を作った話
waiwai2111
1
250
クレジットカード決済基盤を支えるSRE - 厳格な監査とSRE運用の両立 (SRE Kaigi 2026)
capytan
6
2.6k
ブロックテーマでサイトをリニューアルした話 / 2026-01-31 Kansai WordPress Meetup
torounit
0
450
コスト削減から「セキュリティと利便性」を担うプラットフォームへ
sansantech
PRO
3
1.4k
Bedrock PolicyでAmazon Bedrock Guardrails利用を強制してみた
yuu551
0
160
こんなところでも(地味に)活躍するImage Modeさんを知ってるかい?- Image Mode for OpenShift -
tsukaman
0
110
OCI Database Management サービス詳細
oracle4engineer
PRO
1
7.4k
データの整合性を保ちたいだけなんだ
shoheimitani
8
3k
Amazon S3 Vectorsを使って資格勉強用AIエージェントを構築してみた
usanchuu
3
440
Stately
mu7889yoon
1
110
SREのプラクティスを用いた3領域同時 マネジメントへの挑戦 〜SRE・情シス・セキュリティを統合した チーム運営術〜
coconala_engineer
2
610
Featured
See All Featured
How to Think Like a Performance Engineer
csswizardry
28
2.4k
Prompt Engineering for Job Search
mfonobong
0
160
The Power of CSS Pseudo Elements
geoffreycrofte
80
6.2k
Chasing Engaging Ingredients in Design
codingconduct
0
110
Agile that works and the tools we love
rasmusluckow
331
21k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
26
3.3k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.7k
Scaling GitHub
holman
464
140k
Building AI with AI
inesmontani
PRO
1
680
It's Worth the Effort
3n
188
29k
The browser strikes back
jonoalderson
0
360
The SEO identity crisis: Don't let AI make you average
varn
0
64
Transcript
Universal Applications Stepan Parunashvili 1
@stopachka www.stepanp.com 2 Who am I?
@stopachka www.stepanp.com 3 Who am I?
Universal Applications 4
Isomorphic? 5
6
7
8
Isomorphic 9
Universal 10
11
...2015 12
...2014 13
...2013 14
...2012 15
...2011 16
...2010 17
...2009 18
2008 19
20
21 v2.2.2
22
23
24 javascript?
25 javascript
26
27 routing validation views
28 routing validation views c00l animations
29 routing validation views c00l animations (in some browsers...b^.^d)
30
31
2009... 32
2010 33
34
35 v0.1.0
36
37
38
39
40 routing validation views
41 ...routing ...validation ...views routing validation views
42
43
44
is it just the way things are? 45
46
47
48 routing validation views
49
50 what if we made our own representation of the
dom...
...React! 51
win 1: code sharing 52
win 2: perceived performance 53
win 3: SEO 54
Can we build this? 55
*rolls up sleeves* 56
57 server.js
58 server.js
59 server.js
60 server.js
61
62
63 server.js
64 server.js
65 server.js
66
Time to react 67
68 components.js
69 server.js
70 server.js
71 server.js
72 server.js
73
74 components.js
75 components.js
76 components.js
77
78 server.js
79 server.js
80 server.js
81 load client side react client.js
82
...Now the views are shared 83
What's the catch? 84
build tools (webpack, babel & family) 85
Time to route 86
87 client.js
ReactRouter 88
89 server.js
90 server.js
91 components.js
92 load client side react components.js
93 load client side react routes.js
94 load client side react client.js
95 load client side react client.js
show it working 96
97
98
disable js 99
100 server.js
101 server.js server.js
show it working 102
How about data fetching? 103
104 api.js
105 api.js
106 components.js
107 server.js
108 server.js
109 server.js
110 server.js
111 server.js
112 client.js
113 client.js
114 client.js
115 client.js
...but there's a library for that 116
react-resolver 117
is it all rosy? 118
not really 119
but the payoff? 120
121
122
123
124 routing validation views
wait... single-threaded backend? 125
Clojurescript anyone? 126
that's it : ) 127
Questions? 128