0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Day 3

2025年の振り返り Advent Calendar 2025

@chi1180

2025年にQiitaで流行した技術スタック30選アドベントカレンダー React

Posted at

はじめに

この記事は「2025年にQiitaで流行した技術スタック30選アドベントカレンダー」の一部として、Reactの2025年における進化と重要なトピックをまとめたものです。

2025年はReactにとって歴史的な転換点となる年でした。新しいガバナンス体制の確立、自動最適化コンパイラの安定版リリース、そして数々の革新的な機能の追加により、Reactエコシステムは新たなステージに突入しました。

2025年のReact主要トピック

1. React Foundation の設立

2025年10月7日、React Conf 2025において、MetaからReactとReact NativeをLinux Foundationの傘下となる新しいReact Foundationに移管することが発表されました。

設立の背景:

  • Reactは単一企業のツールから複数企業による貢献を受けるプロジェクトへと成長
  • ベンダーニュートラルな環境の構築
  • コミュニティ主導の開発体制の確立

創設メンバー:

  • Amazon
  • Callstack
  • Expo
  • Meta
  • Microsoft
  • Software Mansion
  • Vercel

Metaのコミットメント:
Metaは5年間のパートナーシップで300万ドル以上の資金提供と専任エンジニアによるサポートを約束しました。

技術ガバナンスの分離:
React Foundationはビジネスガバナンスを担当し、技術的な方向性については独立した新しいガバナンス構造が導入される予定です。

2. React Compiler 1.0 の正式リリース

2025年10月7日、React Compiler 1.0がリリースされ、Reactアプリケーションの最適化が大きく変わりました。

React Compilerとは:
ビルド時に自動的にメモ化を適用し、アプリケーションを最適化するツールです。開発者が手動でuseMemo、useCallback、React.memoを使用する必要性を大幅に削減します。

主な特徴:

  • 自動メモ化: コンポーネントとフックを自動的に最適化
  • 条件付きメモ化: 手動では不可能だった条件分岐内のメモ化も実現
  • ゼロコード変更: 既存コードの書き換え不要
  • React NativeとReact両対応

パフォーマンス改善事例:
Meta Quest Storeでは初期ページロードが最大12%高速化し、特定のユーザーインタラクションが2.5倍以上高速化されました。

エコシステムサポート:

  • Expo SDK 54: デフォルトで有効
  • Next.js 15.3.1以降: 安定版サポート
  • Vite: 専用スターターテンプレート提供
  • eslint-plugin-react-hooks: コンパイラ対応のlintルールを標準搭載

導入方法:

# npm
npm install --save-dev --save-exact babel-plugin-react-compiler@latest

# pnpm
pnpm add --save-dev --save-exact babel-plugin-react-compiler@latest

Next.jsでの設定例:

import type { NextConfig } from 'next'

const nextConfig: NextConfig = {
  reactCompiler: true,
}

export default nextConfig

3. React 19系のリリースと進化

2025年はReact 19系が複数回アップデートされ、多くの新機能が追加されました。

2024年12月〜2025年のリリース履歴:

  • React 19.0.0: 2024年12月5日リリース
  • React 19.1.0: 2025年3月28日リリース
  • React 19.1.1: 2025年7月28日リリース
  • React 19.2.0: 2025年10月1日リリース
  • React 19.2.1: 2025年12月リリース

React 19.2の主要新機能

1. <Activity> コンポーネント

アプリケーションを制御・優先順位付けできる「アクティビティ」に分割できる新しいコンポーネントです。

// 従来の方法
{isVisible && <Page />}

// React 19.2の方法
<Activity mode={isVisible ? 'visible' : 'hidden'}>
  <Page />
</Activity>

2025年10月時点ではvisibleとhiddenの2つのモードをサポートしています。

2. useEffectEvent フック

ライフサイクル管理の新手法を提供する新しいフックで、より柔軟なエフェクト管理が可能になりました。

3. cacheSignal

React Server Components向けの新しいキャッシング機能です。

4. Performance Tracks

Chrome DevToolsで詳細なパフォーマンス分析が可能になりました。

5. Partial Pre-rendering（部分的プリレンダリング）

アプリケーションの一部を事前レンダリングし、後で再開できる機能です。SSRとSSGのハイブリッド戦略を実現します。

6. SSR機能の強化

  • Suspenseバウンダリのバッチ処理、Node向けWeb Streamsサポート

7. eslint-plugin-react-hooks v6
React Compiler対応のlintルールがrecommendedプリセットにデフォルトで含まれるようになりました。

4. React 19の基盤機能（2024年12月リリース）

React 19.0では以下の重要な機能が導入されました:

Actions（アクション）:
非同期トランジションを使用する関数で、保留状態、楽観的更新、エラー処理などを自動的に管理します。

React Server Components:
公式サポートが開始され、サーバーサイドでのコンポーネントレンダリングが本格的に可能になりました。

5. React Nativeの進化

React Native 0.82以降の重要な変更:
React Native 0.82は完全に新アーキテクチャ上で構築された初のリリースとなり、レガシーアーキテクチャへのフォールバックがなくなりました。

React Native 0.78の新機能（2025年2月）:

  • React 19のReact Native対応
  • React Compilerの導入が簡素化（パッケージ数削減）
  • Android Vector drawablesのネイティブサポート
  • iOSのbrownfield統合改善

新しいパフォーマンスAPI:
ネットワークパネルとデスクトップアプリを含む新しいPerformance APIがReact Native 0.83で提供予定

Hermes V1:
React Nativeに最適化されたJavaScriptエンジンHermesのV1が試験的に導入されました。

VegaOS:
AmazonがFireTVデバイス向けに、React Nativeを組み込んだ新しいLinuxベースのOSを発表しました。

6. メタフレームワークの進化

Next.js 16（2025年11月）:
Turbopackがデフォルトバンドラーとなり、5〜10倍高速なFast Refreshとビルド時間を実現

主な機能:

  • React Compiler安定版サポート
  • Cache Componentsによる部分プリレンダリング（PPR）の精密な制御
  • ルーティングの最適化
  • ログとビルド診断の改善

その他のフレームワーク:

  • Remix
  • Astro: コンテンツ中心のウェブサイト向けに人気を伸ばし、軽量で高速なパフォーマンスが特徴

7. ビルドツールの進化

Vite 7:
Rolldownが導入可能になり、ブラウザターゲット判定がBaseline Widely Availableバージョンへ変更、Sass legacy APIが廃止されました。

ViteConf 2025では統合開発ツールチェーンとしてのVite+（plus）が発表されました。

Turbopack:
JSONCフォーマットのサポート、Vercelのmicrofrontendsとの統合が実現されました。

8. 開発ツール周辺の改善

Storybook v10:
ESMのみの構成となり、React依存がなくなり、依存関係が大幅に削減されました。

リンター・フォーマッター:

  • Biome v2でGritQLを使用したリンタープラグイン作成が可能に
  • Biome v2.3でVue.js、Svelte、Astroがフルサポート
  • Oxlint v1がメジャーアップデート

9. 状態管理の変化

React 19以降のContext APIの改良により、以前はReduxやZustandなどの外部ライブラリに頼っていた機能が、Reactの組み込み機能で実現可能になりました。

これにより、多くのプロジェクトで外部の状態管理ライブラリへの依存度が低下する傾向が見られます。

10. パフォーマンス最適化の新アプローチ

React 19対応フレームワークでは、部分的なハイドレーション（Partial Hydration）が標準機能として導入され、ページの重要な部分のみを優先的にインタラクティブにすることが可能になりました。

これにより:

  • 初期読み込み時間の改善
  • TTI（Time to Interactive）の大幅な改善

2025年のReact開発者に求められるスキル

2025年のReact開発者に求められる主なスキルセットは以下の通りです:

  1. サーバーとクライアントの両方の知識

    • Server ComponentsとClient Componentsの使い分け
    • ハイブリッドレンダリングの実装能力

  2. パフォーマンス最適化の専門知識

    • React Compilerの理解と活用
    • 新しい最適化APIの効果的な使用

  3. アクセシビリティの深い理解

    • WCAG基準準拠のアプリケーション開発
    • 自動テストの実装

  4. AIツールとの協業

    • AIコード生成ツールの効果的な活用
    • 生成コードの評価・改善能力

  5. メタフレームワークの経験

    • Next.js、Remix、Astroなどでの開発経験

まとめ

2025年のReactは以下の点で大きな転換期を迎えました:

  1. ガバナンスの進化: React Foundationの設立により、コミュニティ主導の開発体制が確立
  2. 自動最適化の実現: React Compiler 1.0により、手動最適化の負担が大幅に削減
  3. 機能の充実: React 19系のリリースにより、Server Components、Actions、Partial Pre-renderingなど多くの革新的機能が追加
  4. エコシステムの成熟: メタフレームワーク、ビルドツール、開発ツールの進化により、開発体験が向上
  5. React Nativeの刷新: 新アーキテクチャへの完全移行とパフォーマンス向上

今後もReactエコシステムは進化を続け、より高速で、より開発しやすく、よりパワフルなフレームワークとして成長していくことが期待されます。

参考リンク

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
Sign upLogin
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?