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
ECMAScript、Web標準の型はどう管理されているか / How ECMAScript ...
Search
Sponsored
·
Your Podcast. Everywhere. Effortlessly.
Share. Educate. Inspire. Entertain. You do you. We'll handle the rest.
→
petamoriken / 森建
August 30, 2024
Programming
3
620
ECMAScript、Web標準の型はどう管理されているか / How ECMAScript and Web standards types are maintained
fukuoka.ts #1(オンライン)
https://fukuoka-ts.connpass.com/event/320038/
petamoriken / 森建
August 30, 2024
Tweet
Share
More Decks by petamoriken / 森建
See All by petamoriken / 森建
コントリビューターによるDenoのすゝめ / Deno Recommendations by a Contributor
petamoriken
0
200
Module Harmony
petamoriken
2
770
Denoでフロントエンド開発 2025年春版 / Frontend Development with Deno (Spring 2025)
petamoriken
1
1.5k
非ブラウザランタイムとWeb標準 / Non-Browser Runtimes and Web Standards
petamoriken
0
620
ふかぼれ!CSSセレクターモジュール / Fukabore! CSS Selectors Module
petamoriken
0
300
フロントエンドの標準仕様をどう追っているか / How I follow the frontend standards specs
petamoriken
4
2.5k
DOM Observable
petamoriken
1
320
Deno に Web 標準 API を実装する / Implementing Web standards API to Deno
petamoriken
0
750
Contributing to Deno is fun!
petamoriken
0
430
Other Decks in Programming
See All in Programming
360° Signals in Angular: Signal Forms with SignalStore & Resources @ngLondon 01/2026
manfredsteyer
PRO
0
130
Data-Centric Kaggle
isax1015
2
780
コマンドとリード間の連携に対する脅威分析フレームワーク
pandayumi
1
460
OSSとなったswift-buildで Xcodeのビルドを差し替えられるため 自分でXcodeを直せる時代になっている ダイアモンド問題編
yimajo
3
620
なぜSQLはAIぽく見えるのか/why does SQL look AI like
florets1
0
470
AIエージェントのキホンから学ぶ「エージェンティックコーディング」実践入門
masahiro_nishimi
5
470
組織で育むオブザーバビリティ
ryota_hnk
0
180
AIフル活用時代だからこそ学んでおきたい働き方の心得
shinoyu
0
140
開発者から情シスまで - 多様なユーザー層に届けるAPI提供戦略 / Postman API Night Okinawa 2026 Winter
tasshi
0
200
要求定義・仕様記述・設計・検証の手引き - 理論から学ぶ明確で統一された成果物定義
orgachem
PRO
1
160
dchart: charts from deck markup
ajstarks
3
990
izumin5210のプロポーザルのネタ探し #tskaigi_msup
izumin5210
1
130
Featured
See All Featured
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
2.1k
Building the Perfect Custom Keyboard
takai
2
690
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.4k
What’s in a name? Adding method to the madness
productmarketing
PRO
24
3.9k
The untapped power of vector embeddings
frankvandijk
1
1.6k
Tell your own story through comics
letsgokoyo
1
810
Stop Working from a Prison Cell
hatefulcrawdad
273
21k
Money Talks: Using Revenue to Get Sh*t Done
nikkihalliwell
0
150
svc-hook: hooking system calls on ARM64 by binary rewriting
retrage
1
100
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
7.9k
Believing is Seeing
oripsolob
1
56
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
1
130
Transcript
ECMAScript、Web 標準の型は どう管理されているか fukuoka.ts #1 pixiv Inc. 森内建太 petamoriken 2024.8.30
2 自己紹介 • Web エンジニア • Deno コントリビューター • ECMAScript や Web 標準 を追うのが好き petamoriken カスタマーオペレーション
&セーフティ本部 オペレーション開発部
3
4 © ンバヂ https://x.com/nbaji9 https://www.nicovideo.jp/watch/sm42515407
5 tsconfig.json の compilerOptions.lib で指定する • ECMAScript ◦ “ES2023” や “ESNext” • Web 標準 ◦ “DOM” や “DOM.Iterable”
TypeScript の組み込み型定義
6 tsconfig.json
7 microsoft/TypeScript の src/lib 内にある 組み込み型定義の実態
8 • ECMAScript ◦ 型の追加、修正は手作業 • Web 標準 ◦ 2つ以上のブラウザに実装された型が自動更新 ◦
microsoft/TypeScript-DOM-lib-generator 組み込み型定義の実態
(余談)ES2024 の型を実装中 9
10 Mozilla の saschanaz さんによる管理 2つ以上のブラウザで実装された型が自動更新 • TypeScript へはバージョンアップ時に取り込まれる • 最新の型を使いたい場合は @types/web へ TypeScript-DOM-lib-generator
11 w3c/webref から最新の Web IDL を JSON で取得 TypeScript-DOM-lib-generator の仕組み
12 Browser Compat Data と突合する • ブラウザの実装状況や廃止された API かを調べる TypeScript-DOM-lib-generator の仕組み
13
14 最後にパッチを当てて型ファイルを生成 • イベント名のマッピング(文字列リテラル型対応) • ジェネリクス対応 などなど TypeScript-DOM-lib-generator の仕組み
15
16 TypeScript の組み込み型定義について • ECMAScript の型の追加、修正は手作業 • Web 標準の型は自動更新 ◦ Web IDL と Browser Compat
Data を使っている まとめ