こんにちは! サイボウズ株式会社フロントエンドエンジニアの Saji (@sajikix) です。
はじめに
サイボウズでは毎週火曜日に Frontend Weekly という「一週間にあったフロントエンドニュースを共有する会」を社内で開催しています。
今回は、2024/02/06 の Frontend Weekly で取り上げた記事や話題を紹介します。
取り上げた記事・話題
テストの学習へようこそ！ | web.dev
web.dev が公開している学習コンテンツのシリーズにテストのコンテンツが追加されました。
web アプリケーションのテストに不慣れな初学者が一通り学ぶ際などに適していそうです。一部のコンテンツは近日提供予定になっており今後の更新も楽しみな内容となっています。
The web just gets better with Interop 2024
ウェブブラウザの相互運用性を改善するプロジェクトである Interop の 2024 版における対象機能が発表されました。
CSS Nesting に加えて Declarative Shadow DOM なども入っており、WebComponents の可用性が高まる一年となりそうです。また Popover 属性のサポートや SubGrid 対応がより進むなどの内容も盛り込まれています。
3 月 12 日に「Interaction to Next Paint」がウェブに関する主な指標に | Blog | web.dev
3/12 から CoreWebVitals の指標の 1 つである FID が INP に変更されます。プログラムの応答性を図る指標である FID はインタラクションの多い SPA などの画面に対しては適切な指標とは言いづらい面があり、ページ訪問の全期間を通じて起こる操作のレイテンシを測定する INP に置き換える決断をしたようです。
Release Notes for Safari Technology Preview 185
Safari の TP 185 で input 要素に switch 属性が実装されました。スマートフォンにおいて標準的に利用される UI であるトグルスイッチがより簡単に実装できるようになります。
https://remix.run/blog/oss-remix-dot-run
remix.run のサイトのコードが公開されました。SSG を利用していない理由や remix 自体のドッグフーディングにも利用されていることなども書かれています。
Vite 5.1.0-beta.6 (2024-02-01)
Vite 5.1.0 beta6 がリリースされました。SSR 中の HMR を多くのランタイムでサポート可能にする Vite Runtime API が試験的にサポートされています。
また CSS preprocessors を別スレッドで実行することでパフォーマンスを向上させる機能なども入っています。
【脱仮想 DOM !?】Vue.js が控えている進化 "Vapor Mode" の詳細 (2023/12)
Vue.js の Vapor Mode に関する記事です。Vue.js が実験的に進めている Vapor Mode では今まで利用していた仮想 DOM を廃止することを目指しているようです。
Import attributes · V8
V8 では v12.3 から Import assertions が非推奨になり v12.6 で廃止される予定です。今後は Import assertions のデメリットを補う新しい提案である Import attributes を利用することを推奨しています。
Deno 1.40: Temporal API
Deno 1.40 がリリースされました。Temporal API がフラグ付きでサポートされ、ECMAScript Decorator も利用可能になるなどのアップデートがあります。
Call for Participation in JSX as markup language Community Group
JSX を仕様として策定するためのコミュニティグループが W3C にできました。
Migrating from Zod to Valibot: A Comparative Experience | Matthew Kwong
Valibot を実際に使ってみてのよかった点悪かった点などをあげている記事です。Valibot の採用を検討している方は参考になりそうです。
Discussion