フロントエンドカンファレンス北海道2025
LT(5分)

JSゼロで動かす！最新CSS条件分岐UIパターン3選

Wakki

新卒フロントエンド開発者の私が、最近ブラウザに導入されたif()/else、:has()、@supports、コンテナクエリといった最新のCSS機能を紹介しつつ、「JavascriptなしでどこまでインタラクティブUIを作れるか」を5分で解説するセッションです。
モーダルやアコーディオン実装などCSSだけで実現可能なUIパターンを見せながらJavascriptを使わない選択肢があるということをお伝えします。またパフォーマンス＆互換性の最適化ポイント、CSSとJavascript実装それぞれのサイズ＆速度比較もコンパクトにお届けします。
最新CSS機能がどういう風に使われてるのかを知りたい方や、CSSプロトタイピングやJavascript以外の選択肢に興味がある方に最適です。