こんにちは！サイボウズ株式会社フロントエンドエンジニアのおぐえもん（@oguemon_com）です。
はじめに
サイボウズでは毎週火曜日にFrontend Weeklyという「一週間にあったフロントエンドニュースを共有する会」を社内で開催しています。
今回は、2024年5月14日のFrontend Weeklyで取り上げた記事や話題を紹介します。
取り上げた記事・話題
The Front End Developer/Engineer Handbook 2024
2024年のフロントエンド周辺の領域に関する解説を網羅的に扱ったドキュメントです。
Libraries with issues #25
Reactを取り巻く一部の周辺ライブラリで起票したReact19対応IssueをまとめたIssueです。
JavaScript: 最初の 20 年
Allen Wirfs-Brock, Brendan Eich著JavaScript: the first 20 yearsの翻訳ページです。
JSR Is Not Another Package Manager
npmパッケージ・レジストリがほとんど進化していない現状を指摘して、JSRが目指すところを表明した記事です。
Node.js — Node.js 22 is now available!
近々リリースされるNode.js 22の新機能や変更点を紹介する記事です。require()を使ったESModuleの読み込みが一部条件下で可能になるなどの変更が加えられています。
Bun v1.1.5 | Bun Blog
Bun v1.1.5の新機能や変更点を紹介する記事です。クロスコンパイルのサポートなどが追加されています。
React Spectrum - May 1, 2024 Release
React Ariaの5月のリリース内容をまとめた記事です。Submenu, DropZone, File Triggerなどが正式版になるなどの変更が加えられています。
Creating a pointer-friendly submenu experience
メニューをホバーしているときにサブメニューが表示されるUIにおいて、ポインターの操作性を向上させるためのアプローチを紹介した記事です。ホバー範囲の工夫のみならず、ポインターの速度なども勘案されています。
@headlessui/react@v2.0.0
HeadlessUI@react v2.0の新機能や変更点を紹介する記事です。CheckboxやFormに関連するコンポーネントが追加されるなどの変更が加えられています。
Intent to Ship: View Transitions Same-Origin Navigation
Chromeにて、View TransitionがMPAでも利用できるようになりました。利用するにはviewTransition API for navigationsのフラグを有効化する必要があります。
Intent to Prototype: Find-in-page highlight pseudos
ページ内検索されてヒットした要素のスタイルを::search-textで変更できるようにする仕様です。
Intent to Prototype: Multi-argument alt text in CSS Generated Content
CSSのcontent属性で画像を指定したときに設定できるaltテキスト（例：content: url("cat.jpg") / "A cute cat";の"A cute cat"）に関数値を含む複数の引数値を指定できるようにする仕様です。
Intent to Prototype and Ship: Align navigator.cookieEnabled with spec
navigator.cookieEnabledの挙動を元の仕様に合わせる変更が行われます。今までは、3rd Party Cookie非推奨化に伴いパーティション化されていないクッキーへのアクセス可否を示していましたが、単にそのサイトでCookieが使用できるかどうかを返すようになります。
Chromium Blog: How Machine Learning improved the Chrome address bar on Windows, Mac and ChromeOS
Chrome 124からアドレスバー（omnibox）に入力を与えた時のサジェストに機械学習モデルが使用されることを紹介した記事です。
Ship: navigator.clipboard.read() and navigator.clipboard.write()
クリップボード操作を行うnavigator.clipboard.read/write()がFirefox127からデフォルトで利用できることに触れています。
Ship: New Set Methods
新しいSetメソッドがFirefox127からデフォルトで利用できることに触れています。
Prototype: CSS Anchor Positioning
CSS Anchor Positioningに関して、SafariのWebKitは公式見解がないものの、仕様の共同編集はしていることに触れています。
Google Chrome's new post-quantum cryptography may break TLS connections
Chrome 124から耐量子暗号(Post-quantum cryptography)を使用したTLS通信が有効になったことを伝える記事です。
Hey everyone, thank you for sharing some of the challenges with accessing pathname.
Next.jsで、Server ComponentsやLayoutがURL/Pathnameにアクセスできない理由を記したIssueコメントです。共通レイアウトのレンダリングの都合によるものと説明されています。
In a future React release, it's likely we'll patch the Date API during SSR and hydration to prevent mismatches.
今後のReactのリリースにて、ReactのSSRとハイドレーションの間で生じるDate値のミスマッチを防ぐために、Date APIへパッチを適用することを検討している旨を知らせるツイートです。
Discussion