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 Runtime とはなにか
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Yosuke Furukawa
PRO
August 21, 2024
Programming
3.1k
15
Share
JavaScript Runtime とはなにか
Yosuke Furukawa
PRO
August 21, 2024
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
デザインシステムが必須の時代に
yosuke_furukawa
PRO
2
220
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
10
5.1k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4.7k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
320
Removing Corepack
yosuke_furukawa
PRO
9
1.9k
Strip Types と Storage
yosuke_furukawa
PRO
4
490
Module Harmony について
yosuke_furukawa
PRO
4
1.9k
LTのやり方
yosuke_furukawa
PRO
16
2.9k
AppRouter Panel Talk
yosuke_furukawa
PRO
3
890
Other Decks in Programming
See All in Programming
Liberating Ruby's Parser from Lexer Hacks
ydah
2
1.1k
AIエージェントで業務改善してみた
taku271
0
520
10 Tips of AWS ~Gen AI on AWS~
licux
5
400
Angular Signal Forms
debug_mode
0
110
Going Multiplatform with Your Android App (Android Makers 2026)
zsmb
2
420
PicoRuby for IoT: Connecting to the Cloud with MQTT
yuuu
2
430
夢の無限スパゲッティ製造機 -実装篇- #phpstudy
o0h
PRO
0
210
Offline should be the norm: building local-first apps with CRDTs & Kotlin Multiplatform
renaudmathieu
0
210
セグメントとターゲットを意識するプロポーザルの書き方 〜採択の鍵は、誰に刺すかを見極めるマーケティング戦略にある〜
m3m0r7
PRO
0
540
ふりがな Deep Dive try! Swift Tokyo 2026
watura
0
210
煩雑なSkills管理をSoC(関心の分離)により解決する――関心を分離し、プロンプトを部品として育てるためのOSSを作った話 / Solving Complex Skills Management Through SoC (Separation of Concerns)
nrslib
4
940
CDK Deployのための ”反響定位”
watany
4
760
Featured
See All Featured
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
100
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
330
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.2k
AI Search: Implications for SEO and How to Move Forward - #ShenzhenSEOConference
aleyda
1
1.2k
Believing is Seeing
oripsolob
1
110
Lightning Talk: Beautiful Slides for Beginners
inesmontani
PRO
1
520
Game over? The fight for quality and originality in the time of robots
wayneb77
1
160
How to optimise 3,500 product descriptions for ecommerce in one day using ChatGPT
katarinadahlin
PRO
1
3.5k
Have SEOs Ruined the Internet? - User Awareness of SEO in 2025
akashhashmi
0
320
It's Worth the Effort
3n
188
29k
Keith and Marios Guide to Fast Websites
keithpitt
413
23k
Rebuilding a faster, lazier Slack
samanthasiow
85
9.5k
Transcript
JavaScript Runtime ͱͳʹ͔ 2024/08/19 @ Offers Meetup
X: @yosuke_furukawa GitHub: yosuke-furukawa
CFP ืूதʂʂʂʂʂ
Node.js is a free, open-source, cross- platform JavaScript Runtime Environment
Deno is the open-source JavaScript runtime for the modern web.
Bun is a new JavaScript runtime built from scratch to
serve the modern JavaScript ecosystem
ͦͦ Runtime ͬͯͳΜͩ
ຊޠͷࣙॻతͳҙຯ: ࣮ߦதͷ ~
͑ͬܗ༰ࢺʁ
࣮ͦ͏ɻ Runtime System, Runtime library, Runtime Environment Έ͍ͨʹ͏ɻ
ݴޠ compile time ͱ run time ʹ͔Ε ͯͯɺ run time
ɺͭ·Γ࣮ߦதͷ࣌ʹඞཁ ͳΈΛࢦͯ͠ Runtime System Runtime Environment, Runtime Library ͱݴͬͨΓ͢Δɻ
JSͷ(Node.js, Deno, Bunͷྫ)Ͱ Runtime = Runtime Environment Λলུͨ͠ͷͱ͍ͯͬͯ͠Δ
ଞͷݴޠͰʁ
PHPͷ߹: Zend EngineͱݺΕΔEngine͕ίϯύΠ ϧٴͼRuntime Engineͱͯ͠ৼΔͬͯ ͍Δɻ
Javaͷ߹: Java Runtime EnvironmentͱJava VMʹ ͔ΕͯΔɻVM͕OS, CPUͷநԽΛओ ʹ୲͍ɺRuntime EnvironmentͦΕҎ֎ ͷॲཧΛ͞ΕͯΔɻ(JSʹ͍ۙ)
Rustͷ߹: Runtimeͷ͚۠Έ͍ͨͳͷͳ͍ɺಛ ʹΑ͋͘ΔRuntime࣌ͷGCॲཧଘࡏ͠ͳ ͍ɻҰ෦ͷasync IOtokioͳͲͷ3rd party library͕୲ͬͯΔ
ͬ͘͢͝ᐆດ
ͬͱ͍͏ͱ
͔͜͜Β͜͜·Ͱ࣮͢Δͷ͕ "Runtime Environment" ͩɻ ͱ͍͏໌֬ͳఆٛͳ͍ͱࢥͬͯΔɻ
ͳ͔ͥͱ͍͏ͱɺݴޠઃܭऀʹΑͬͯ ϓϩάϥϛϯάݴޠͱͦΕΛऔΓר͘पล ͷػೳΛͲ͏֊͚ͯ͠දݱ͍ͯ͠Δ͔ ͕ҧ͏͔Βɻ
ͨ·ͨ· JavaScript ݴޠͷίΞ༷ (ECMAScript)ͱपลͷػೳ༷͕͔Ε ͯɺϒϥβαʔόʹΈࠐ·ΕͯΔɻ
ݴޠͷίΞ༷ͱαʔό༻్Ͱར༻͢Δػ ೳ܈Λߏͨ͠ͷ͕ɺ Node.jsͰ͋Γ DenoͰ͋ΓBunͷΑ͏ͳ͜͜Ͱ Runtime ͱݺΕͯΔͷʹͳΔɻ
BrowserRuntimeͱ͍͏ᐆດͳఆٛͷ ଆʹೖΕͯ͠·͑RuntimeʹͳΓ͑Δ
ͳͷͰ
Runtimeͱ͍͏ᐆດͳఆٛΛཧղ͠Α͏ͱ ͢ΔͷͰͳ͘ɺ
۩ମతͳݴޠڥʹ͓͍ͯɺ Ͳ͏͍͏ػೳ͕ݴޠଆͰఏڙ͞Ε͍ͯͯɺ Ͳ͏͍͏ػೳ͕पลଆͰఏڙ͞Ε͍ͯΔ͔ ͱ͍͏۩ମతͳػೳΛཧղ͢Δ΄͏͕͔ Γ͔ͬͨ͢Γ͢Δɻ
JavaScriptͱपลΛؚΊͨͷʹ ͦͦͲΜͳػೳ͕͋Δ͔
JavaScript (+runtime) ػೳҰཡ • ࣈ۟ղੳ, ߏจղੳ (͍ΘΏΔ parser) • ߏจ࠷దԽ
(͍ΘΏΔ JIT) • ϝϞϦཧ(ΨϕʔδίϨΫγϣϯ) • ΠϕϯτϋϯυϦϯά • ඇಉظॲཧػߏ • CPUநԽ • OSநԽ • File/Storage IO, Network IO • JS API (String, Number, etc) • ଞ API (DOM, Network, etc)
JavaScript (+runtime) ػೳҰཡ • ࣈ۟ղੳ, ߏจղੳ (͍ΘΏΔ parser) • ߏจ࠷దԽ
(͍ΘΏΔ JIT) • ϝϞϦཧ(ΨϕʔδίϨΫγϣϯ) • ΠϕϯτϋϯυϦϯά • ඇಉظॲཧػߏ • CPUநԽ • OSநԽ • File/Storage IO, Network IO • JS API (String, Number, etc) • ଞ API (DOM, Network, etc) JS Engine ͷػೳ Runtime ͷػೳ ྆ํ ͷػೳ
Πϝʔδ JS Runtime JS Engine Parser JIT Memory Management CPU
JS API (String, Number etc) Async Processing File Storage IO, Network IO Event Handling OS Other API (DOM, Network etc)
͜͜·Ͱͷ·ͱΊ
Runtime ͱͳʹ͔ • Compile time / run time Ͱ͚ͨͱ͖ͷ࣮ߦதͷಈ͖ʹؔ͢ΔͷΛࢦ ͢ɻ
• ࣮ఆٛᐆດ • ʮ xxx Runtime ͳΜͰ͔͢?ʯΈ͍ͨͳ࣭͋·Γ͠ͳ͍ɻ • ݴޠͷίΞͱͳΔػೳ͕͋ΓɺͦͷपลΛͲ͏දݱ͢Δ͔Ͱܾ·Δɻ • ͔ͩΒΘ͔Γʹ͍͘ɺΘ͔ͬͨΑ͏ͰΘ͔Βͳ͍ɻ
JavaScript ʹ͓͚Δ Runtime Կ͕දݱ ͞ΕͯΔ͔ • ΠϕϯτϋϯυϦϯά • ඇಉظॲཧػߏ •
File IO • Network IO • OSநԽ • ͦΕΒΛѻ͏ͨΊͷAPI • DOM • Network (fetch etc) • fs, http, child_process • etc
ͣͬͱ͜͜·Ͱ Browser / Server Λ͋·Γ ͚ͣʹRuntimeͱͯ͠հ͖ͯͨ͠
࣮͜ͷBrowser/ServerपΓ͕࠷ۙ໘ ന͍ಈ͖Λݟ͍ͤͯΔɻ
None
WinterCG • Server ༻్Ͱར༻͞ΕͯΔ Runtime ͷ࠷খݶͷڞ௨APIηοτΛ࡞Γɺ૬ޓޓ ੑΛ্͛Α͏ͱ͍͏ࢼΈ • ͦͷதͰʮͳΔ͘ʯBrowserʹ͍ۙAPIΛ࠾༻͠Α͏ͱ͍ͯ͠Δɻ •
ྫ: • URL, Readable/Writable Stream, Request/Response, etc • https://common-min-api.proposal.wintercg.org/#api-index
# Browser API Server API JS API ͜͜ͷڞ௨߲ʹͳΓಘΔ෦ΛͳΔ͘ େ͖͘Ͱ͖ͳ͍͔ͱ͍͏ࢼΈ
ͯ͞ɺຊ
Node.js / Deno / Bun ͦΕͧΕͷҧ͍ʹ͍ͭͯ
ઓུ໘
ڞ௨ઓུ • WinterCGͷରԠΛਐΊͭͭɺ͓ޓ͍ͷྑ͍ͱ͜Ζ͕͋Εޙ͍Ͱ࠾༻͍ͯ͘͠ํ • Node.js Ͱ࠷৽Ͱ strip-types storage ͷରԠ͕ਐΜͰΔ(Deno,
Bunͷػೳͷै) • DenoNode.js Compatibility Λ্͛ͯnpmͷࢿ࢈͑ΔΑ͏ʹ͍ͯ͠Δ(Node.jsطଘ ࢿ࢈ͷै) • Bun WinterCG ࢀՃද໌͍ͯ͠ͳ͍͕ɺ Web API Interop Ͱ͖ΔൣғͰਐΊͯ Δɻ͞ΒʹNode.jsͷCompatibilityΛ্͛ͯnpmͷࢿ࢈͑ΔΑ͏ʹ͍ͯ͠Δ(Node.js طଘࢿ࢈ͷै)
ࠩผԽϙΠϯτ • Node.js • ػೳ໘ʹؔͯ͠େ͖ͳมߋͤͣʹɺখ͍͞มߋͷதͰଞ ͷruntimeͱͷࠩΛݮΒ͍ͯͬͯ͠Δɻ • ඇػೳཁ݅໘ͰͷύϑΥʔϚϯε্ɺηΩϡϦςΟରԠɺ ӡ༻࣌ͷੳํ๏ͷՃͳͲ͕ߦΘΕͯΔɻ ख़ͯ͠Δҹ
ࠩผԽϙΠϯτ • Deno • ͻͱͭηΩϡϦςΟॏࢹɺOSͷػೳΛ͏ࡍʹύʔϛογϣϯ͕ཁ ٻ͞ΕΔͨΊɺҙਤ͠ͳ͍ϑΝΠϧૢ࡞ωοτϫʔΫૢ࡞Λ͛Δ • Deno Fresh ͳͲͷ
ϑϨʔϜϫʔΫެ͕ࣜಉ͡organizationͰ։ൃ͠ ͓ͯΓɺपลͷπʔϧྨͦ͜Ͱαϙʔτ͞ΕͯΔҹɻ • Կͱݴͬͯ࠷ۙJSRɺJavaScript Registry ͱͯ͠ొɻ
ࠩผԽϙΠϯτ • Deno • JSR • TypeScript Λͦͷ··ιʔεͱͯ͠publishͯ͠ɺதͰίϯύΠϧͯ͠JavaScriptʹมͰ ͖Δ •
npm ͷ publish ઌ͔Β JSR Λܦ༝ͯ࣋ͬͯ͘͠Δ͜ͱͰ͖ΔͷͰɺطଘࢿ࢈͔ΒͷҠ ߦͰ͖Δ • ԿΑΓɺ ESM Λ࠷ॳͷλʔήοτͱ͢ΔͷͰɺ CJS ͕جຊʹͳ͍ͬͯΔ npm ͱҰઢ Λը͢ ৽͍͠ϨδετϦΛඋ͑ͯɺNode.js͔ΒϢʔβʔΛͲ͜·Ͱ࣋ͬͯ͜ΕΔ͔
ࠩผԽϙΠϯτ • Bun • ͱʹ͔͘ύϑΥʔϚϯεɺ͕ͦ͜͞ਖ਼ٛ • Node.jsޓੑॏࢹ • blog ΛݟͯຖճඞͣύϑΥʔϚϯεվળͱNode.jsޓੑ্͕ॻ͍ͯ͋Δ
• Next.js / Remix / Nuxt.js ͱ͔͕ಈ͘ΑʂΈ͍ͨͳΤϯδχΞਓؾͷߴ͍ϥΠϒ ϥϦ͕طʹಈ͘Ξϐʔϧ͞ΕͯΔ
ࠩผԽϙΠϯτ • Bun • ͔ͳʔΓಠࣗ࿏ઢɻࢥ͍͖ͭΈ͍ͨͳ͜ͱΛαοͱ࣮ͯ͠ Δ BunͷதͰCݴޠ͔͚ͨΒͲ͏͔ͳʙʁ ཌ: ࣮Ͱ͖ͨʔ
ࠩผԽϙΠϯτ • Bun • package.json Ͱউखʹ jsonc ͬͯΔ͠ɺ console
async iterationͩ͠ɺΊͪΌͪ͘Όಠࣗ࿏ઢɻ • Զͷ࠷ڧͷ runtime Λ࡞ͬͯΔͥײ͕͋Δɻ • ݏ͍͡Όͳ͍ɻ Performance is all you need!! And crazy ideas are all I need!!!
ମ੍໘
ମ੍ • Node.js: • Ϧʔμʔෆࡏ • େنOSS։ൃऀମ੍ɺ֤͝ͱʹWGΛ࡞ΓɺTSCͱݺ ΕΔҕһձͰํੑΛܾΊΔɻίϛολʔΛͤͯ͞ମ੍ Λܧଓͤ͞ΔΑ͏ʹ͍ͯ͠Δɻ Ϧʔμʔ͕ډͳ͍ͱ͜Ζͱ֤ϝϯόʔʹΑͬͯ߹ٞͰܾ·ΔॴWeb
ͷඪ४ԽҕһձͱࣅͯΔ
ମ੍ • Deno: • Ϧʔμʔ: Ryan Dahlࢯ • OSS։ൃऀͱDeno CompanyͰͷձࣾ։ൃͷϋΠϒϦου
• ։ൃϓϩηεجຊΦʔϓϯɺ(Issue, PR, RFC) • Deno Deploy ͷ༻ࢧԉͳͲ͋ΓɺίϛϡχςΟͱίΞνʔϜͱ༻ࢧԉ ͞ΕͯΔνʔϜͷࡾҐҰମ Redisͱ͔VercelͷOSS + ༻ͰͷઓུʹࣅͯΔ
ମ੍ • Bun: • Ϧʔμʔ: Jarred Summerࢯ • BunΛfull timeͰ։ൃ͠ɺ
ϗεςΟϯάڥͳͲΛ࡞ͬͯJS։ൃମݧΛ্ͤ͞ Δ໊Ͱձ্ཱࣾͪ͛ͯΔ (Oven)ɻ • OSS Contributors + ovenࣾͷϋΠϒϦουମ੍ • ༻Ϣʔεέʔεͱ͔ฉ͍ͨ͜ͱແ͍ͷͰɺϚωλΠζΛͲ͏͢Δͷ͔ෆ໌ ମ੍࡞ΒΕͯΔ͚Ͳɺ·ͩ͜Ε͔Βײ͕͋Δɻ
·ͱΊ
·ͱΊ • Node.jsख़ͯ͠Δɻ • DenoJSRͳͲͰΤίγεςϜΛ࡞Γม͑ͭͭɺطଘΤίγεςϜ͔ΒͷΓ ͑Λૂ͏ɻ • Bunಠࣗ࿏ઢɺݏ͍͡Όͳ͍ɻ • ࡾऀࡾ༷ɺࠩผԽ͞Ε͖ͯͭͭ͋Δ͠ɺ͓͠Ζ͍ɻ
• ͬͱΓ্͕ͬͯ͘Εɺͦͯ͠ JSConf.jp ͳͲͰൃදٻΉ