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

発行日: 2026-05-13 ソース: Next.js, TanStack, Security, Redact, React Router, Waku, HTML React Parser

今週の注目ポイント

• Next.jsのセキュリティリリースで13件の脆弱性に対応、v15.5.18またはv16.2.6へのアップデートが推奨
• TanStackのnpmサプライチェーン攻撃により42パッケージに悪意あるバージョンが公開された
• Tanner LinsleyがReactの最適化された「projection」の概念を@tanstack/redactで実現
• Waku 1.0 BetaがVite 8/Rolldown/Node 26対応でリリース
• Rolldown 1.0が安定版に到達しVite 8のデフォルトバンドラーに

React

Next.js May 2026 Security Release

• URL: https://vercel.com/changelog/next-js-may-2026-security-release
• 要約: DoS、ミドルウェア/プロキシバイパス、SSRF、キャッシュポイズニング、XSSを含む13件の脆弱性に対応した協調セキュリティリリース。v15.5.18またはv16.2.6へのアップデートが推奨される。React RSCパッケージ(v19.2.6)にもServer Functions DoS修正が含まれる。

TanStack npm Supply-Chain Compromise

• URL: https://tanstack.com/blog/npm-supply-chain-compromise-postmortem
• 要約: 攻撃者が5月11日に42の@tanstack/* npmパッケージに悪意あるバージョンを公開。Mini Shai-Huludワームが他のメンテナーに感染し、Mistral AI、OpenSearch、UiPath等のパッケージにも拡散。GitHub Actionのpull_request_targetトリガーを悪用し、共有pnpmキャッシュに毒入りコンテンツを注入する攻撃手法。

Hardening TanStack After the npm Compromise

• URL: https://tanstack.com/blog/incident-followup
• 要約: サプライチェーンリスクを低減するためのメンテナー向けガイドライン。危険なpull_request_targetトリガーの回避や、機密ワークフローからの共有キャッシュ除去などの対策を提示。

npm Package Manager Security Best Practices

• URL: https://github.com/lirantal/npm-security-best-practices
• 要約: npmパッケージ利用者向けの実践的なセキュリティ推奨事項を提供する標準的なリソース。各パッケージマネージャー横断での対策をカバー。

Projecting React

• URL: https://tannerlinsley.com/posts/projecting-react
• 要約: Tanner LinsleyがTanStack Start向けに最適化されたReactの「projection」を@tanstack/redactで実現し、大幅なサイズ削減を達成。ReactのAPIをデータベーステーブルに、実装をマテリアライズドビューに例えて解説。

RSC Server Functions Are Not An API Boundary

• URL: https://longho.dev/posts/rsc-server-functions-are-not-an-api-boundary/
• 要約: Server Functionsは安定的なAPI代替にはならない。リファクタリング時にServer Function IDが変更され、再デプロイ時にバージョンスキュー問題が発生する。クラウドプロバイダーがスキュー保護機能を提供している。

Untangling Dialogs in React Router

• URL: https://programmingarehard.com/2026/05/06/react-router-dialogs.html/
• 要約: 親の<Outlet>と専用ダイアログルートを使ったコード簡素化のガイダンス。データ再検証、フラッシュセッショントースト、退出アニメーションをカバー。

Animating Container Bounds

• URL: https://www.userinterface.wiki/animating-container-bounds
• 要約: Motionを使って内部コンテンツの変更に基づいて要素のwidth/heightをスムーズにアニメーションさせる手法のデモ。

Security in React Applications

• URL: https://certificates.dev/blog/security-in-react-applications
• 要約: ReactアプリケーションにおけるXSS攻撃防止、安全なトークン保存、入力バリデーション、CSRF保護、Content Security Policyについて解説。

From React to Native Web with Nanotags: A 100 KB Savings

• URL: https://evilmartians.com/chronicles/from-react-to-native-web-with-nanotags-a-migration-that-saved-100kb
• 要約: 主に静的なAstroテンプレートサイトでは、Custom Elementsハイドレーションの方がReactハイドレーションより効率的になりうることを示した事例。100KBの削減を実現。

Exploring the HTML-in-Canvas Proposal

• URL: https://tympanus.net/codrops/2026/05/13/exploring-the-html-in-canvas-proposal/
• 要約: HTML-in-Canvasが3Dワールド内の2D UI統合をどのように簡素化できるかを議論。特にReact Three Fiber開発者にとって有用。

SVAR React Gantt

• URL: https://github.com/svar-widgets/react-gantt
• 要約: インタラクティブなプロジェクトタイムラインを構築するためのオープンソースReact Ganttライブラリ。

Waku 1.0 Beta

• URL: https://waku.gg/blog/waku-v1-beta
• 要約: ミニマルなRSCフレームワークの初ベータ版。Vite 8、Rolldown、Node 26、Reactパフォーマンストラック、柔軟なルーティング、CSPをサポートし、プロダクション対応へ移行。

Jotai 2.20

• URL: https://newsletter.daishikato.com/p/jotai-v2-20-0-and-the-store-building-blocks
• 要約: 高スループットシナリオのパフォーマンス改善とストアビルディングブロックのリファクタリング。

HTML React Parser 6.1

• URL: https://github.com/remarkablemark/html-react-parser/releases/tag/v6.1.0
• 要約: trustedTypePolicyによるCSPサポートを追加。

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

TC39 - 114th Meeting Agenda (May 19-21)

• URL: https://github.com/tc39/agendas/blob/main/2026/05.md
• 要約: Iterators、Explicit Resource Managementなどの提案が進展する可能性のある充実したアジェンダ。

Rolldown 1.0

• URL: https://voidzero.dev/posts/announcing-rolldown-1-0
• 要約: 高性能なRustベースのバンドラーがセマンティックバージョニングの安定版に到達。Vite 8のデフォルトバンドラーとして10〜30倍高速なRollup代替を実現。devモードでのバンドリングも計画中。

Node.js 26.1

• URL: https://nodejs.org/en/blog/release/v26.1.0
• 要約: Foreign Function Interface用の実験的node:ffiモジュールを導入。動的ライブラリの読み込みとネイティブ言語統合を可能に。

Jest 30.4

• URL: https://github.com/jestjs/jest/issues/9430#issuecomment-4400281169
• 要約: require(esm)互換性を備えたESMサポートの完全な書き直し。--experimental-vm-modulesフラグが必要で、Node.jsチームが安定化に取り組み中。

Bun 1.3.14

• URL: https://bun.com/blog/bun-v1.3.14
• 要約: 組み込み画像処理、グローバルインストール仮想ストア、HTTP改善。RustポートとZig-to-Rust移行の可能性についても言及。

npm 11.4

• URL: https://github.com/npm/cli/releases/tag/v11.14.0
• 要約: allow-directory、allow-file、allow-remoteなどの新しいオプトインセキュリティ機能を追加（pnpmのblockExoticSubdepsに類似）。

Playwright 1.60

• URL: https://github.com/microsoft/playwright/releases/tag/v1.60.0
• 要約: ドラッグアンドドロップシミュレーション用のDrop API、Ariaスナップショット、HAR録画機能を追加。

pnpm 11.1

• URL: https://pnpm.io/blog/releases/11.1
• 要約: 名前付きレジストリと新しいユーティリティコマンドを追加。

Tailwind CSS 4.3

• URL: https://tailwindcss.com/blog/tailwindcss-v4-3
• 要約: スクロールバーのスタイリング、新しいカラー、その他の機能を導入。

Astro 6.3

• URL: https://astro.build/blog/astro-630/
• 要約: 実験的な高度なルーティングとファーストクラスのHonoサポートを追加。