typescript-eslint v7リリースなど : Cybozu Frontend Weekly (2024-02-13号)

こんにちは! サイボウズ株式会社フロントエンドエンジニアの Saji (@sajikix) です。

はじめに

サイボウズでは毎週火曜日に Frontend Weekly という「一週間にあったフロントエンドニュースを共有する会」を社内で開催しています。

今回は、2024/02/13 の Frontend Weekly で取り上げた記事や話題を紹介します。

取り上げた記事・話題

Announcing TypeScript 5.4 Beta - TypeScript

https://devblogs.microsoft.com/typescript/announcing-typescript-5-4-beta/

TypeScript の 5.4 beta がリリースされました。クロージャにおいて最後の代入から型の絞り込みを行う推論の改善やジェネリクスを型推論の候補から外す NoInfer ユーティリティ型などが導入されます。

Apple が iOS 17.4 のベータ版で PWA のサポートを削除していることが明らかに

https://gigazine.net/news/20240209-apple-pwa-support-remove/

EU リージョンの iOS17.4 Beta で WebKit の PWA が削除されているようです。今年に入り EU のデジタル市場法の要請で Apple はブラウザエンジン規制の緩和することを発表しており、この変更に影響しているのではという指摘もあります。

Core Web Vitals を改善する Next.js の機能群 - Speaker Deck

https://speakerdeck.com/sutetotanuki/core-web-vitals-wogai-shan-suru-next-dot-js-noji-neng-qun

Core Web Vitals の各指標の改善に対して Next.js の各機能がどう影響を与えるのか整理したスライドです。Next.js 14 で導入された機能なども含めて Next.js を使ったサービスのチューニングに役立ちそうです。

Introducing NextUI Pro! 🎉

https://twitter.com/getnextui/status/1754499622108557485

https://www.nextui.pro/?utm_source=nextui.org&utm_medium=top-banner

React 向けの UI ライブラリである NextUI が pro 版を公開しました。有料ですがコピーで使える 150 以上のコンポーネントが提供されます。

Announcing typescript-eslint v7 | typescript-eslint

https://typescript-eslint.io/blog/announcing-typescript-eslint-v7

typescript-eslint の v7 がアナウンスされました。あわせて　typescript-eslint というパッケージがリリースされ、flat-config が有効化された環境ではこのパッケージ経由で利用するようになります。

atlassian/pragmatic-drag-and-drop

https://github.com/atlassian/pragmatic-drag-and-drop

今はメンテナンスモードになっている react-beautiful-dnd を開発していた Atlassian が新しい drag-and-drop ライブラリを公開する予定です。すでに Atlassian の各製品で利用されているものを社外に公開する形のようです。

TypeScript の変性（共変・反変）を 5 分で理解する

https://zenn.dev/jay_es/articles/2024-02-13-typescript-variance

型推論の文脈で話題に出ることのある型の変性について TypeScript のコードを元に解説した記事です。日々のコーディングで意識することはそこまで多くないかもしれませんがより深い理解をする上で良い記事と言えそうです。

Storybook 8 Beta

https://storybook.js.org/blog/storybook-8-beta/

Storybook 8 beta がリリースされました。デフォルトコンパイラを SWC に変更するなどパフォーマンス改善に力を入れつつモバイルでの UI の変更なども行っています。また React への依存排除や各エコシステムのサポートバージョン引き上げなども行います。

JavaScript Registry

https://jsr.io/waitlist

Deno が JSR という JavaScript/TypeScript registry を開発しており、早期アクセスが募集されています。現状詳しい情報は出ていませんが、実際に早期アクセスした人のブログによれば npm と比較して TypeScript サポートの強化などが大きな改善となりそうです。

Intent to Prototype: :open and :closed pseudo-classes

https://groups.google.com/a/chromium.org/g/blink-dev/c/jESpcXVA8ns/m/46K9anVZAAAJ

Blink に :open と :close 擬似クラスのプロトタイプが実装されます。 details 要素や, select 要素, dialog 要素などの開閉状態から要素の指定を行えるユースケースが想定されます。一方でこの仕様は現在 EditorsDraft の段階なため、各ブラウザでサポートされるのはまだ先になりそうです。

Introducing Qwik PWA 🎉

https://twitter.com/asleMammadam/status/1757096441560928554

Qwik が PWA を簡単に作成するためのツール群を公開しました。Vite プラグインやユーティリティをまとめて @qwikdev/pwa というパッケージで提供します。

フルスタック Web フレームワーク HonoX を使ってみる

https://azukiazusa.dev/blog/full-stack-web-framework-honox/

hono と vite をベースにする軽量な web フレームワークである HonoX の紹介記事です。簡単なブログアプリをチュートリアルにして実際のコードを交えながら使い方を解説しています。

Node.js Community Debate Intensifies Over Enabling Corepack by Default and Potentially Unbundling npm

https://socket.dev/blog/node-community-debates-enabling-corepack-unbundling-npm

Node.js の corepack をデフォルト有効化した場合に、npm を Node.js にバンドルするかどうかが議論になっています。npm がバンドルされていることが前提にエコシステムが発展してきている面もあり場合によっては影響の大きな変更になりうるので今後の動きに注目したいところです。