フロントエンド技術周辺の​アップデートから​振り返る​2025年

この記事はSchoo Advent Calendar 2025の1日目の記事になります。

こんにちは。技術戦略部門に所属するエンジニアの @okuto_oyama です。

Schooアドベントカレンダー最初の記事では、昨年も実施した、フロントエンド開発にまつわる周辺技術が今年どれだけアップデートされたかを見つつ、2025年を振り返ってみる内容をお送りいたします。

昨年に引き続き、以下のジャンルで括ろうと思っております。

• フロントエンドフレームワーク
• メタフレームワーク ¹
• ランタイム
• CSS
• UIフレームワーク
• パッケージマネージャ
• モバイル＆デスクトップアプリ
• ビルド・バンドルツール
• モノレポツール
• バックエンドフレームワーク
• テストツール
• リンター・フォーマッターツール
• 型ツール

ここに加え今年は「AIエージェントフレームワーク」についても触れていきます。

できる限り主要なものは収集していますが、あのライブラリ・フレームワークが入ってないじゃん！となった場合はすみません。

バージョン比較のレギュレーションは以下の通りです。

レギュレーション

• CHANGELOGやリリースノートを参考にしたバージョン表記
• α、β、RCやCanaryなどのプレリリースバージョンは含めない
• 今年一年でプレリリースを除くバージョンアップがなかったものは除く
• メジャーバージョンが上がったものは太字で表記する

それでは、いってみましょう。

フロントエンドフレームワーク

フロントエンドフレームワークでメジャーアップデートがあったものはReact、Angularになります。

Reactは昨年の12/5にv19へアップデートされました。今年リリースされたv19.2までの間で、アクションという非同期関数概念が追加、新たなHooks APIや<Activity>などの機能が追加されています。 Reactの最適化コンパイラでもあるReact Compilerのv1もリリースされました。

Angularはこれまで状態の変更検知に使用していたZone.jsを使用しないZonelessアーキテクチャを提供できるようになりました。v21からはSignalベースのフォーム機構、ヘッドレスでアクセシブルなコンポーネント「Angular Aria」が登場しました。

Vue.jsはVue Vapor Modeを搭載したv3.6が開発中です。

Svelteは非同期処理の制御ができるようになるAsynchronous Svelteが実験的機能として発表されました。

メタフレームワーク

メタフレームワークでメジャーアップデートがあったものはNext.js、Nuxt、Astro、Lume、Analogになります。

Next.jsはv19よりuse cacheディレクティブを用いたキャッシュコンポーネント機能やDevTools MCPを搭載し、Turbopackがデフォルトのバンドラーとして採用されるようになりました。

Nuxtはv4よりディレクトリ構成を一新、useAsyncDataとuseFetchの動作改善、Import maps機能の導入、Rolldownの実験的導入などがされるようになりました。

SvelteKitはv2.27よりRemote functionsというコンポーネントからサーバサイド上の関数を呼べる機能が追加されました。

Astroは昨年12/3にv5がリリースされました。アイランドアーキテクチャを実現するServer Islands、Content Collectionsより汎用的でビルドパフォーマンスの優れたContent Layer APIが導入されました。

VitePressは現在v2に向けての開発を進めています。

Lumeはv2から約1年半ぶりのメジャーアップデートがされました。JSXサポートはReact/Preactベースのプラグインを廃止し、SSXというライブラリに一本化されています。

Analogはv2になりAngularの新しいResources APIに対応したコンテンツ一覧やファイルを扱うContent Resources機能が追加されました。

Remixは方向性を一転し、これまでのReact Router構成のアプリケーションとは決別し、独自のフレームワーク像を構築していきます。

ランタイム

ランタイムでメジャーアップデートがあったものはNode.jsになります。

今年はNode.js v24はLTS（Long Term Support）になり、最新版としてv25が公開されました。v25からは、--allow-netオプションでネットワークアクセスへの制限ができるようになり、Node.jsがネイティブにTypeScriptを実行できる「Type Stripping」が安定版となりました。

