68 episodes

talking about next generation web technologies hosted by Jxck

mozaic.fm Jxck

    • Technology

talking about next generation web technologies hosted by Jxck

    ep61 Yearly Web 2019 | mozaic.fm

    ep61 Yearly Web 2019 | mozaic.fm

    # ep61 Yearly Web 2019

    第 61 回のテーマは 2019 年の Yearly Web です。

    今年行った Monthly Web を振り返ります。


    ## Show Note


    ### 2019 年キーワード


    #### Jxck

    - WebTransport
    - SXG/WBN
    - ITP/SameSIte Default Lax
    - DarkMode/HighContrast
    - DesignSystem
    - Document Policy
    - Portal
    - DoH


    #### myakura

    - doh
    - cookie
    - firefox css support
    - subgrid
    - aspectratio
    - apple/mozilla -> google
    - chromium への不安


    ### 1 月

    - Chrome
    - Intent to Ship: Signed HTTP Exchanges (SXG)
    - Intent to Implement: High Contrast support
    - Intent to Deprecate and Remove: Shadow DOM V0, Custom Elements V0, HTML Imports
    - Extensions Manifest v3 の WebRequest to declarativeNetRequest API
    - Firefox
    - WebP / AVI1 Support
    - Intent to Ship: default noopener for `_blank`
    - Anti Tracking Policy
    - Safari
    - TP74 U2F HID Authenticators
    - TP74 Disable WebSQL default
    - Remove Legacy SPDY Support
    - TP73 -> iOS 12.1
    - Edge
    - W3C
    - Alex / Travis が TAG を抜け Alice Boxhall が join
    - WICG や Chrome チームの explainer プロセスについて問題視
    - Edge チームから HTML Modules の提案
    - TC39
    - ES2019 に入る 8 つの機能(現 Stage 4)が確定
    - Optional catch binding
    - JSON superset
    - Symbol.prototype.description
    - Function.prototype.toString
    - Object.fromEntries
    - Well-formed JSON.stringify
    - String.prototype.{trimStart,trimEnd}
    - Array.prototype.{flat,flatMap}
    - IETF
    - Cache Digests が実装無くて終わりそう
    - H2 Priority みんなちゃんと実装できてない問題
    - Security
    - Github で TLS1.3 ロールアウト
    - LE が証明書提供前に Google Safe Browsing を見るのをやめた
    - 証明書の担保する安全(コンテンツを含まない)の議論
    - Other
    - `` のデモ
    - twitter の .well-known/change-password サポート


    ### 2 月

    - Chrome
    - TWA for Android
    - passive event for scroll by default
    - BF Cache 実装
    - Ship: Private Class Field
    - V8/Blink 統合 GC の Oilpan が Finch 開始
    - Intent to Impl: import maps
    - Intents のフォーマット統一開始
    - .dev 提供開始
    - Android が FIDO2 認証取得
    - Firefox
    - BigInt, prefers-color-scheme ettc
    - Rust で Style Component 書き直す話
    - Safari
    - TP75,76
    - Safari 12.1 Release
    - Push prompt に user gesture
    - prefers-color-scheme: dark
    - Do Not Track 削除
    - default noopener for `_blank`
    - ITP2.1
    - Edge
    - IE やめよう論争
    - MS の声明が雑に翻訳されてそうなった
    - MicrosoftEdge/wptest より簡単に WPTest 各仕組み
    - W3C
    - Salesforce が W3C に参加
    - W3C が中規模企業プラン用意
    - W3C Process 更新、 AB メンバの席や、 Contribution ライセンスの整備
    - TC39
    - Single-Chair + Vice Chair 構成から Flat 3 Chair にし責任分散
    - ES2020 開始
    - IETF
    - Github を IETF で使う流れを整備
    - Fake SNI (security で詳しく)
    - Security
    - 韓国で SNI Blocking
    - ESNI と ESNI Block と Fake SNI
    - Other


    ### 3 月

    - Chrome
    - Implement: Subresource prefetching+loading via Signed HTTP Exchange
    - Implement: Alternative Text in CSS Generated Content
    - Experiment: KV storage built-in module + import maps
    - JIT-less V8
    - AMP for Email
    - Firefox
    - Ship: Dynamic module imports (JS `import()` syntax)
    - Ship: String.prototype.matchAll
    - Ship: CSS Containment
    - Implement: cryptomining and fingerprinting resource blocking
    - コンテンツブロッキングのリストに Mining/Fingerprint が追加された
    - Coinhive なども入っている
    - Unship: Some Shadow DOM v0 APIs
    - Safari
    - TP77
    - Made navigator.mediaDevices SecureContext (r241602)
    - TP78
    - Enabled support for Pointer Events by default (r242232)
    - Added support for the referrerpolicy attribute (r242534)

    • 4 hrs 19 min
    ep60 Monthly Web 201911 | mozaic.fm

    ep60 Monthly Web 201911 | mozaic.fm

    # ep60 Monthly Web 201911

    第 60 回のテーマは 2019 年 11 月の Monthly Web です。


    ### Chrome 動向

    - Stable: 78
    - *Chrome Dev Summit 2019*
    - https://developer.chrome.com/devsummit/
    - Chromium Blog: Chrome Dev Summit 2019: Elevating the Web Together
    - https://blog.chromium.org/2019/11/chrome-dev-summit-2019-elevating-web.html
    - Highlights from Chrome Dev Summit 2019
    - https://bitsofco.de/chrome-dev-summit-2019/
    - *Keynote*
    - https://www.youtube.com/watch?v=F1UP7wRCPH8
    - LayoutNG
    - 約 10 %のレイアウトバグの修正
    - 最大 5 %の描画パフォーマンスの向上
    - 複雑な言語におけるパフォーマンスの改善(RTL など)
    - emoji の描画が速くなった
    - http archive に記録されている z-index の最大値: 780 桁の 99999... !important
    - ブラウザ上でコードを変更しながら Lighthouse のスコアを改善するデモ
    - 3 つの重要なゴール
    - Better performance
    - More accessible
    - More safe and trustworthy
    - 各種 API の紹介
    - WebP in its 10th year
    - https://www.youtube.com/watch?v=-wrXKvnPfZg
    - PhotoShop, AndroidStudio, Squoosh, Gimp, ImageMagick などで WebP を出力できる
    - Chrome's ecosystem collaboration
    - https://www.youtube.com/watch?v=64MqeSKs8Fo
    - User-first interactive sites with AMP
    - https://www.youtube.com/watch?v=FiZSaqJR9mM
    - Speed highlights
    - https://www.youtube.com/watch?v=5_Ns2xfBMLw
    - Trust & safety highlights
    - https://www.youtube.com/watch?v=vZUDAdIozXM
    - Web as a building block for user experience
    - https://www.youtube.com/watch?v=2x046UBf2xI
    - *HTML isn't done!*
    - https://www.youtube.com/watch?v=ZFvPLrKZywA
    - Edge & Chrome form control collaboration
    - chrome://flags/#form-controls-refresh
    - High contrast mode
    - `@media(forced-colors: active)`
    - `forced-color-adjust: auto | none`
    - Stylability
    - 多くの開発者が form elements をスクラッチで書き直している
    - まずは select, checkbox, radio の stylability にフォーカスしていく
    - Extensibility
    - select, option を拡張が拡張できるように今後していく
    - New components
    - Display Locking is available in Origin Trial
    - *Intent to explain: Demystifying the Blink shipping process*
    - https://www.youtube.com/watch?v=y3EZx_b-7tk
    - Intent to Implement と読んでいたものを Intent to Prototype に変更
    - フラグ付きで試験的に提供するだけで、強いコミットメントではないことを明確にしたかった
    - Bridging the native app gap
    - https://www.youtube.com/watch?v=JKVZMqpiY7w
    - *PWA and the installable web*
    - https://www.youtube.com/watch?v=Hp_dQvQyYEI
    - OYO の事例 by Mukund, Product Manager for OYO Consumer Experience
    - もとのサイトに比べて、 Chrome の PWA では 4.4 倍、 Trusted Web Activity では 6.6 倍の conversion があった。
    - TWA のアプリは 900KB 未満の app size
    - Next-generation web styling
    - https://www.youtube.com/watch?v=-oyeaIirVC0
    - Adaptive Loading - improving web performance on slow devices
    - https://www.youtube.com/watch?v=puUPpVrIRkc
    - The main thread is overworked & underpaid
    - https://www.youtube.com/watch?v=7Rrv9qFMWNM
    - Speed tooling evolutions: 2019 and beyond
    - https://www.youtube.com/watch?v=iaWLXf1FgI0
    - What's new in sign-up and sign-in
    - https://www.youtube.com/watch?v=WxXF17k1dko
    - SMS Receiver API
    - Web Authentication API
    - *Protecting users on a thriving web*
    - https://www.youtube.com/watch?v=WnCKlNE52tc
    - ユーザーがどこにいるか、ウェブサイトがユーザーから何を得ているかを明確にすることがゴール
    - IDN spoofing の対

    • 2 hrs 21 min
    ep59 Monthly Web 201910 | mozaic.fm

    ep59 Monthly Web 201910 | mozaic.fm

    # ep59 Monthly Web 201910

    第 59 回のテーマは 2019 年 10 月の Monthly Web です。


    ### Chrome 動向

    - Stable: 78
    - Updates
    - New in Chrome 78
    - https://developers.google.com/web/updates/2019/10/nic78
    - CSS Properties and Values API
    - Fresher service workers
    - Native File System
    - SMS Receiver
    - *Chromium Blog: No More Mixed Messages About HTTPS*
    - https://blog.chromium.org/2019/10/no-more-mixed-messages-about-https.html
    - Mixed Contents に関するタイムライン
    - Chrome 79 (2019/12): Shield icon を消して site settings に unblock 設定が移る
    - Chrome 80 (2020/01): audio/video の autoupgrade, だめなら block, mixed image as "Not Secure"
    - Chrome 81 (2020/03): image が autoupgrade, だめなら block
    - *Chromium Blog: Chrome UI for Deprecating Legacy TLS Versions*
    - https://blog.chromium.org/2019/10/chrome-ui-for-deprecating-legacy-tls.html
    - TLS 1.0/1.1 はまだ 0.5% ある
    - Chrome 79 から "Not Secure" にする
    - Chrome 81 (2020/3) からはブロックされる
    - *What's New In DevTools (Chrome 79)*
    - https://developers.google.com/web/updates/2019/10/devtools
    - Debug why a cookie was blocked
    - Simulate different prefers-color-scheme and prefers-reduced-motion preferences
    - Code coverage updates
    - Debug why a network resource was requested
    - Console and Sources panels respect indentation preferences again
    - New shortcuts for cursor navigation
    - *Chromium Blog: Recent Site Isolation improvements*
    - https://blog.chromium.org/2019/10/recent-site-isolation-improvements.html
    - Chrome 77 での改善について
    - Android でパスワード入力をするサイトが分離される
    - モバイルでは全部を分離するとオーバーヘッドが大きい
    - Password Input するサイトだけ分離する
    - RAM 2GB 以上のユーザ 99% でこれを有効にして、計測中
    - 将来は、サイトがオプトインで分離を有効にできるようにしていく
    - Desktop では Sidechannel だけでなくレンダラプロセス内の攻撃も防ぐ
    - レンダリングプロセスのバグをつかれても情報がもれないように
    - Cookie/Password etc のアクセスを制限
    - CORB や CORP の適用
    - Sec-Fetch-Site/Origin ヘッダを併用
    - *Chromium Blog: Automatically lazy-loading offscreen images & iframes for Lite mode users*
    - https://blog.chromium.org/2019/10/automatically-lazy-loading-offscreen.html
    - Lite Mode (Data Saver) が有効だと img/iframe が lazyloading される
    - Chrome 77 から
    - *Chromium Blog: Developers: Get Ready for New SameSite=None; Secure Cookie Settings*
    - https://blog.chromium.org/2019/10/developers-get-ready-for-new.html
    - 2020/2 の Chrome 80 から Cookie のデフォルトが変わる
    - SameSite=None Secure な Cookie しか Cross Site で送られない
    - 今まで Cross Site に Cookie が送られることを前提としていたサイトは直す必要
    - 壊れるサイトも多いからどうなるか
    - Intents
    - *Ship: Compute img/video aspect ratio from width and height HTML attributes*
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/GePU9T8UpEc/bET6Mi60CgAJ
    - Ship: Add calendar options/patterns and other calendars
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/Vd-cIE8fjZc/pJA4QEWtCgAJ
    - Ship: line-break: anywhere
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/8qesjfh0a80/xrruWrixBwAJ
    - Ship: WebXR Gamepad Module
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/Nvll21RaKwM/fTn8qUaNBwAJ
    - Ship: WebXR Device API
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/CHCM_xALBG4/JeQQYkONBwAJ
    - Ship: RTCRtpReceiver playoutDelayHint

    • 2 hrs 49 min
    ep58 WASI sideshow | mozaic.fm

    ep58 WASI sideshow | mozaic.fm

    # ep58 WASI sideshow

    第 58 回 WASI の Sideshow です。

    @chikoski さんとのこぼれ話です。


    ## Show Note

    - builderscon 2018
    - jsconfjp 2019
    - Tim Berners-Lee の発明/発見
    - Unity
    - Flutter for Web

    • 22 min
    ep58 WASI | mozaic.fm

    ep58 WASI | mozaic.fm

    # ep58 WASI

    第 58 回のテーマは WASI (WebAssembly System Interface) です。

    今回は @chikoski さんをお迎えし、事例もで始めた WASM が次のステップとして取り組んでいる WASI について、 WASI は何を目指し、今どうなっているのか。また、それは Web の進化に影響をするのかしないのか。

    2015-08-05 にやった WASM の回から WASM が辿った 4 年を振り返りつつ、今何が起こっているのか、これからどうなっていくのかを議論しました。


    ## Show Note

    - WASI resources.md by @Chikoski - GitHub
    - https://gist.github.com/chikoski/32a999326d2b638a3647284c537d7493
    - WASM
    - Core
    - https://webassembly.github.io/spec/core/bikeshed
    - JS-API
    - https://webassembly.github.io/spec/js-api
    - Web-API
    - https://webassembly.github.io/spec/web-api
    - WASI
    - WebAssembly/WASI: WebAssembly System Interface
    - https://github.com/WebAssembly/WASI
    - wasmtime/WASI-intro.md at master - CraneStation/wasmtime
    - https://github.com/CraneStation/wasmtime/blob/master/docs/WASI-intro.md
    - Entry
    - Standardizing WASI: A system interface to run WebAssembly outside the web - Mozilla Hacks - the Web developer blog
    - https://hacks.mozilla.org/2019/03/standardizing-wasi-a-webassembly-system-interface
    - WebAssembly Interface Types: Interoperate with All the Things! - Mozilla Hacks - the Web developer blog
    - https://hacks.mozilla.org/2019/08/webassembly-interface-types
    - Other
    - WebAssembly night !! - connpass
    - https://emsn.connpass.com
    - Squoosh
    - https://squoosh.app
    - こえのブログ
    - https://voice.ameba.jp

    • 1 hr 57 min
    ep57 Monthly Web 201909 | mozaic.fm

    ep57 Monthly Web 201909 | mozaic.fm

    # ep57 Monthly Web 201909

    第 57 回のテーマは 2019 年 9 月の Monthly Web です。


    ### Chrome 動向

    - Stable: 77
    - Updates
    - New in Chrome 77
    - https://developers.google.com/web/updates/2019/09/nic77
    - Largest Contentful Paint
    - The formdata event
    - Form-associated custom elements
    - Native lazy loading
    - Chrome Dev Summit 2019
    - What's New In DevTools (Chrome 78)
    - https://developers.google.com/web/updates/2019/09/devtools
    - *Chromium Blog: Chrome 78 Beta: a new Houdini API, native file system access and more*
    - https://blog.chromium.org/2019/09/chrome-78-beta-new-houdini-api-native.html
    - CSS Properties and Values
    - Native File System
    - Signed Exchange Subresource Prefetching and Loading by Extending the HTTP Link Header.
    - SMS Receiver API
    - Apply Opacity for the Default Style of INPUT/TEXTAREA placeholder
    - Don't Allow Popups During Page Unload
    - *Extend Byte-for-Byte Update Check to all Service Worker importScripts() Resources*
    - これまで importScripts は初期ロードでキャッシュされていた
    - 更新したい場合は URL にハッシュを追加して Top Level Script を更新する必要
    - これからはちゃんと確認しに行く
    - updateViaCache='none' や Cache-Control: max-age=0 (no-store?)等を設定
    - Firefox/Safari と挙動が揃った
    - https://developers.google.com/web/updates/2019/09/fresher-sw#checks_for_updates_to_imported_scripts
    - *Faster Web Sockets*
    - Linux: 7.5 times faster
    - Windows: 4.1 times faster
    - Mac: 7.8 times faster
    - More restrictive hasEnrolledInstrument() for Autofill Instruments
    - PaymentResponse.prototype.retry()
    - Percentage Opacity
    - Redact Address in PaymentRequest.onshippingaddresschange Event
    - Seeking
    - User Timing L3
    - Disallow Synchronous XHR in Page Dismissal
    - XSS Auditor
    - Trusted Web Activities Quick Start Guide
    - https://developers.google.com/web/updates/2019/08/twas-quickstart
    - *Network Service ownership and next steps*
    - https://groups.google.com/a/chromium.org/forum/#!msg/network-service-dev/5HATwq4CE50/JMMOI9QJAAAJ
    - 2.5 年かけて off the main thread を進めてきた
    - 1100 bugs の 3200 行を 150 人が書き 250 人がレビューした
    - セキュリティレイヤを追加し、ジャンクを改善、 SW のプロセスホップを 4->0 にした
    - クラッシュの 8% をレンダリングプロセスからブラウザプロセスに移し、回復可能にした
    - この Chrome 史上最大のリファクタリングに貢献した kinuko さんが今後オーナーになる
    - ネットワークサービスに関する全てのデザインレビューは kinuko さんを通すことに
    - Intents
    - Ship: mixed content autoupgrading for audio and video
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/XI1otbsuvMw/X_65dN7qAgAJ
    - Implement and Ship: Autofocus support for any focusable HTML/SVG element
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/g8MP8KUf96w/360rLewrDwAJ
    - Implement and Ship: Display alerts for SameSite cookie changes in the developer console
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/O_uF2FBXacA/oclqAWFSDgAJ
    - Implement and Ship: Add frozen or active lifecycleState to ServiceWorker Client
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/5yXXzCrBJ98/1PlnJyT6AQAJ
    - Implement and Ship: Do not resurrect uninstalled service workers
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/r176Lvgxfys/4W4IGM4uAgAJ
    - Implement and Ship: ontransition{run, start, cancel} event handler attributes
    - https://groups.google.com/a/chromium.org/forum/#!msg/blink-dev/dxDGBFKvO3A/A2gajDMjAwAJ
    - Implement and Ship: ServiceW

    • 3 hrs 2 min

Top Podcasts In Technology

Listeners Also Subscribed To