This Week in React #282 キャッチアップ

発行日: 2026-05-20 ソース: Security, Fate, TanStack, Redux, Jotai, Base UI, Relay, Storybook

今週の注目ポイント

• npm サプライチェーン攻撃が TanStack Router や @antv パッケージに波及し、セキュリティ関連の話題が多数
• React Server Components の脆弱性（React2Shell）と Flight Protocol の DoS 問題が報告された
• TanStack Router に deferred hydration、TanStack AI に streaming structured output が追加
• Relay 21.0 でファーストパーティ TypeScript サポートと実験的 RSC サポートが登場
• TC39 で Explicit Resource Management（using 文）が Stage 4 に到達

React

Mini Shai-Hulud worm keeps digging

• URL: https://www.wiz.io/blog/mini-shai-hulud-teampcp-hits-antv-supply-chain
• 要約: npm サプライチェーン攻撃が継続中。TanStack Router、echarts-for-react、@antv パッケージ、GitHub Actions が影響を受け、OpenAI 従業員のアカウント侵害や Grafana のランサムウェア事件も発生している。

React Server Components in TanStack

• URL: https://frontendmasters.com/blog/react-server-components-in-tanstack/
• 要約: TanStack の柔軟な RSC モデルについての実践的な入門記事。CompositeComponent アーキテクチャとクライアントバンドルサイズの最適化について解説している。

Structural sharing, selectAtom, and why your jotai atoms re-render too much

• URL: https://www.peterp.me/articles/jotai-structural-sharing-vs-selectatom/
• 要約: Jotai での不要な再レンダリングを防ぐテクニックを解説。atom の派生、プリミティブへの分解、structural sharing 戦略について紹介している。

The React2Shell Story

• URL: https://lachlan.nz/blog/the-react2shell-story
• 要約: セキュリティ研究者による RSC のリモートコード実行脆弱性の発見と報告の経緯を詳述した二部構成の記事。

The Flight Protocol Made Your DoS My Problem

• URL: https://saschb2b.com/blog/flight-protocol-dos
• 要約: React/Next.js の最近パッチされた CVE の分析。単一の HTTP リクエストで Node プロセスをブロックできる脆弱性が含まれていた。

Fate 1.0 - The first full Async React Metaframework

• URL: https://fate.technology/posts/fate-1.0
• 要約: Relay にインスパイアされた新フレームワーク。ビューコンポジション、正規化キャッシュ、データマスキング、Async React、Server-Sent Events、Drizzle 統合をサポートする。

TanStack Router releases - Deferred hydration capabilities, route matching priority

• URL: https://github.com/TanStack/router/releases/tag/release-2026-05-20-1004
• 要約: 実験的な deferred hydration によるインタラクティビティの高速化、CSS インライン化、セキュリティ向けの CSRF ミドルウェアが追加された。

TanStack AI releases - useChat() supports streaming structured output

• URL: https://tanstack.com/blog/streaming-structured-output
• 要約: useChat フックが強化され、AI チャット実装で構造化データのストリーミング出力が可能になった。

React Redux 9.3 - connect API deprecated, Trusted Publishing fixed

• URL: https://github.com/reduxjs/react-redux/releases/tag/v9.3.0
• 要約: レガシー HOC の connect API が非推奨となり、useSelector/useDispatch の使用が推奨される。Trusted Publishing のセキュリティ修正も含まれる。

Redux Toolkit 2.12 - TypeScript Improvements, Skills

• URL: https://github.com/reduxjs/redux-toolkit/releases/tag/v2.12.0
• 要約: TypeScript サポートの強化と Skills 統合が行われた Redux 状態管理ツールキットのアップデート。

Base UI 1.5 - Major mount perf improvements for popovers/dialogs/tooltips/menus

• URL: https://base-ui.com/react/overview/releases/v1-5-0
• 要約: popover、dialog、tooltip、menu コンポーネントのマウントパフォーマンスが大幅に改善された。

React Hook Form 7.76 - Improved isDirty and useFieldArray

• URL: https://github.com/react-hook-form/react-hook-form/releases/tag/v7.76.0
• 要約: dirty 状態のトラッキングとフィールド配列の管理が改善され、フォーム処理がより良くなった。