Bunはv1.3からフルスタック開発機能を搭載しオールインワンの開発体験を提供しています。 また、今年からsosukesuzukiさんが入社され、内部で使用されているJavaScriptCoreの改善にコミットされています。

https://x.com/jarredsumner/status/1957406750329442771

CSS

CSSでメジャーアップデートがあったものはTailwind CSS、Panda CSSになります。

Tailwind CSSはv4より大きくアーキテクチャが変更され、JavaScript（TypeScript）で管理していたものがすべてCSSで管理されるように変更されました。 公式のUIライブラリであるTailwind UIが「Tailwind Plus」に刷新されました。

Panda CSSはv1よりcreateStyleContext関数が導入されました。これにより親子関係によってスタイルの変更をしやすくなりました。 v1.6.0からはcssgenに--splittingフラグがつき、単一のstyle.cssではなくレイヤー・レシピごとに分割させる機能がつきました。

styled-componentsはメンテナンスモードへの移行が発表されました。

UIフレームワーク

UIフレームワークでメジャーアップデートがあったものはMaterial UI、Ant Design、Nuxt UI、Angular Material、daisyUI、Yamada UIになります。

Material UIはv7よりESM対応が進み、CJSとESMをそれぞれサポートする（デュアルモード）ようになりました。

Ant Designはv6の発表と同時に、AIアプリケーション開発に特化したUIキットのAnt Design X 2.0のリリースも発表しました。

NuxtLabsがVercelにジョインした流れから、Nuxt UIはv4からNuxt UI Proも無償提供されるようになりました。

daisyUIはv5からわずかに残っていた依存関係をゼロにしてセキュリティリスクをなくしビルドサイズも削減することに成功しています。

昨年取り上げていたNextUIはHeroUIとしてリブランディングされ、テーマやコンポーネント単位で提供されるようになりました（１つのパッケージとして公開されていないため、今回は取り上げていません）。

日本人が作ったYamada UIはVercelのOpen Source Programにノミネートされました。

https://x.com/vercel/status/1993070637989216588?s=20

パッケージマネージャ

パッケージマネージャでメジャーアップデートがあったものはnpm、pnpmになります。

npmはv11.5からセキュアな公開フローをサポートするため、OIDCベースの認証が追加されました。

pnpmはv10よりpreinstallやpostinstallのような依存パッケージのライフサイクルスクリプトがデフォルトで実行されなくなりました。v10.16からはminimumReleaseAgeが実装され、指定された期間でのバージョンのインストールを遅延させる機能が追加されました。

モバイル＆デスクトップアプリ

モバイル＆デスクトップアプリでメジャーアップデートがあったものはExpo、Electron、Capacitor、NativeScriptになります。

React Nativeはv0.82からはレガシーアーキテクチャが完全に無効化され、v0.76.2からの新しいアーキテクチャが正式に採用されました。Metaが開発するReact Nativeに最適化されたJavaScriptエンジンのHermesのv1が試験的に導入されました。

Expo v53では実験的にlibSQLサポートがはじまりました。v54では クロスプラットフォーム（Apple TV、macOS）対応の拡張がされています。

Capacitor v7では低コードプラットフォームのOutsystemsがCapacitor基盤に採用され、Cocoapodsの公式非推奨に伴い、Swift Package Managerへの移行を推進されるようになりました。

NativeScript v9ではESMネイティブ対応とバンドラへの選択肢としてViteの公式サポートが追加されました。

ビルド・バンドルツール

ビルド・バンドルツールでメジャーアップデートがあったものはViteになります。

Vite v7からはRolldownが導入可能、ブラウザターゲット判定をBaseline Widely Availableのバージョンへ変更し、Sass legacy APIが廃止されるようになりました。 ViteConf 2025にて統合開発ツールチェーンとしてのVite+(plus)の発表がありました。

Parcelはv2.14よりReact Server Componentsのベータ対応、MDXのファーストクラス対応をしました。v2.15からはPostHTMLベースから、Rust製の html5ever（Servo由来）のパーサーへ変更されました。

webpackはv5.100よりHMRのESMネイティブ対応、import deferの実験的導入がされました。

モノレポツール

