Search

Home > mozaic.fm > ep29 Houdini | mozaic.fm
Podcast: mozaic.fm
Episode:

ep29 Houdini | mozaic.fm
Category: Technology
Duration: 01:57:27
Publish Date: 2017-11-01 10:00:00
Description: # ep29 Houdini 第 29 回のテーマは Houdini です。 今回は、ゲストとして Chrome チームの開発者であり、 CSS の標準化にも関わられている @kojiishi さんをお呼びし、 Houdini がどういうモチベーションで始まり、現在仕様策定や実装状況はどうなっているのか。 実装する上での問題点や、今後の展望をお聞きし、今後 Houdini が CSS に対してどういった影響を及ぼしていくかを踏まえ、「**今何がおこっているのか**」と「**これからどうなっていくのか**」について議論しました。 ## Show Note - Koji さんのドラフト - CSS Text Module Level 3 - CSS Text Decoration Module Level 3 - CSS Inline Layout Module Level 3 - CSS Ruby Layout Module Level 1 - CSS Writing Modes Level 3 - CSS Line Grid Module Level 1 - CSS Rhythmic Sizing - UAX \#50: Unicode Vertical Text Layout - CSS\-TAG Houdini Editor Drafts (github) - Worklets Level 1 - JS のメインスレッドとは別に実行される環境 - ハイレベル API で使用される定義される - WebWorker とは違う。イベントベースですらない - Class で適宜したハンドラを渡すと内部で実行される - CSS Properties and Values API Level 1 - name, syntax, inherits, init を指定して任意のプロパティを registerProperty する - CSS Typed OM Level 1 - attributeStyleMap 経由で型と値を操作 - CSSXXXValue などで値を計算 - Box Tree API Level 1 - 行の折り返しなどで生成される Fragment にアクセスできる API - まだ中身があまりない - CSS Parser API - CSS パーサを export し CSS を解析した中間表現にアクセスできるように - まだ中身がほぼない - use case: https://github.com/WICG/CSS-Parser-API - CSS Painting API Level 1 - ペイント領域に対して Canvas API サブセットで好きなように描画できる - CSS Layout API Level 1 - Style Tree で生成された Fragment をどう配置するかを決める - OutPut として Box Tree を提供し、それをブラウザがペイントする - Flexbox や Grid みたいなものを自分で定義できる - Font Metrics API Level 1 - baseline などレイアウトに必要なメトリクス情報を取得する - Paint API で StokeText できないと困る話 - why no fillText/strokeText ? Issue \#478 - Minutes Paris F2F 2017-08-01 - Part I: AnimationWorklet, TypedOM - Part II: CSS Properties & Values, Custom Paint - Part III: Layout Worklets, Future Meetings - レシピの中括弧 - https://wiki.csswg.org/planning/tokyo-2017#afternoon1 - CSS Paint API での実装例 - TPAC 2017 - TPAC 2017 - TPAC F2F November 2017 - 各ベンダの最近の CSS エンジン改善 - FF: Quantum \- MozillaWiki - Edge: Making the web smoother with independent rendering \- Microsoft Edge Dev Blog - Chrome: LayoutNG, Sliming Paint V2 - see also - GoogleChromeLabs/houdini\-samples - Is Houdini Ready Yet? - BlinkOn 8: Line Layout Deep Dive
Total Play: 0