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
JavaScript Server Runtime History
Search
Yosuke Furukawa
PRO
October 20, 2023
Programming
8
2.9k
JavaScript Server Runtime History
2023/10/20 虎の穴ラボで発表した JavaScript Server Runtime の歴史です。
Yosuke Furukawa
PRO
October 20, 2023
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
AppRouter Panel Talk
yosuke_furukawa
PRO
1
430
Node.js v22 で変わること
yosuke_furukawa
PRO
11
3.9k
リアーキテクトと開発生産性について
yosuke_furukawa
PRO
22
8.2k
tc39 x jsconf.jp Panel Discussion
yosuke_furukawa
PRO
0
1.1k
フロントエンドの開発生産性とは
yosuke_furukawa
PRO
16
9.7k
7 principles for rich web apps And how next.js achieves these principles
yosuke_furukawa
PRO
6
2.3k
Deep Dive International Conference
yosuke_furukawa
PRO
0
100
フロントエンドのDXと今後
yosuke_furukawa
PRO
6
3.8k
フロントエンドリアーキテクトの話
yosuke_furukawa
PRO
18
8.9k
Other Decks in Programming
See All in Programming
Elm Form Validation
bkuhlmann
0
510
使ってみよう Azure AI Document Intelligence
kosmosebi
2
350
try! Swift Tokyo 2024 参加報告 / try! Swift Tokyo 2024 Report
hironytic
0
210
Anthropic Cookbook のおすすめレシピ
schroneko
7
1.1k
dbtのドメイン分割による データ基盤の改善とDigdagとの連携
sakama
0
430
Code Reviews
bkuhlmann
4
890
Polars入門
daikikatsuragawa
1
160
ADRを一年運用してみた/adr_after_a_year
hanhan1978
7
2.4k
Fragment Composition of GraphQL
quramy
13
1.4k
Goのmultiple errorsについて (2024年4月版)
syumai
4
1.1k
Site Reliability Engineering for GMO
pyama86
8
1.1k
Domain-Driven Transformation
hschwentner
2
1.5k
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
117
18k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
660
120k
Documentation Writing (for coders)
carmenintech
61
4k
Design by the Numbers
sachag
274
18k
Statistics for Hackers
jakevdp
790
220k
Optimizing for Happiness
mojombo
370
69k
Fantastic passwords and where to find them - at NoRuKo
philnash
38
2.5k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
33
6k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
155
14k
The Brand Is Dead. Long Live the Brand.
mthomps
49
29k
Visualization
eitanlees
137
14k
What’s in a name? Adding method to the madness
productmarketing
PRO
17
2.7k
Transcript
JavaScript Server Runtime History 2023/10/20 @ toranoana
X(Twitter): @yosuke_furukawa GitHub: yosuke-furukawa
+4$POGKQ͡·Γ·͢ʔʂ
߽՚εϐʔΧʔਞ
NodeֶԂࡇ 2011 Ryan Dahl changed my life.
JavaScript Server Runtime ͷ ྺ࢙ʹ͍ͭͯ • 90͔Βݱ·ͰৼΓฦΔ • ࠓޙͲ͏͍͏ྲྀΕ͕͋Δ͔ɺͲ͏ͳΔ͔Λ༧ଌ ͢Δ
• ྺ࢙ͬͯ໘ന͍ͷͰݟͯཉ͍͠ • ͍ͨ͜͠ͱΛ͢ɺͳΜ͔ͨΊʹͳΔ͕ฉ͚ Δͱࢥ͍͚ͬͯͳ͍
1995: JavaScript was born
1995 • JavaScript ੜ • Netscape Navigator 2.0 Beta ൛ʹಉࠝ
• ޙʹ 1996ʹਖ਼ࣜϦϦʔε൛͕ൃද
#SFBOEBO&JDIࢯͷϗʔϜϖʔδ ྺ࢙Λײ͡ΔσβΠϯ
1995 • ͔͜͜Β࠷ॳͷ Browser War ͕ى͖Δ • ͍ΘΏΔ Internet Explorer
ਞӦ vs Netscape ਞӦ • ྺ࢙Ͱݴ͏ͱؔέݪͷઓ͍นͷઓ͍ • ·͊ͳΜͱ͍͏͔өըͰݴ͏ͱݟͲ͜Ζͷ෦
1996: Netscape Livewire was born
1996 • ϒϥβઓ૪ͷཪͰͻͬͦΓͱग़͖ͯͨ Netscape Livewire ͱ͍͏αʔόαΠυ JavaScript ٕज़ • ͳΜͱ
HTML λάͷதʹ <server> λάΛॻ͍ͯͦ͜ ʹεΫϦϓτΛॻ͘ͱ࣮ߦ͞ΕΔͱ͍͏༷ • ॻ͍ͨhtmlΛίϯύΠϧ͢ΔͱόΠτίʔυ͕͍ͭͨ ࣮ߦՄೳͳܗࣜʹม͞ΕɺWebαʔόΛىಈͰ͖Δ
Netscape Livewire • HTMLͱಉ͡ॴʹॲཧΛॻ͍ͯɺίϯύΠϧ ͢Δ # jsac ͱ͍͏ίϯύΠϥͰίϯύΠϧ͢Δ $ jsac
-i app.html -o app.web
1996 • ͳΜͱ͜ͷଞʹ Java ͷΫϥεΛݺͼग़ٕ͢ ज़ʢࠓͰݴ͏C++ native codeݺͼग़͢Α͏ͳ ײ͡ʣ͋ͬͨΓ •
Database ଓ͢Δٕज़͋ͬͨ • ͨͩ·͊ΈΜͳͬͯͷ௨Γɺ͜Ε͕ϝΠϯ ετϦʔϜʹͳΔ͜ͱͳ͔ͬͨ
1996 • ཪͰߦΘΕͯΔϒϥβઓ૪։ൃڥͷઓ૪Ͱ͋Δ • Microsoft ASP ͱਅ͔ͬΒରཱ͕ͨ͠ɺ ASP ίϯύ Πϧεςοϓ͕ͳͯ͘ಈ͘ͷʹରͯ͋͠·Γʹݪ࢝
త • ࠓͰͦ͜ JavaScript ϓϩάϥϛϯάݴޠͱͯ͠ͷҐ Λཱ֬Ͱ͖͍ͯΔ͕͜ͷ࣌Ͱ·ͩए͗ͨ͢ • ݁ہྲྀߦΒͳ͔ͬͨɻɹ
2009: Node.js was born
2009 • αʔόαΠυ JavaScript ݩ • Node.js ͕ੜ • ಉळʹ
JSConf.EU Ͱ Ryan ͕ൃද
2009 • ͜ͷ࣌ͷ Node.js ͷಛ • Event-driven / Non-blocking IO
• Built on Google V8 • CommonJS • ·ͩ͜ͷͱ͖ npm Windows αϙʔτͳ͍
2009 • Apache HTTP Server ͕ C10K ͱ͍͏൷ΛཋͼͤΒΕ͍ͯͨ ࣌ •
Non blocking IO / Event driven ͳΞʔΩςΫνϟ nginx / event machine ͱ͔Ͱطʹྲྀߦͬͯͨɻ • ͡Ό͋ͦΕΛ JavaScript ͰͬͯΈͨΒͲ͏͔ʁͱ͍͏ΞΠσΞ ޭΛͨ͠ • JavaScript ʹ File IO ॲཧ͕ͳ͘ɺαʔόαΠυͷAPIະ։ ͩͬͨ
2010: npm was born
2010 • 3rd party ͷϥΠϒϥϦΛެ։͠ɺಡΈࠐΉ͜ ͱ͕Ͱ͖ΔΈΛ npm ͱ࣮ͯ͠ • ͦΕΛಉࠝ͢Δ͜ͱͰϥΠϒϥϦ։ൃΛ͠
͘͢ɺ·ͨίΞʹΓ͍ͯͳ͍ػೳΛՃ͠ ͨ͘͢͠ • ΤίγεςϜ͕ੜ·Ε͍ͯͬͨ࣌
2010 • Express ͕ొ • socket.io v0.1ޙʹొ • ͔͜͜ΒϒʔϜʹՐ͕͍͍ͭͯ͘ •
Yeoman/grunt/gulp ͱ͔ 2013ʹొ
2011-2014 • 2011: Windows αϙʔτ • 2011: Joyent ͕ग़ࢿ •
2012: Node.js Ϧʔμʔަ Ryan => isaacs • 2014: Node.js Ϧʔμʔަ isaacs => TJ Fontaine
2014: Node.js were forked as io.js
2014 • มԽ͕ى͖ͣɺӢߦ͖͕ո͘͠ͳΔ • ৽͍͠ػೳ͕Ճ͞Εͳ͍ɺόʔδϣϯ͕Ϧ Ϧʔε͞Εͳ͍ • ΤϯλʔϓϥΠζͳ҆ఆੑ͔Γٻ͞Εɺ ৽͍͠ػೳ͕ग़ͯ͜ͳ͍
2014͔ΒίΞͷ։ ൃ͕ఀ͢Δɻ
2015 • io.js ͕ Node.js ΛϑΥʔΫͯ͠ϦϦʔε • ҰؾʹίΞίϛολʔͷେ͕ io.js ଆҠಈ
• io.js ͱ Node.js ͕༥߹͠ɺγϯ Node.js ͱͯ͠։ൃऀ ίϛϡχςΟ͕ओಋ͢Δํ Node.js Foundation ൃ • Node.js v4.0 ͕ϦϦʔε
2015 • ES2015 ͳͲͷ׆ಈ༗Γɺ class, let, const, ESM, ͜͏͍ͬ ͨػೳΛਖ਼ਐԽ͍ͤͯͨ͘͞Ίʹඞཁͳվֵͩͬͨ
• ͔͜͜Β React ͳͲͷՐ͚ੜ·ΕɺϑϩϯτΤϯυ ϒʔϜ͕ى͖Δ • Browserify ͱ͔͕ྲྀߦΓɺ server ͱ client ͷ͕֞ࠜಥഁ͞ Ε͍ͯ͘ • Isomorphic / universal ͱ͔ͷݴ༿͜͜Ͱੜ·ΕΔ
Ұ୴͜͜·ͰͰৼΓฦΓ
The rise of Node.js (2009-2015) • ϦϦʔε͔Βౖ౭ͷ6ؒ • ৽ػೳ͕୯ҐͰՃ͞ΕΔΘ •
ΤίγεςϜ͕Ͱ͖ͯେྔͷ3rd party libੜ·Ε ΔΘ • ϦʔμʔมΘͬͯɺ։ൃओମίϛϡχςΟओಋ ʹมΘΔΘ
The rise of Node.js (2009-2015) • ES2015ͱbabel, React/Vue.js ͳͲͷίϯϙʔωϯτ ࢦϥΠϒϥϦͷຄڵ,
ਐԽͨ͠ Node.js ͦΕͧΕ͕ ҰݸͷʹͳͬͯϒʔϜ͕ੜ·ΕΔ • ͜Ε͕୭͔ʹࢦ͞Ε͔ͨͷΑ͏ͳಈ͖ͰৼΓฦΔͱ ͳΜ͔ࢥ͏ͷ͕͋Δɻ • 2015ʹෳͷϒϨΠΫεϧʔ͕ى͖ͨΑ͏ʹࢥ͑ Δɻ
2016-2018
2016-2018 • ͜ͷ͋ͨΓ͔ΒաڈʹऔΓೖΕ͖ͯͨϥΠϒϥϦ ͷதͰ ES Web Standard ͱҧ͏ΈΛͲ ͏౷߹͢Δ͔͕ٞʹͳ͍ͬͯ͘
• ESModule ͱ CommonJS • Stream / Event Emitter ͱ Promise / WHATWG Stream
2016-2018 • 2016: Leftpad ࣄ͕݅ൃੜ • Npm ͕উखʹϥΠϒϥϦΛফ͢ • ౖͬͨ࡞ऀ͕શͯͷϥΠϒϥϦΛফ͢
• Leftpad ͱ͍͏ϥΠϒϥϦ͕ webpack ͕͍ͬͯͨΓɺ babel ͷҰ෦ͰΘΕ͍ͯͨΓͱ৭ΜͳॴͰϥΠϒϥϦ͕յΕΔ • ͔͜͜ΒɺʮࢲୡɺϥΠϒϥϦґଘ͗͢͠͡ΌͶʁʯ͍ͬͯ͏งғ ؾ͕ྲྀΕΔɻ
2016-2018 • 2018: npm ࢿۚͰ৭ʑͱ͕͠ग़ͯ͘Δ • ϨΠΦϑ͕͋ͬͨΓͱք۾͕͟Θͭ͘ • Ұ୴ github
ͱ౷߹͞Εͯམͪண͘ (2020)
2016-2018 • 2017: Node.js ͕ CommonJS ͱ ESM ͷํΛ૬ ޓޓੑΛอͬͨ··ղܾ͢Δͱ͍͏ํ๏Λ࣮
ɺ֦ுࢠʹΑΔΓํ͕ΛݺͿ • 2017: React Vue.js Ͱ SSR ͢Δͱ͍͏ํ๏͕Ұ ఆͷྲྀߦͷஹ͠ΛݟͤΔɺ͜ͷࠒ Next.js ͕ϦϦʔ ε͞ΕΔɺΫΤϦʔύϥϝʔλͰ͔͠ routing Ͱ͖ͳ͔ͬͨͷͰ͋Μ·Γྲྀߦͬͯͳ͔ͬͨ
2016-2018 • 2016: TypeScript ͕ @types ͳͲͷΈΛ Ҿͬఏ͛ͯܕͷࢀরΛղܾ͢ΔखஈΛఏڙ͠ɺ VS Code
ͳͲͷΤσΟλͱͱʹਐԽ • 2018: Deno ͕ jsconf.eu Ͱൃද͞ΕΔɻ10 Λܦͯ Ryan ͔Β࠶ͼͷൃදɻಛʹ TypeScript native αϙʔτͳͲͷηϯεྲྀੴɻ
ݱ(2019-2023)
ݱ • 2019: Node.js 10पɺࠓޙͷϩʔυϚοϓͱͯ͠ ESM ڧԽɺ fetchɺ single executable
appsɺ TS ͱͷੑ্ͳͲͷ deno Λҙࣝͨ͠ײ͡ʹͳΔɻ • 2020: deno v1.0 ϦϦʔε • 2021: Node.js ʹ web standard ͱͷੑΛڧԽ͢Δ͕૿͑ Δɺ atob / btoa ͱ͔URLͱ͔ͷػೳ͕૿͍͑ͯ͘ • 2021: Node.js Promise Λओମʹͨ͠APIʹมΘΔ
ݱ • 2022: WINTER CG ൃɺ Node.js, Deno, Bun ͳͲͷϒϥβҎ֎ͷϥϯλΠϜͷͨΊ
ͷ༷Խஂମ • Fetch ͷ minimum spec ͱ͔ ৭ʑܾ·ͬͨ
Ұ୴͜͜·ͰͰৼΓฦΓ
ྲྀߦͱڝ૪ • npmҰ࣌ظࢿ͕͕ۚ͋ͬͨɺ GitHub ʹΑΔ ౷߹ͰҰ୴ղܾ͞Εͨ • TypeScript VS
CodeͳͲͷπʔϧपΓ͕ਐԽ ͯ͠ɺେྲྀߦ • Next.js ͕େྲྀߦɺ Vercel ͳͲͷେ͖ͳελʔ τΞοϓ͕ੜ·Εͨ
ྲྀߦͱڝ૪ • ྲྀߦʹΑΓɺ݈શͳڝ૪͕૿͖͑ͯͨΑ͏ʹ ײ͡Δ • Node.js vs Deno vs Bun
Έ͍ͨͳ • ݈શͳڝ૪ͱޓੑͱ༷Խͱ͍͏ਐԽΤ ϯυϢʔβʔʹҰ൪རΛͨΒͯ͘͠ΕΔ ͱࢥ͑Δ
ྲྀߦͱڝ૪ • Node.jsίϛϡχςΟͷ͕ओಋ͞ΕΔɺྲྀߦͬͨͭΛޙ͔ΒऔΓೖΕ͍ͯ͘ํ • Test ͷΈ͕ೖͬͨ • Permission ͕αϙʔτ͞Εͨ •
Experimental Ͱ͋Δ͕ɺ module ղܾͷ default ͕ มߋͰ͖ΔΑ͏ʹͳͬͨ ʢdefault Λ esm ʹม͍͑ͯ͜͏ͱͯ͠Δʣ • Single executable fi le ͕࡞ΕΔΑ͏ʹͳͬͨ • Web Standard ͱͷੑΛ্͍͛ͯ͜͏ͱͯ͠Δʢnavigator͕ೖͬͨΓʣ • ࠓϚείοτΩϟϥΫλʔืूͯ͠Δͱͷ͜ͱ
ྲྀߦͱڝ૪ • Deno Node.js ͱͷ compat Λ্͍͖͍͛ͯͨํ • npm
support • ͦͷ্ͰπʔϧνΣΠϯɺಈ࡞ڥΛݩʹ։ൃશମΛ Γ্͍͛ͯ͘ • Deno Deploy • Deno fresh
ࠓޙͷ༧
ࠓޙ • Node.jsޓੑ্͕͕Γɺ Deno Bun ͳͲͱͷ ڝ૪͕ͬͱ૿͑Δ • ΤίγεςϜΛͲ͜·ͰࣗͷਞӦʹ࣋ͬͯ͜Ε
Δ͔উෛʹͳΓͦ͏ɻ • ޓੑ্͕͕ΕޙੑೳηΩϡϦςΟ։ൃ ऀମݧӡ༻҆ఆੑͳͲͷඇػೳཁ݅Ͱͷউෛʹ ͳΔ
ࠓޙ • Denoଆ͔ΒݟΔͱɺNode.jsΤίγεςϜͱͷੑ Λ্͛ͯɺԿʹૣ͘ Node.js ͷγΣΞΛୣ͑Δ͔ • Node.js ଆ͔ΒݟΔͱɺଞͷϥϯλΠϜͱͷػೳࠩΛ ແͯ͘͠ɺطଘγΣΞΛҡ࣋Ͱ͖Δ͔
• Bun ଆ͔ΒݟΔͱɺΤίγεςϜͷੑΛ্͛Δͱ ͱʹѹతͳύϑΥʔϚϯεͰੑೳࠩͰѹ͍ͨ͠
ࠓޙ • ࡾऀࡾ༷ • ͜͏͍͏݈શͳڝ૪͕͠Β͘ଓ͖ɺڝ૪ঢ় ଶͷ··ۉߧͦ͠͏ͳؾ͍ͯ͠Δɻ
ࠓޙ • ͜ͷଞͷํੑͱͯ͠: • ΤοδίϯϐϡʔςΟϯάํͰCDNͰಈ͘αʔ όαΠυܰྔJSͷྲྀߦ • ϑϧελοΫͳ JS ϑϨʔϜϫʔΫͷོͱਐԽ
• Σϒ։ൃͷਐԽͱͱʹԼճΓΛࢧ͑Δπʔϧͱ ͯ͠ਐԽ͠ଓ͚ͦ͏
·ͱΊ
·ͱΊ • JavaScript Server Runtime ͷྺ࢙ΛৼΓฦͬͨɻ • ίϛϡχςΟͱྗΛ࣋ͬͨاۀ͕࿈ಈ͠ͳ͕Βൃల͖ͯͨ͠ ྺ࢙ͩͬͨΑ͏ʹײ͡Δɻ •
݈શͳڝ૪ʹΑΔػೳͱඇػೳͷࠩผԽ͕ܹԽͯ͠Δ • ҰํͰڞ௨ԽΛWinterCGΛத৺ʹߦΘΕ͍ͯΔ • ·ͩ·ͩൃల͍͖ͯͦ͠͏ɺ։ൃऀʹ༏͍͠ൃల͕ࠓޙ ·ΕΔ
12લʹͷਓੜΛม͑ͨΑ ͏ʹࠓͷ Ryan ͷൃදͰ୭ ͔ͷਓੜ͕มΘΔͱ͍͍ͳͱ ࢥ͍·͢ɻ
Thanks!!
ࢀߟࢿྉ • https://webdevelopmenthistory.com/1995-the-birth-of-javascript/ • https://webdevelopmenthistory.com/1996-javascript-annoyances-and- meeting-the-dom/ • https://dev.to/macargnelutti/server-side-javascript-a-decade-before-node-js- with-netscape-livewire-l72 •
https://philip.greenspun.com/wtr/livewire.html • http://sunsite.uakom.sk/sunworldonline/swol-08-1999/swol-08- webmaster.html • https://en.wikipedia.org/wiki/Node.js • https://yosuke-furukawa.hatenablog.com/entry/2022/04/08/111651