WebIDL を見てみる ブラウザーに実装されている API を知りたい @Takenspc
内容 ● 背景 ● WebIDL を見てみる ● まとめ
背景 ● ブラウザーで使える API ：たくさんある – 新たな API が生まれる – 途中で API が変わる ● 実際に使える API は何なのか、知りたい
Specifications BrowserContent ??? ??? ??? ??? ???
例えば、こう書ける？ const url = new URL('…?foo=0&bar=1'); for (const param of url.searchParams) { console.log(param[0], param[1]); }
http://caniuse.com/#search=URLSearchParams
https://dev.windows.com/en-us/microsoft-edge/platform/status/urlapi
https://developer.mozilla.org/en-US/docs/Web/API/URL
実際のところ… Chrome Firefox IE Safari URL.searchParams N/A 29+ N/A N/A URLSearchParams 49+ 29+ N/A N/A @@iterator 49+ 44+ N/A N...
現状 ● ブラウザーの実装とドキュメントが分離 – 粒度や作成・更新頻度がニーズと異なる場合も
ブラウザーの実装は…？ ● ブラウザーも誰かが書いてるはず
Specifications BrowserContent ??? ??? ??? ??? ???
結論から言うと ● 主なブラウザーの開発では WebIDL からイン タフェースを機械生成 ● WebIDL は各仕様が定義
Specifications BrowserContent WebIDL WebIDL
Specifications BrowserContent Available Behind a flag Not compiled Not implemented WebIDL WebIDL
WebIDL ● Web 技術向け IDL – ECMAScript に特化
https://heycam.github.io/webidl/
WebIDL ● 仕様とブラウザーの共通言語の 1 つ – 共通言語なので比較可能
WebIDL を見てみる ● 仕様（ URL Standard ） ● Web Platform Tests ● Gecko ● Chromium ● WebKit
https://url.spec.whatwg.org/#api
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToAS...
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToAS...
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToAS...
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToAS...
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToAS...
https://github.com/w3c/web-platform-tests/blob/master/url/interfaces.html
https://dxr.mozilla.org/mozilla-central/source/dom/webidl/URL.webidl
[…] interface URL { … […] attribute USVString search; readonly attribute URLSearchParams searchParams; … }; Gecko
https://chromium.googlesource.com/chromium/src/+/master/third_party/WebKit/Source/core/dom/URL.idl
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker), …] interface URL { … […] static DOMString? ...
[Constructor(USVString url, optional USVString base), Exposed=(Window,Worker), …] interface URL { … […] static DOMString? ...
https://chromium.googlesource.com/chromium/src/+/master/third_party/WebKit/Source/core/dom/URLUtils.idl
[…] interface URLUtils { … attribute USVString search; // Not yet implemented. // attribute URLSearchParams searchParams; ...
http://trac.webkit.org/browser/trunk/Source/WebCore/html/DOMURL.idl
http://trac.webkit.org/browser/trunk/Source/WebCore/html/URLUtils.idl
WebIDL を比較するには ● 継承などの解決 ● Extended attributes （ [ と ] の間）
URL Standard
Gecko
Chromium
WebKit
まとめ ● WebIDL は仕様とブラウザーの共通言語の 1 つ ● API の実装状況が知りたい： WebIDL も参考になるかも
ご清聴ありがとうございました
おまけ ● URL 関連 API の変化 ● WebIDL である必然性 ● WebIDL の仕様と実際の WebIDL ● 実際にコンパイルされる WebIDL の推定
URL 関連 API の変化 ● 仕様（ URL Standard ） – 2015 年夏頃まで： URL.href や HTMLAnchor.href 、 Location.href などを URLUtils にまとめる – 2015 年夏以...
URLUtils URLUtilsSearchParams URLUtilsReadOnlyWorkerLocation HTMLAnchorElement HTMLAreaElement Location URL 仕様（ 2015 年夏ごろま...
HTMLHyperlinkElementUtils WorkerLocation HTMLAnchorElement HTMLAreaElement Location URL 仕様（ 2016 年 1 月）
URL 関連 API の変化 ● ブラウザーの実装 – Gecko ： 45 で仕様に合わせて更新 （ Bug 121385） – Chromium ：今後仕様に合わせて更新？ （ dff906e） – WebKit ：？
HTMLHyperlinkElementUtils URLUtilsReadOnlyWorkerLocation HTMLAnchorElement HTMLAreaElement Location URL Gecko
URLUtils URLUtilsReadOnlyWorkerLocation HTMLAnchorElement HTMLAreaElement Location URL Chromium
URLUtils WorkerLocation HTMLAnchorElement HTMLAreaElement Location URL WebKit
WebIDL である必然性 ● WebIDL の構文は ECMAScript とは別物 – WebIDL でインタフェースを定義する必然性はない ● Ecmarkup を使っている仕様 https://streams.spec.whatwg.o...
WebIDL の仕様と実際の WebIDL ● 仕様に書かれている WebIDL – 古い WebIDL 仕様をもとに書かれている ● ブラウザーの開発に使われている WebIDL – 古い WebIDL 仕様をもとに書かれている – 独自拡張...
Foo[] → FronzenArray<Foo> ● https://lists.w3.org/Archives/Public/pu blic-webapps/2015JulSep/0165.html – WebIDL の仕様が変わったよ –...
ブラウザーの WebIDL ● MDN: Information contained in a WebIDL f fle ● WebIDL in Blink ● WebKitIDL
ビルドされる WebIDL の推定 ● どの機能がビルドされるかの推定が面倒 – 実際にビルドするのも面倒… ● （ Gecko ）ランタイムフラグの推定が面倒 – Worker.webidl – mozilla::dom::workers::...
Upcoming SlideShare
Loading in...5
×

WebIDLを見てみる

127
 -1

Published on

JSer.info 5周年記念イベント
http://jser.connpass.com/event/24202/

Published in: Engineering
0 Comments
0 Likes
Statistics
Notes
no profile picture user

  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
127
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

WebIDLを見てみる

  1. 1. WebIDL を見てみる ブラウザーに実装されている API を知りたい @Takenspc
  2. 2. 内容 ● 背景 ● WebIDL を見てみる ● まとめ
  3. 3. 背景 ● ブラウザーで使える API ：たくさんある – 新たな API が生まれる – 途中で API が変わる ● 実際に使える API は何なのか、知りたい
  4. 4. Specifications BrowserContent ??? ??? ??? ??? ???
  5. 5. 例えば、こう書ける？ const url = new URL('…?foo=0&bar=1'); for (const param of url.searchParams) { console.log(param[0], param[1]); }
  6. 6. http://caniuse.com/#search=URLSearchParams
  7. 7. https://dev.windows.com/en-us/microsoft-edge/platform/status/urlapi
  8. 8. https://developer.mozilla.org/en-US/docs/Web/API/URL
  9. 9. 実際のところ… Chrome Firefox IE Safari URL.searchParams N/A 29+ N/A N/A URLSearchParams 49+ 29+ N/A N/A @@iterator 49+ 44+ N/A N/A
  10. 10. 現状 ● ブラウザーの実装とドキュメントが分離 – 粒度や作成・更新頻度がニーズと異なる場合も
  11. 11. ブラウザーの実装は…？ ● ブラウザーも誰かが書いてるはず
  12. 12. Specifications BrowserContent ??? ??? ??? ??? ???
  13. 13. 結論から言うと ● 主なブラウザーの開発では WebIDL からイン タフェースを機械生成 ● WebIDL は各仕様が定義
  14. 14. Specifications BrowserContent WebIDL WebIDL
  15. 15. Specifications BrowserContent Available Behind a flag Not compiled Not implemented WebIDL WebIDL
  16. 16. WebIDL ● Web 技術向け IDL – ECMAScript に特化
  17. 17. https://heycam.github.io/webidl/
  18. 18. WebIDL ● 仕様とブラウザーの共通言語の 1 つ – 共通言語なので比較可能
  19. 19. WebIDL を見てみる ● 仕様（ URL Standard ） ● Web Platform Tests ● Gecko ● Chromium ● WebKit
  20. 20. https://url.spec.whatwg.org/#api
  21. 21. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToASCII(USVString domain); static USVString domainToUnicode(USVString domain); stringifier attribute USVString href; readonly attribute USVString origin; attribute USVString protocol; … attribute USVString search; readonly attribute URLSearchParams searchParams; attribute USVString hash; }; URL Standard
  22. 22. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToASCII(USVString domain); static USVString domainToUnicode(USVString domain); stringifier attribute USVString href; readonly attribute USVString origin; attribute USVString protocol; … attribute USVString search; readonly attribute URLSearchParams searchParams; attribute USVString hash; }; コンストラクタ インタフェース名 仮引数 URL Standard
  23. 23. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToASCII(USVString domain); static USVString domainToUnicode(USVString domain); stringifier attribute USVString href; readonly attribute USVString origin; attribute USVString protocol; … attribute USVString search; readonly attribute URLSearchParams searchParams; attribute USVString hash; }; 戻り値の型 メソッド名 仮引数 URL Standard
  24. 24. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToASCII(USVString domain); static USVString domainToUnicode(USVString domain); stringifier attribute USVString href; readonly attribute USVString origin; attribute USVString protocol; … attribute USVString search; readonly attribute URLSearchParams searchParams; attribute USVString hash; }; 型 プロパティ名 URL Standard
  25. 25. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker)] interface URL { static USVString domainToASCII(USVString domain); static USVString domainToUnicode(USVString domain); stringifier attribute USVString href; readonly attribute USVString origin; attribute USVString protocol; … attribute USVString search; readonly attribute URLSearchParams searchParams; attribute USVString hash; }; URL Standard
  26. 26. https://github.com/w3c/web-platform-tests/blob/master/url/interfaces.html
  27. 27. https://dxr.mozilla.org/mozilla-central/source/dom/webidl/URL.webidl
  28. 28. […] interface URL { … […] attribute USVString search; readonly attribute URLSearchParams searchParams; … }; Gecko
  29. 29. https://chromium.googlesource.com/chromium/src/+/master/third_party/WebKit/Source/core/dom/URL.idl
  30. 30. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker), …] interface URL { … […] static DOMString? createObjectURL(Blob blob); […] static void revokeObjectURL(DOMString url); }; URL implements URLUtils; Chromium
  31. 31. [Constructor(USVString url, optional USVString base), Exposed=(Window,Worker), …] interface URL { … […] static DOMString? createObjectURL(Blob blob); […] static void revokeObjectURL(DOMString url); }; URL implements URLUtils; Chromium
  32. 32. https://chromium.googlesource.com/chromium/src/+/master/third_party/WebKit/Source/core/dom/URLUtils.idl
  33. 33. […] interface URLUtils { … attribute USVString search; // Not yet implemented. // attribute URLSearchParams searchParams; … }; Chromium
  34. 34. http://trac.webkit.org/browser/trunk/Source/WebCore/html/DOMURL.idl
  35. 35. http://trac.webkit.org/browser/trunk/Source/WebCore/html/URLUtils.idl
  36. 36. WebIDL を比較するには ● 継承などの解決 ● Extended attributes （ [ と ] の間）
  37. 37. URL Standard
  38. 38. Gecko
  39. 39. Chromium
  40. 40. WebKit
  41. 41. まとめ ● WebIDL は仕様とブラウザーの共通言語の 1 つ ● API の実装状況が知りたい： WebIDL も参考になるかも
  42. 42. ご清聴ありがとうございました
  43. 43. おまけ ● URL 関連 API の変化 ● WebIDL である必然性 ● WebIDL の仕様と実際の WebIDL ● 実際にコンパイルされる WebIDL の推定
  44. 44. URL 関連 API の変化 ● 仕様（ URL Standard ） – 2015 年夏頃まで： URL.href や HTMLAnchor.href 、 Location.href などを URLUtils にまとめる – 2015 年夏以降： URLUtils などにまとめることを 断念
  45. 45. URLUtils URLUtilsSearchParams URLUtilsReadOnlyWorkerLocation HTMLAnchorElement HTMLAreaElement Location URL 仕様（ 2015 年夏ごろまで）
  46. 46. HTMLHyperlinkElementUtils WorkerLocation HTMLAnchorElement HTMLAreaElement Location URL 仕様（ 2016 年 1 月）
  47. 47. URL 関連 API の変化 ● ブラウザーの実装 – Gecko ： 45 で仕様に合わせて更新 （ Bug 121385） – Chromium ：今後仕様に合わせて更新？ （ dff906e） – WebKit ：？
  48. 48. HTMLHyperlinkElementUtils URLUtilsReadOnlyWorkerLocation HTMLAnchorElement HTMLAreaElement Location URL Gecko
  49. 49. URLUtils URLUtilsReadOnlyWorkerLocation HTMLAnchorElement HTMLAreaElement Location URL Chromium
  50. 50. URLUtils WorkerLocation HTMLAnchorElement HTMLAreaElement Location URL WebKit
  51. 51. WebIDL である必然性 ● WebIDL の構文は ECMAScript とは別物 – WebIDL でインタフェースを定義する必然性はない ● Ecmarkup を使っている仕様 https://streams.spec.whatwg.org/
  52. 52. WebIDL の仕様と実際の WebIDL ● 仕様に書かれている WebIDL – 古い WebIDL 仕様をもとに書かれている ● ブラウザーの開発に使われている WebIDL – 古い WebIDL 仕様をもとに書かれている – 独自拡張が施されている
  53. 53. Foo[] → FronzenArray<Foo> ● https://lists.w3.org/Archives/Public/pu blic-webapps/2015JulSep/0165.html – WebIDL の仕様が変わったよ – それぞれの仕様に書かれている WebIDL も更新し よう ● まだ終わっていない
  54. 54. ブラウザーの WebIDL ● MDN: Information contained in a WebIDL f fle ● WebIDL in Blink ● WebKitIDL
  55. 55. ビルドされる WebIDL の推定 ● どの機能がビルドされるかの推定が面倒 – 実際にビルドするのも面倒… ● （ Gecko ）ランタイムフラグの推定が面倒 – Worker.webidl – mozilla::dom::workers::WorkerPrivate::Work erAvailable

  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×