window.windowとは何か / What is window window

20180619
@We Are JavaScripters! #21

MDN – Window.window
https://developer.mozilla.org/en-US/docs/Web/API/Window/window

MDN – Inner and Outer windows
https://developer.mozilla.org/en-US/docs/Mozilla/Developer_guide/Inner_and_outer_windows

Defining the WindowProxy, Window, and Location objects
https://blog.whatwg.org/windowproxy-window-and-location

WindowProxy「俺の名前はいっぱいあってな…」
https://qiita.com/yuki3/items/4ee2d6fff0865f806ded

The Chromium Projects – Out-of-Process iframes (OOPIFs)
https://www.chromium.org/developers/design-documents/oop-iframes

Chromium Code Search
https://cs.chromium.org/chromium/src/third_party/blink/renderer/bindings/core/v8/window_proxy.cc?dr=C&pv=1&g=0&l=108-151
https://cs.chromium.org/chromium/src/third_party/blink/renderer/core/frame/dom_window.h?gsn=%22third_party/blink/renderer/core/frame/dom_window.h%22&g=0&l=120

Transcript

1. window.window ͱ͸Կ͔ Edward Fox 2018/06/19 @We Are JavaScripters! #21
2. @edwardkenfox Edward Fox ɾWEBΤϯδχΞ @ Reproגࣜձࣾ ɾWEBʗϒϥ΢βٕज़શൠɺPWA ɾΫϥϑτϏʔϧɺԻָɺόεέ
3. ϑϩϯτΤϯυͷJSΛ ॻ͍ͨ͜ͱ͋Ε͹ window͸Α͘৮Γ·͢ΑͶ
4. window.window Λ஌͍ͬͯ·͔͢ʁ
5. i window === window.window // => true
6. ͜Ε͸Ұମ…ʁ
7. ࣮͸HTMLن֨ʹΑͬͯ ͪΌΜͱඪ४Խ͞Εͨ WindowͷϓϩύςΟ
9. MDNΑΓҾ༻ > The window property of a window object points to the window object itself. https://developer.mozilla.org/en-US/docs/Web/API/Window/window
10. window.window ͸Կ͕خ͍͠ͷ͔ʁ
11. ಉ͡MDNͷهࣄʹ ΑΔͱ࣍ͷΑ͏ͳཧ༝
12. window.window͕͋Δͱ… ɾάϩʔόϧΦϒδΣΫτ΁ͷࢀরΛ͠΍͘͢͢Δ ɾopen(URL)͡Όͳͯ͘window.open(URL)ͱॻ͚Δ ɾϥΠϒϥϦΛॻ͘ࡍʹOOPϥΠΫʹॻ͚Δ
13. ͱ͋Δ΋ͷͷɺ > was likely to … > Yet another reason to use this property… ͱ͍͏จମͰઆ໌͕ϑΝδʔ
14. ͋·Γೲಘײͳ͍ͷͰ ΋ͬͱௐ΂࣮ͭͭ૷ݟͯΈͨΒ ৭ʑͱֶͼ͕͋ͬͨ
15. window΋window.window΋ ࣮͸ Window ΦϒδΣΫτͰ͸ͳ͘ɺ WindowProxy ΦϒδΣΫτͩͬͨ
16. WindowProxy ݱࡏͷʢΞΫςΟϒͳʣWindow΁ͷ ϓϩΩγͱͯ͠ಈ࡞͢Δɻϒϥ΢β͕ ಺෦తʹ࣋ͭWindowͦͷ΋ͷͰ͸ͳ͘ɺ Windowͷϥούʔɻ
17. https://developer.mozilla.org/en-US/docs/Mozilla/Developer_guide/Inner_and_outer_windows
18. ͋ΒͨΊͯ WindowProxy͕͋Δͱ Կ͕خ͍͠ͷ͔ʁ
19. WindowProxy͕͋Δͱخ͍͠ਓͨͪ ɾඇදࣔͱͳͬͨφϏήʔγϣϯલͷWindowʹ ΞΫηε͠ଓ͚Δ͜ͱ͕ͳ͘ͳΔʢ΢Σϒ։ൃऀʣ ɾφϏήʔγϣϯલͷϖʔδ΍ϦιʔεΛഁغͰ͖Δ Α͏ʹͳΔʢϢʔβʔʣ ɾφϏήʔγϣϯલͷ΢Οϯυ΢ʹΞΫηεͨ͠৔߹ ͷ࢓༷Λߟ͑ͳͯ͘ࡁΉΑ͏ʹͳΔʢϒϥ΢β։ൃऀʣ https://qiita.com/yuki3/items/4ee2d6fff0865f806ded
20. https://developer.mozilla.org/en-US/docs/Mozilla/Developer_guide/Inner_and_outer_windows
21. ͜ΕҎ֎ʹ΋ɺ ΫϩεΦϦδϯͳDOMΞΫηε ͳͲɺηΩϡϦςΟʹؔ࿈͢Δ ϒϥ΢βͷػೳͳͲΛ࣮ݱͷͨΊʹ WindowProxy͕׆༂ͯͨ͠Γ͢Δ
22. ͞Βʹݟ͍ͯ͘ͱ Out-of-Process iframes ʢOOPIFsʣͱ͍͏ɺ ChromiumͷϓϩηεϞσϧ΍ΞʔΩς Ϋνϟʹ΋ਂؔ͘࿈͍ͯ͠Δ͜ͱ͕ Θ͔ͬͨ
23. i https://www.chromium.org/developers/design-documents/oop-iframes
24. Chromiumͷιʔεతʹ͸͜ͷ΁Μʁ ɾhttps://cs.chromium.org/chromium/src/third_party/blink/ renderer/bindings/core/v8/window_proxy.cc? dr=C&pv=1&g=0&l=108-151 ɾhttps://cs.chromium.org/chromium/src/third_party/blink/ renderer/core/frame/dom_window.h?gsn=%22third_party/ blink/renderer/core/frame/dom_window.h%22&g=0&l=120
25. ·ͱΊ ɾwindow΋window.window΋ WindowͰ͸ͳ͘WindowProxyͩͬͨ ɾWindowProxy͸ϞμϯͳWEBΛࢧ͑Δ ϒϥ΢βΞʔΩςΫνϟͷҰ୴Λ୲ͬͯ ͍ͨ
26. We are hiring!
27. i
28. ग़లʗҾ༻ʗࢀߟ ɾhttps://developer.mozilla.org/en-US/docs/Web/API/Window/window ɾhttps://developer.mozilla.org/en-US/docs/Mozilla/Developer_guide/ Inner_and_outer_windows ɾhttps://blog.whatwg.org/windowproxy-window-and-location ɾhttps://qiita.com/yuki3/items/4ee2d6fff0865f806ded ɾhttps://www.chromium.org/developers/design-documents/oop- iframes
29. Fin