モノレポツールでメジャーアップデートがあったものはLerna、Nxになります。

Turbopackは設定ファイルにコメントを記述できるJSONCフォーマットをサポート、@vercel/microfrontendsによりVercelとのmicrofrontends機能とも統合され、ローカルと本番環境との橋渡しが容易になりました。

Nxはv21より複数タスクのログを確認できるTerminal UIが導入されました。v22からはCIで失敗した内容を自動解析し、修正案を提示するSelf-Healing CI、configure-ai-agentsでCopilotやCursorなどのAIアシスタント設定を最適化するコマンドが追加されました。

バックエンドフレームワーク

バックエンドフレームワークでメジャーアップデートがあったものはKoa、NestJSになります。

KoaではWHATWG準拠のレスポンスボディ（ReadableStream、Blob、Response）がサポートされるようになりました。

NestJSはマイクロサービス化への柔軟性がより高まりました。NATS、Kafka、Redisなど公式サポートのトランスポーターが追加され、unwrapメソッドで基盤となるクライアントインスタンスへ直接アクセスできるようになりました。

import { NatsConnection } from 'nats';

const serviceRef = app.connectMicroservice({
  transport: Transport.NATS,
  options: {
    // NATS connection options here
  },
});
const connection = serviceRef.unwrap<NatsConnection>();

テストツール

テストツールでメジャーアップデートがあったものはJest、Vitest、Mocha、Cypress、Puppeteer、Storybookになります。

Jestは過去最大規模の更新・変更が入りました。ESMとTypeScriptサポート強化やNode.jsのv21以下のサポート終了、using構文を活用する他新機能が追加されました。モジュール解決にはRust製のツール「unrs-resolver」を導入しパフォーマンスが向上しています。今後より頻繁なメジャーリリースをしていくことを目指すそうです。

Vitestはv4より実験的機能だったBrowser Modeが安定版になり、そこにVisual Regression Testing（VRT）のサポートが入るようになりました。

Cypressはv15より、アプリ操作を記録してテストを自動生成する「Cypress Studio」の機能が強化されました。v15.4.0よりフラグなしでデフォルトで使用できるようにもなりました。

Storybookはv9よりStorybookのテスト機能が強化されました。v10からはESMオンリーの構成となり、React依存がなくなるなど依存関係も大幅に削減しています。

リンター・フォーマッターツール

リンター・フォーマッターツールでメジャーアップデートがあったものはBiome、oxlintになります。

Biomeはv2からGritQLというクエリ言語を使ってリンタープラグインが作れるようになりました。v2.3からはVue.js、Svelte、Astroがフルサポートされました。

Oxcプロジェクトからはoxlintがv1としてメジャーアップデート、フォーマットツールとしてoxfmtが登場しました。

Prettierはv3.6より高速化された新たなCLI機能を--experimental-cliフラグより開放して使用できるようになりました。

型ツール

型ツール関連でメジャーバージョンが上がったものはありませんでしたが、TypeScriptのバージョンについてはsemverで運用されていないため、マイナーバージョンアップに伴いいくつもの変更が入っています。

• Announcing TypeScript 5.8 - TypeScript
• Announcing TypeScript 5.9 - TypeScript

今年はTypeScriptのネイティブ実装をGoへ移植するプロジェクトが発表されました。

https://devblogs.microsoft.com/typescript/typescript-native-port/

AIエージェントフレームワーク

AIエージェントを作成するためのフレームワークとしてTypeScript製のツールがいくつか登場してきています。PythonのものよりもWebアプリケーションとしての接続として同じ技術スタックが使えることは1つの利点と言えそうです。

Vercel AI SDKはエージェント昨日の開発が非常に簡易的でわかりやすく、LlamaIndex.TSはRAG重視型のイベント駆動フローを採用、LangChain.jsはLangChainにまつわるエコシステムとしての成熟度が高く、VoltAgentはLLM可視化プラットフォームを提供しており、MastraはWeb開発者としての開発体験を重視したフレームワークとされています。 UIライブラリやメタフレームワークのように、それぞれの機能要件に合わせて向いているものを扱うのが良さそうです。

