フロントエンドニュース2026年9月号

Frontendチーム

はじめに

こんにちは！Frontendチームの薄羽です。8月が思ったより暑くない気がしています☀️

useReactCompiler | Biome

  • v2.5.8 から useReactCompiler が使えるようになり、React Compilerのルールに則っているかをBiomeでチェックできるようになった！！

React Compiler Support | The JavaScript Oxidation Compiler

  • OxcがReact Compilerをサポートした
  • React CompilerをOxc AST上で直接動作させ、Babel版と比べて10倍以上高速な変換を実現している

Bun 1.4

  • ZigからRustへ置き換えられた
  • sharp、concurrently、npm-run-all などNode.jsで使われているパッケージを依存なしで使えるようになった
  • React Compilerもサポートされており、Babelプラグインと比較して約20倍高速となっている

browser – React

  • ReactのCanaryに browser が追加された
  • 実行環境がブラウザではない場合、throwされ、<Suspense> に到達する
  • これによりコンポーネントをブラウザのみでレンダリングできる（SSRさせない）ようになった

Octane — React's programming model, compiled

  • ReactのhooksやSuspenseなどのプログラミングモデルを、コンパイラファーストで実現するフレームワーク
  • hooksの呼び出しルールや依存配列が不要で、既存のReactアプリにもコンポーネント単位で導入できる

We Stopped Using RSC on TanStack.com | TanStack Blog

  • TanStack.comがReact Server Componentsをやめ、通常のSSRとServer Functionsへ移行した
  • Markdownレンダラーを軽量化したことでRSCの複雑さに見合う利点が小さくなり、移行後はページ遷移時にコンテンツデータだけを送れるようになった

TanStack/charts

  • レスポンシブ対応、アクセシビリティ、SSRを備えたチャートライブラリ
  • 現在pre-alpha

Canvas UI: Creative Canvas and WebGL Component Library

  • HTML in CanvasとWebGLを使ったUIコンポーネントライブラリ
  • React、Vue、Svelteなどに対応している

Next.js 16.3

  • next dev のメモリ効率が良くなり、next build が速くなった！
  • next build でTypeScript 7が使えるようになった！

johnsoncodehk/typescript-native-bridge

  • TypeScriptの従来のAPIを保ったまま、型チェックをGo製のtsgoで実行するdrop-in replacement
  • typescript のoverrideだけで、typescript-eslintやエディタなど既存ツールの設定を変えずに高速化できる

vercel-labs/scriptc: TypeScript-to-Native Compiler

Type-Aware Linting Stable | The JavaScript Oxidation Compiler

  • Oxlintの型情報を使ったLintがstableになった 🎉
  • TypeScript 7.0.2に対応し、typescript-eslintにある型情報を使う61ルールのうち59ルールを利用できる

Release management | pnpm

  • pnpm v11.13.0から、別のリリースツールを使わずにworkspaceのバージョン管理とリリースができるようになった
  • pnpm change で変更内容を記録し、pnpm version -r でバージョン更新・依存パッケージへの反映・changelog生成をまとめて行える

Playwright PR Agents | Libretto

  • Playwrightの実行失敗時に、Agentが実際のページを調査して修正PRを自動で作成するツール
  • 既存のPlaywrightスクリプトや実行環境を維持したまま、失敗時の処理に debugFailure() を追加して利用できる

🧱 Component testing in Playwright has a new shape: stories & galleries.

  • Playwrightのコンポーネントテストで、コンポーネントの状態をstoriesとして定義できるようになった
  • 定義したstoriesはgalleryで一覧・確認でき、同じ内容をテストにも利用できる

tc39/proposal-Declarations-in-Conditionals

  • ifの条件式内で変数を宣言できるようにする提案
  • TC39は、JavaScriptの仕様を議論している委員会

tc39/proposal-await-dictionary

  • Promise.all のkey版の Promise.allKeyed の提案
  • 配列の分割代入（Promise.all）で順序を誤ってしまうと誤った変数に代入されてしまう恐れがあるよねというモチベーション

nuqs@2.9.6

  • Pages routerやTanStack Routerで「もどる」ときにpending中のURL更新がリセットされるようになった

productdevbook/hucre

  • XLSXやCSVなどを読み書きできるパッケージ
  • 依存パッケージなしで、Node.jsやブラウザなどで動作する

Introduction to takumi-pdf

  • JSXをPDFにレンダリングできるパッケージ
  • ヘッドレスブラウザなしで、Node.jsやブラウザなどで動作する

terminal-code

  • ターミナル内でVS Codeを操作できるOSSツール

講評

  • React CompilerやTypeScript 7への対応まわりが一気に進んだ月
  • Reactの browser は自前で似たようなことをしていたため、APIが生えて嬉しい

採用情報

Frontendチーム、絶賛採用中です！カジュアル面談もお待ちしています！