Relay 21.0 - First-party TypeScript support, experimental RSC support, improved error handling

• URL: https://github.com/facebook/relay/releases/tag/v21.0.0
• 要約: ネイティブ TypeScript サポート、実験的な React Server Components 統合、改善されたエラーフィードバック機構が追加された。

Storybook 10.4 - TanStack React, React Native isolation, agentic setup, review filters

• URL: https://storybook.js.org/blog/storybook-10-4/
• 要約: TanStack 統合、React Native テストの分離改善、AI 駆動のセットアップ、強化されたレビューワークフローが含まれる。

React Doctor 0.2 - Your agent writes bad React. This catches it.

• URL: https://github.com/millionco/react-doctor
• 要約: AI 生成の React コードのアンチパターンを検出してフラグを立てるツール。

React Router 7.15.1 - New unstable_useRouterState consolidation API

• URL: https://github.com/remix-run/react-router/blob/main/CHANGELOG.md#v7151
• 要約: ルーティング情報と状態への統合的なアクセスを提供する新しいルーター状態フックが追加された。

Nuno Maduro - Why React Developers Are Leaving Next.js for TanStack, with Tanner Linsley (Video)

• URL: https://www.youtube.com/watch?v=6moPS3AAbe4
• 要約: 開発者が Next.js から TanStack エコシステムに移行している理由とその背景についてのディスカッション。

Fireship - A single PR just hijacked the NPM registry… (Video)

• URL: https://www.youtube.com/watch?v=gwTQLZSIlsU
• 要約: 悪意のあるプルリクエストを通じた npm レジストリの侵害攻撃についての解説。

Syntax.fm 1005 - Programatic and Skill based Video Creation with Remotion (Podcast)

• URL: https://syntax.fm/show/1005/programatic-and-skill-based-video-creation-with-remotion
• 要約: Remotion フレームワークを使ったプログラマティックなビデオ生成とスキルベースのアプローチについてのポッドキャスト。

その他（JS / CSS / Web全般）

Explicit Resource Management reached TC39 stage 4

• URL: https://github.com/tc39/proposal-explicit-resource-management
• 要約: リソースクリーンアップのための using 文が標準化に到達。簡素化されたリソース管理パターンが可能になった。

npm RFC - Make install scripts opt-in

• URL: https://github.com/npm/rfcs/pull/868
• 要約: package.json に allowScripts 設定を導入し、サプライチェーン攻撃の脆弱性を緩和する提案。

Bun PR - Rewrite Bun in Rust

• URL: https://github.com/oven-sh/bun/pull/30412
• 要約: Bun ランタイムを Zig から Rust へ移行する大規模なアーキテクチャ変更。1週間で完了した。

Declarative partial updates

• URL: https://developer.chrome.com/blog/declarative-partial-updates
• 要約: 順不同ストリーミングとストリームコンテンツをサポートする HTML 挿入メソッドのための新しい Web プラットフォーム API。

QUIC and HTTP/3 Come To Node.js (finally)

• URL: https://www.jasnell.me/posts/quic-comes-to-node
• 要約: 実験的な node:quic API による QUIC プロトコルと HTTP/3 サポートについての5部構成の詳細解説。

pnpm 11.12 - Experimental Rust install engine

• URL: https://github.com/pnpm/pnpm/releases/tag/v11.2.0
• 要約: パフォーマンス向上のためのオプトイン Rust ベースインストールエンジンを導入。

Yarn 4.15 - Add npmMinimalAgeGate: 1d release cooldown by default

• URL: https://github.com/yarnpkg/berry/releases/tag/%40yarnpkg%2Fcli%2F4.15.0
• 要約: 攻撃ベクトルを緩和するため、即時パッケージインストールを防ぐデフォルトのセキュリティクールダウンを追加。

Node 26.2 - stream.compose stable, fs.stat() returns Temporal.Instant

• URL: https://nodejs.org/en/blog/release/v26.2.0
• 要約: ストリームコンポジションの安定化と、ファイル stat 操作への Temporal API 統合が行われた。

Webpack 5.107 - Experimental HTML modules, experimental native TS support

• URL: https://webpack.js.org/blog/2026-05-19-webpack-5-107/
• 要約: 実験的な HTML モジュールサポートとネイティブ TypeScript 処理機能が追加された。