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
9
4.6k
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
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
7
3.5k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
220
Removing Corepack
yosuke_furukawa
PRO
9
1.6k
JavaScript Runtime とはなにか
yosuke_furukawa
PRO
15
2.8k
Strip Types と Storage
yosuke_furukawa
PRO
4
400
Module Harmony について
yosuke_furukawa
PRO
3
1.7k
LTのやり方
yosuke_furukawa
PRO
16
2.6k
AppRouter Panel Talk
yosuke_furukawa
PRO
3
800
Other Decks in Programming
See All in Programming
CRUD から CQRS へ ~ 分離が可能にする柔軟性
tkawae
0
210
TSConfig Solution Style & subpath imports to switch types on a per-file basis
maminami373
1
160
JVM の仕組みを理解して PHP で実装してみよう
m3m0r7
PRO
1
240
TypeScriptのmoduleオプションを改めて整理する
bicstone
4
400
SpringBootにおけるオブザーバビリティのなにか
irof
1
870
Interface vs Types ~型推論が過多推論~
hirokiomote
1
210
人には人それぞれのサービス層がある
shimabox
3
410
Feature Flag 自動お掃除のための TypeScript プログラム変換
azrsh
PRO
4
580
Investigating Multithreaded PostgreSQL
macdice
0
130
Perlで痩せる
yuukis
1
560
型安全なDrag and Dropの設計を考える
yudppp
5
640
漸進。
ssssota
0
100
Featured
See All Featured
Stop Working from a Prison Cell
hatefulcrawdad
269
20k
Fontdeck: Realign not Redesign
paulrobertlloyd
84
5.5k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
180
53k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
A better future with KSS
kneath
239
17k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
15
880
Build your cross-platform service in a week with App Engine
jlugia
231
18k
Statistics for Hackers
jakevdp
799
220k
Why Our Code Smells
bkeepers
PRO
336
57k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
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