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
Yosuke Furukawa
PRO
August 21, 2024
Programming
14
2.2k
JavaScript Runtime とはなにか
Yosuke Furukawa
PRO
August 21, 2024
Tweet
Share
More Decks by Yosuke Furukawa
See All by Yosuke Furukawa
Strip Types と Storage
yosuke_furukawa
PRO
4
300
Module Harmony について
yosuke_furukawa
PRO
3
1.4k
LTのやり方
yosuke_furukawa
PRO
16
2k
AppRouter Panel Talk
yosuke_furukawa
PRO
3
660
Node.js v22 で変わること
yosuke_furukawa
PRO
13
4.9k
リアーキテクトと開発生産性について
yosuke_furukawa
PRO
25
9.3k
JavaScript Server Runtime History
yosuke_furukawa
PRO
9
3.6k
tc39 x jsconf.jp Panel Discussion
yosuke_furukawa
PRO
0
1.7k
フロントエンドの開発生産性とは
yosuke_furukawa
PRO
18
11k
Other Decks in Programming
See All in Programming
Scala アプリケーションのビルドを改善してデプロイ時間を 1/4 にした話 | How I improved the build of my Scala application and reduced deployment time by 4x
nomadblacky
1
160
大公開!iOS開発の悩みトップ5 〜iOSDC Japan 2024〜
ryunakayama
0
190
Rubyのobject_id
qnighy
6
1.3k
エラーレスポンス設計から考える、0→1開発におけるGraphQLへの向き合い方
bicstone
5
1.5k
REXML改善のその後
naitoh
0
190
GoのIteratorに詳しくなってしまう
inatonix
1
200
Amebaチョイス立ち上げの裏側 ~依存システムとの闘い~
daichi_igarashi
0
230
Modular Monolith Go Server with GraphQL Federation + gRPC
110y
1
580
What is Parser
yui_knk
9
4.1k
Rechartsで楽にゴリゴリにカスタマイズする!
10tera
1
160
What you can do with Ruby on WebAssembly
kateinoigakukun
0
160
Mastering AsyncSequence - 使う・作る・他のデザインパターン(クロージャ、Delegate など)から移行する
treastrain
4
1.6k
Featured
See All Featured
Dealing with People You Can't Stand - Big Design 2015
cassininazir
363
22k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
38
9.2k
Fireside Chat
paigeccino
31
2.9k
Large-scale JavaScript Application Architecture
addyosmani
508
110k
A Tale of Four Properties
chriscoyier
155
22k
Infographics Made Easy
chrislema
239
18k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
26
1.3k
Fight the Zombie Pattern Library - RWD Summit 2016
marcelosomers
230
17k
Design by the Numbers
sachag
277
19k
Pencils Down: Stop Designing & Start Developing
hursman
119
11k
A better future with KSS
kneath
235
17k
Being A Developer After 40
akosma
84
590k
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 ͳͲͰൃදٻΉ