Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
BunがCommonJSをサポートする理由
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
ytaisei
March 27, 2024
Technology
510
2
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
BunがCommonJSをサポートする理由
フロントエンドTechCafe〜春のBun祭りLT会〜にて使用した資料。
参考資料:
https://bun.sh/blog/commonjs-is-not-going-away
ytaisei
March 27, 2024
More Decks by ytaisei
See All by ytaisei
TanStack Routerを新規プロダクトで1年間運用してみた結果
ytaisei
1
560
Reactを段階的に覗いてみる
ytaisei
3
2.2k
Reactのトランジションを覗いてみる
ytaisei
1
2.7k
Deep Dive Into React 〜React Fiber Architectureについて〜
ytaisei
2
590
React19で状態管理はどう変わるか
ytaisei
2
250
TanStackで効率的なルーティングとデータ取得を実現
ytaisei
10
2.6k
TanStack Routerで型安全かつ効率的なルーティングを実現
ytaisei
4
2.6k
TanStack Router SPA開発の選択肢になるか(+TanStack Query)
ytaisei
2
1.8k
【2023】SWR vs TanStack Query
ytaisei
1
2.3k
Other Decks in Technology
See All in Technology
白金鉱業Meetup Vol.25 アウトカムが二値のデータに対するCausal Impact
brainpadpr
0
290
高負荷プロダクション環境におけるAWS Lambdaのリアル 〜スケールとコストを左右する実行ライフサイクルの技術仕様〜
maimyyym
2
200
Cloudflare Workers 向けアプリを C# で構築する ~WASM Native AOT への道~
nenonaninu
1
1.4k
Oracle Cloud Network Path Analyzerを試してみた/I Tried Out Oracle Cloud Network Path Analyzer
masakiokuda
1
110
作って終わりじゃないサーバーレス 〜9年運用する大規模EC物流API基盤の設計・運用のリアル〜
zozotech
PRO
0
500
.NET WebAssemblyで実現するクライアントサイドAI推論:NuGetからViteまで、2つのエコシステムを繋ぐビルド戦略
yamachu
1
690
開発投資の期待値を上げるプロダクトロードマップづくり ~プロダクトエンジニアが越境して事業を伸ばす~
kekekenta
1
250
AIエージェントを最高のパートナーに育てる方法|評価と判断軸を育てる5つのステップ
koichiaoki
1
160
CLIライブラリ開発を支える技術
htnabe
0
150
LLMに渡さなかった仕事
nanaism
0
1.4k
GoのInterface内部構造から学ぶ!最高パフォーマンスを出すコード設計
yappli_developers
1
280
Azure Serverless 2026:Production-ready な AI エージェント基盤 / Azure Serverless 2026: Production-Ready AI Agent Platform
miyake
2
570
Featured
See All Featured
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
1
540
Measuring Dark Social's Impact On Conversion and Attribution
stephenakadiri
2
280
Making the Leap to Tech Lead
cromwellryan
135
10k
Lessons Learnt from Crawling 1000+ Websites
charlesmeaden
PRO
1
1.6k
How to audit for AI Accessibility on your Front & Back End
davetheseo
0
550
GraphQLの誤解/rethinking-graphql
sonatard
75
12k
Amusing Abliteration
ianozsvald
1
310
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
25
2.1k
Are puppies a ranking factor?
jonoalderson
2
3.9k
Understanding Cognitive Biases in Performance Measurement
bluesmoon
32
3k
10 Git Anti Patterns You Should be Aware of
lemiorhan
PRO
659
62k
So, you think you're a good person
axbom
PRO
2
2.2k
Transcript
BunがCommonJS をサポートする理由 ytaisei(安井大晟)
ytaisei(安井大晟) • フロントエンド • 24卒CyberAgent • 株式会社AI Shift
Bunあまり知らない... ⇨LT応募する ⇨リサーチする
「CommonJS is not going away」というブログを発見 • 公式のブログ • 2023年6月なので少し古いかも
CJSとESM • CommonJS • ES Modules • require/exportsを使用 • 同期的にロード
• 元々サーバでの使用が想定されていた • import/exportを使用 • 同期・非同期でのロードに対応 • ブラウザでもネイティブサポート
CJSとESM • CommonJS • ES Modules • require/exportsを使用 • 同期的にロード
• 元々サーバでの使用が想定されていた • import/exportを使用 • 同期・非同期でのロードに対応 • ブラウザでもネイティブサポート 新規のプロジェクトであれば ESMが推奨
では、なぜCJSをサポートする?
public npm registryにおけるCommonJSの割合 • ESMの割合がかなり増えている • 依然としてCJSが67%以上 参考:https://github.com/wooorm/npm-esm-vs-cjs?tab=readme-ov-file
CommonJSの存在を尊重する姿勢
CommomJSの方がモジュールのLoadが早いケースも
CommomJSの方がモジュールのLoadが早いケースも 手元のベンチマークではCJSの方が約1.5倍早かった
Bunでは同一File内で importとrequireを使用可能 (CJSとESMの共存が可能)
結論 • BunではCJSとESMのどちらもサポートしている • CJS自体のメリットも含めて、 CJSを尊重する姿勢が記事から伺えた
Thanks!!! X: ytaisei_ Zenn: @taisei-13046