ちなみにMastraはGatsbyJSの開発者でもある2人によって作成されたAIエージェントフレームワークです³。

おわりに - 昨年の予測振り返りと来年の予測

前回の記事では以下のような2025年の展望を予想しました。

• 脱仮想DOMでの宣言的UIが主流となる（Fine Grained Reactivityの実現）
• サーバーコンポーネントの普及に伴うクライアントとサーバーとの境界がより曖昧に
  • Next.jsのキャッシュ機能に振り回されなくなったことでのフレームワーク選択肢の多様化
  • 代わりにPages Routerがなくなるかもしれない
• VoidZeroを中心としてJavaScriptツールチェインのエコシステムが賑わう
• パフォーマンスを重視したものが価値として優先されていく

それぞれについてを振り返ってみましょう。

まず脱仮想DOMはVue.jsのVue Vapor Modeが次バージョンへの搭載が予定され、Reactは脱仮想DOMではないですがReact Compilerの登場によってパフォーマンスを考慮しつつコンパイラ内で隠蔽する方向へ進化しています。

クライアントとサーバーとの境界についてはNext.jsでのuse cacheディレクティブによる指定、SvelteKitのRemote fucntions、Astro Server Islandsなど、よりシームレスにサーバー機能がコンポーネントへ統合された動きがありました。

Vite v7でのRolldown採用、oxlint v1リリースなど、Oxc/Rolldown基盤がインフラとして実用段階に入っており、さらにVite Plusの統合型ツールチェインの発表など、Viteエコシステムを中心とした活発的な動きが見られました。

昨年から引き続きRust製ツールは順調に発達し、TypeScriptはGo移植へ転換するなどJavaScript実装に寄らないパフォーマンスを意識したフロントエンドエコシステムへの参入は見られています。

いずれの予想も大きなズレはなかったかと思っていますが、これに加えて生成AIとフロントエンドのエコシステムの融合や、サプライチェーン攻撃といったセキュリティにまつわる問題がより顕著にみられる1年になったなと振り返ってみて気付かされました。

フルスタックフレームワークやUIライブラリにはMCPサーバーが導入され、マイグレーションやライブラリの使い方をそこからAIエージェントに学習させて高品質なアウトプットができるような仕組みを作っています。HonoでもHono CLIが発表され、CLIでの操作したり情報を得られるようにしたAIフレンドリーな仕組みが実装されてきています。 今後もこの流れはフロントエンドのエコシステム上で必要なことになりそうです。

npm上でのサプライチェーン攻撃も顕著な年になりました。直接的には使ってなくても依存関係の都合上で悪意のある攻撃を受けてしまう危険性については、いきなり顕在化した問題でなくかつてからあった懸念点ではありましたが、あまりの深刻さにこれまで牧歌的な開発が許されていた雰囲気を一変させてしまいました。

その影響もあってか、OIDCを活用したnpm Trusted Publishingが登場したり、pnpmではminimumReleaseAge機能が追加されるなど、パッケージマネージャー側での自衛機能が強化されました。AIエージェントを活用することが当たり前になってきた中で、より安全に使うためにサンドボックスやコンテナ上で動かす必要性も出ているのでこうした安全性へシフトしていく動きも引き続き注目されそうです。

パフォーマンスで取り上げたTypeScriptのGo移植についても気になっている部分があります。それは内部のCompiler APIが使えなくなることです⁴。 この影響は特にts-morphといったCompiler APIを活用するプラグイン側に大きな影響があるためTypeScriptのプラグインやライブラリが一部追従できなくなる可能性も考えられます。特にVolar.jsにおいてはTypeScriptのソースコードを動的に書き換えることでtscにはない拡張機能やプラグインを注入させる仕組みを取り入れていたりします。

let tsc = (readFileSync as any)(...args) as string;

// add allow extensions
const extsText = extensions.map(ext => `"${ext}"`).join(', ');
tsc = replace(tsc, /supportedTSExtensions = .*(?=;)/, s => s + `.concat([[${extsText}]])`);
tsc = replace(tsc, /supportedJSExtensions = .*(?=;)/, s => s + `.concat([[${extsText}]])`);
tsc = replace(tsc, /allSupportedExtensions = .*(?=;)/, s => s + `.concat([[${extsText}]])`);

