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
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
Yosuke Furukawa
PRO
August 21, 2024
Programming
15
3k
JavaScript Runtime とはなにか
Yosuke Furukawa
PRO
August 21, 2024
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
デザインシステムが必須の時代に
yosuke_furukawa
PRO
2
190
Node.js, Deno, Bun 最新動向とその所感について
yosuke_furukawa
PRO
10
4.9k
Welcome JSConf.jp 2024
yosuke_furukawa
PRO
1
4.5k
tc39 x jsconf.jp Panel Discussion 2024
yosuke_furukawa
PRO
0
290
Removing Corepack
yosuke_furukawa
PRO
9
1.8k
Strip Types と Storage
yosuke_furukawa
PRO
4
460
Module Harmony について
yosuke_furukawa
PRO
4
1.8k
LTのやり方
yosuke_furukawa
PRO
16
2.8k
AppRouter Panel Talk
yosuke_furukawa
PRO
3
860
Other Decks in Programming
See All in Programming
[KNOTS 2026登壇資料]AIで拡張‧交差する プロダクト開発のプロセス および携わるメンバーの役割
hisatake
0
180
AIによるイベントストーミング図からのコード生成 / AI-powered code generation from Event Storming diagrams
nrslib
2
1.7k
CSC307 Lecture 03
javiergs
PRO
1
480
20260127_試行錯誤の結晶を1冊に。著者が解説 先輩データサイエンティストからの指南書 / author's_commentary_ds_instructions_guide
nash_efp
0
730
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
280
AIフル活用時代だからこそ学んでおきたい働き方の心得
shinoyu
0
120
Fluid Templating in TYPO3 14
s2b
0
110
今から始めるClaude Code超入門
448jp
2
1.3k
Pythonではじめるオープンデータ分析〜書籍の紹介と書籍で紹介しきれなかった事例の紹介〜
welliving
3
850
Honoを使ったリモートMCPサーバでAIツールとの連携を加速させる!
tosuri13
1
170
ゆくKotlin くるRust
exoego
1
210
プロダクトオーナーから見たSOC2 _SOC2ゆるミートアップ#2
kekekenta
0
130
Featured
See All Featured
From π to Pie charts
rasagy
0
120
Testing 201, or: Great Expectations
jmmastey
46
8k
Un-Boring Meetings
codingconduct
0
190
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
54k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
150
Public Speaking Without Barfing On Your Shoes - THAT 2023
reverentgeek
1
300
Leadership Guide Workshop - DevTernity 2021
reverentgeek
1
190
A better future with KSS
kneath
240
18k
A Modern Web Designer's Workflow
chriscoyier
698
190k
Amusing Abliteration
ianozsvald
0
90
The Impact of AI in SEO - AI Overviews June 2024 Edition
aleyda
5
710
Dominate Local Search Results - an insider guide to GBP, reviews, and Local SEO
greggifford
PRO
0
49
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 ͳͲͰൃදٻΉ