// proxy createProgram
tsc = replace(tsc, /function createProgram\(.+\) {/, s =>
  `var createProgram = require(${JSON.stringify(proxyApiPath)}).proxyCreateProgram(`
  + [
    `new Proxy({}, { get(_target, p, _receiver) { return eval(p); } } )`,
    `_createProgram`,
    `require(${JSON.stringify(__filename)}).getLanguagePlugins`,
  ].join(', ')
  + `);\n`
  + s.replace('createProgram', '_createProgram')
);

return tsc;

https://github.com/volarjs/volar.js/blob/f17c19f712651acde33cc2171a112e64db0b460e/packages/typescript/lib/quickstart/runTsc.ts#L20-L40

以上、今年の振り返りをしてみて、来年以降のフロントエンド技術動向はどうなるかを予測してみました。来年以降もフロントエンドのエコシステムに大きな変動は来ない（生成AIのようなゲームチェンジャーが登場しない限り）と思っているのでその延長線上のものになります。

• ツールがよりAIフレンドリーに最適化され開発生産性の向上に寄与していく
  • MCPサーバーの搭載が当たり前のものになっていく
• 依存関係を減らし人やAIが安心安全に使えるような技術選定やアーキテクチャに変化していく
• TypeScriptのGo移植影響による一部エコシステムの衰退の可能性
  • もしかしたら生成AIが不足した部分をカバーしてくれるかもしれない

というわけで今日までの動向を振り返ってみましたが、今年の残りにもいくつかの変更やリリースがあるかもしれません。引き続きフロントエンド技術周辺を見守っていこうと思います。

参考記事

• フロントエンドフレームワーク
  • React Blog – React
  • Angular Blog
• メタフレームワーク
  • Next.js 16 | Next.js
  • Announcing Nuxt 4.0 · Nuxt Blog
  • The Astro Blog | Astro
  • Lume 3 was released - Adolfina Casás - 🔥 Updates
  • Announcing AnalogJS 2.0 ⚡️ - DEV Community
  • Remix Jam 2025 - YouTube
• ランタイム
  • Node.js v25の主な変更点 - 別にしんどくないブログ
  • Node.jsでネイティブにTypeScriptを実行できる「Type Stripping」機能が安定版に到達。Node.js v25.2.0 － Publickey
  • Bun 1.3 | Bun Blog
• CSS
  • Blog - Tailwind CSS
  • styled-components の歴史、現在、これから
• UIフレームワーク
  • Blog - MUI
  • Nuxt UI v4 · Nuxt Blog
  • daisyUI 5 release notes — daisyUI Tailwind CSS Component UI Library
• パッケージマネージャ
  • Blog | pnpm
• モバイル＆デスクトップアプリ
  • Blog · React Native
  • Blog | The NativeScript Blog
• ビルド・バンドルツール
  • Latest From the Vite Blog | Vite
  • Parcel v2.14.0
  • Parcel v2.15.0
• モノレポツール
  • Nx Blog - Updates from the Nx & Nx Cloud team
  • Blog | Turborepo
• バックエンドフレームワーク
  • Announcing NestJS 11: What’s New - Trilon Consulting
• テストツール
  • Blog · Jest
  • Latest From the Vitest Blog | Vitest
  • Cypress Blog
  • Articles | Storybook Blog
• リンター・フォーマッターツール
  • Prettier 3.6: Experimental fast CLI and new OXC and Hermes plugins! · Prettier
  • Biome v2—コードネーム：Biotype | Biome
  • 怖くない！GritQLでBiomeプラグインを作ろうよ - Speaker Deck
  • Oxlint v1.0 Stable | The JavaScript Oxidation Compiler
• 型ツール
  • TypeScriptネイティブ移植観察レポート TSKaigi 2025 - Speaker Deck
  • TypeScript 6.0で非推奨化されるオプションたち - Speaker Deck