本文へスキップ
MameTechNews

$ filter --category=frontend

フロントエンド

フロントエンドの最新ニュースを、UI・フレームワーク・ブラウザ動向の要点付きでお届けします。

Panda CSS 2.0、コンパイラをRustへ置換 抽出は最大37倍
フロントエンド

Panda CSS 2.0、コンパイラをRustへ置換 抽出は最大37倍

Panda CSSは9月29日、コンパイラをRustとOxcで書き直した2.0を公開した。css()やレシピの書き方はほぼそのままに、抽出は15〜37倍、大規模なstaticCssは約85倍速くなった。生成型のインスタンス化は約99%減る。Node 22以降のESM専用になり、デザインシステムをパッケージとして配るpanda libも加わった。

Panda CSS 元記事 ↗
Next.js 16.3.8、画像最適化のSSRFとキャッシュ汚染を修正
フロントエンド

Next.js 16.3.8、画像最適化のSSRFとキャッシュ汚染を修正

Next.jsは9月30日、Active LTSの16.3.8とMaintenance LTSの15.5.27でセキュリティ更新を出した。上流の都合で遅れていた修正が含まれ、画像最適化では許可済みURL経由のSSRFが高深刻度で直っている。自前ホストのSSGやISRでは、別ルートの内容がキャッシュに混ざる中程度の問題もある。Vercel以外でPages Routerを配信している場合は対象条件を確認したい。

VoidZero、Vite周辺を1コマンドにまとめたVite+ 1.0を正式公開
フロントエンド

VoidZero、Vite周辺を1コマンドにまとめたVite+ 1.0を正式公開

Vite開発元のVoidZeroは、ランタイムからlint、テスト、ビルドまでを`vp`で扱うVite+ 1.0を正式公開した。週次ダウンロードは約200万、公開リポジトリ依存は2,600超。ツールチェーンのバージョンずれを減らしたいチーム向けの、フレームワーク非依存の統合手段になる。導入時は既存ツールとの役割分担を確認する。

Cloudflare、Next.jsをViteで動かすVinext 1.0を公開
フロントエンド

Cloudflare、Next.jsをViteで動かすVinext 1.0を公開

Cloudflareは、Next.jsアプリをVite上で動かしWorkersやLambdaへ出せるVinext 1.0を発表した。App RouterとPages Routerの主要挙動は、Cache Componentsを除きテスト互換99%超という。Vercel以外へ移したい、またはビルドをViteに寄せたいチームの実装選択肢になる。

Cloudflare 元記事 ↗
Chrome、Connection-Allowlistでページ発の通信を拒否既定に制限可能に
フロントエンド

Chrome、Connection-Allowlistでページ発の通信を拒否既定に制限可能に

Chrome for Developersは9月23日、Chrome 152からConnection Allowlistsが利用できると解説した。Connection-Allowlist応答ヘッダで許可するURLパターンだけを通し、Fetchなどページ起点の通信を拒否既定にする。CSPでは足りない通信境界を、生成コードや第三者スクリプトの持ち出し対策として使える。

Chrome for Developers 元記事 ↗
Cloudflare、コーディングエージェントでTurnstile導入を完結させるSpinを公開
フロントエンド

Cloudflare、コーディングエージェントでTurnstile導入を完結させるSpinを公開

Cloudflareは9月25日、Turnstileのウィジェット作成からフロント埋め込み、バックエンドのSiteverifyまでをコーディングエージェントに任せるTurnstile Spinを発表した。コードはCloudflareに送らず、Claude CodeやCursor、Codexなどが手元のリポジトリを変更する。ボット対策の導入漏れとCAPTCHA移行の作業コストを下げられる。

Cloudflare 元記事 ↗
歌詞からPV風動画を生成するブラウザアプリ「JIZURA 字面」がMITで公開
フロントエンド

歌詞からPV風動画を生成するブラウザアプリ「JIZURA 字面」がMITで公開

歌詞を1行ずつ入れておまかせするだけで、拍に同期したPV風動画を書き出せるブラウザアプリ「JIZURA 字面」が話題だ。AI非依存でブラウザ完結、MITライセンス。SunoなどAI音楽やMMDとの組み合わせ投稿が増え、英語UIや素材対応のフォークも出始めている。

Anthony Fu、DevTools基盤Devframe 1.0を公開
フロントエンド

Anthony Fu、DevTools基盤Devframe 1.0を公開

Anthony Fu氏は9月16日、開発者ツールを一度定義して複数ホストへ載せる基盤Devframe 1.0を公開した。公開APIを安定化し、Vite DevToolsやNuxt DevTools v4が採用する。同じ定義をブラウザUIとMCP経由のエージェント操作の両方に使える。自前Inspectorをホストごとに作り直す前提も見直せる。

Anthony Fu 元記事 ↗
Cloudflare、Cache RulesでVaryを制御可能に 正規化とバイパスを選択
フロントエンド

Cloudflare、Cache RulesでVaryを制御可能に 正規化とバイパスを選択

Cloudflareは全プランのCache RulesでHTTPのVaryを扱えるようにした。オリジンが変動要因を宣言し、運用側が正規化・そのまま・キャッシュ回避を選ぶ。言語や画像形式で同じURLを出し分けるサイトは、キャッシュが細分化して効かなくなる状態を減らせる。ヒット確認はCF-Cache-Statusで行う。

Cloudflare 元記事 ↗
Chrome 154が安定版に 108件のセキュリティ修正、ANGLEなどに重大欠陥
フロントエンド

Chrome 154が安定版に 108件のセキュリティ修正、ANGLEなどに重大欠陥

GoogleはChrome 154をWindows、Mac、Linuxの安定版へ昇格させ、108件のセキュリティ修正を入れた。CriticalにはANGLEのバッファオーバーフロー、GPUの範囲外書き込み、ServiceWorkerの解放後使用が含まれる。広く使われるブラウザの定期更新なので、社内の固定バージョンは早めに追従したい。

Chrome Releases 元記事 ↗
Next.js 16.3.6、next/ogのImageResponseでRCEを修正 16.2以降が対象
フロントエンド

Next.js 16.3.6、next/ogのImageResponseでRCEを修正 16.2以降が対象

Next.jsは帯域外更新16.3.6を公開し、Node.js版next/ogのImageResponseで遠隔コード実行につながりうる上流問題を修正した。影響は16.2.0以上16.3.6未満。15.xにRCEはなく15.5.26は硬化のみ。OG画像に外部入力を渡しているアプリは先行して上げたい。

Node.js 26.9.0、node:ffiを既定で有効化 ネイティブ呼び出しが標準に
フロントエンド

Node.js 26.9.0、node:ffiを既定で有効化 ネイティブ呼び出しが標準に

Node.jsは9月16日、Currentの26.9.0でForeign Function Interfaceである`node:ffi`を既定有効にした。C/C++アドオンを書かずに共有ライブラリを呼べる経路が標準になる。26系はまだCurrentであり、本番をLTSに固定しているチームは導入判断を分ける必要がある。

Safari 27公開、コーディングエージェント向けMCPサーバーを標準搭載
フロントエンド

Safari 27公開、コーディングエージェント向けMCPサーバーを標準搭載

WebKitは9月17日、Safari 27.0の公開に合わせ、ローカルで動くSafari MCPサーバーを標準搭載したと説明した。エージェントがDOM、ネットワーク、スクリーンショット、コンソールを直接確認できる。Web開発のデバッグをエージェントへ委譲する前提が、主要ブラウザでも整い始めた形だ。

Vercel、Pro向けに定額のFlat Rate CDNを導入しスパイク課金を回避
フロントエンド

Vercel、Pro向けに定額のFlat Rate CDNを導入しスパイク課金を回避

Vercelは9月8日、Proチーム向けに月額固定のFlat Rate CDNを発表した。新規Proは既定で有効で、既存チームは課金設定からオプトインできる。一時的なトラフィック急増では請求が増えず、キャッシュ戦略をコスト不安で控えていたフロントエンド開発チームは設計の前提を変えられるようになった。

Webpack 5.111公開、ESモジュール出力が実験フラグなしで安定化
フロントエンド

Webpack 5.111公開、ESモジュール出力が実験フラグなしで安定化

webpackは9月14日、5.111を公開し、ESモジュール出力を安定APIにした。experiments.outputModuleを外し、output.moduleだけで利用できる。静的ファイルコピーやbrowserslistに応じたCSS変換も内蔵され、まだwebpackを使うチームは設定の整理と出力形式の見直しができる。

公開Vite開発サーバーへのスキャン急増、AWSやAzureの認証情報が標的
フロントエンド

公開Vite開発サーバーへのスキャン急増、AWSやAzureの認証情報が標的

F5 Labsは9月11日、インターネットに晒されたVite開発サーバーを狙うスキャンが8月に約3万2000件へ急増したと報告した。CVE-2026-39364で.envやクラウド認証情報、Terraform状態ファイルを読む動きで、認証は不要だ。`--host`やDockerのポート公開をしている開発環境は、修正版への更新と秘密情報のローテーションが必要になる。

Cloudflare Workers、Node.jsに寄せた新モジュールレジストリを公開
フロントエンド

Cloudflare Workers、Node.jsに寄せた新モジュールレジストリを公開

Cloudflareは9月9日、Workersランタイムworkerdのモジュールレジストリを書き換え、互換フラグnew_module_registryで提供を始めた。import.metaやURL指定子、require(esm)がNode.jsに近づき、圧縮バンドル上限も撤廃された。既存デプロイは従来実装のままなので、移行は明示的なオプトインになる。

Cloudflare 元記事 ↗
WebKit、Interop 2027の提案募集を開始 期限は9月23日
フロントエンド

WebKit、Interop 2027の提案募集を開始 期限は9月23日

WebKitはInterop 2027のフォーカス領域提案を9月3日に開始し、提出期限を9月23日とした。採択には成熟したWeb標準と自動テスト可能性が必須で、GitHub Issueでの提出が求められる。来年ブラウザが揃える互換対象を、現場の実装差の報告で動かせる短い窓口になっている。既存の同趣旨Issueがあればコメントで補強する。

Vitest 5公開、大規模スイート高速化と未awaitアサーション失敗へ
フロントエンド

Vitest 5公開、大規模スイート高速化と未awaitアサーション失敗へ

Vitestは9月3日、メジャーバージョン5を公開した。Vite 6.4以降とNode.js 22.12以降が必須で、大規模リポジトリの実行時間短縮が主眼だ。未awaitの非同期アサーションは失敗扱いになり、`clearMocks`も既定で有効になる。アップグレード前に移行ガイドの破壊的変更を確認する必要がある。

React 19.3、View TransitionsとFragment Refsを安定APIに
フロントエンド

React 19.3、View TransitionsとFragment Refsを安定APIに

Reactチームは9月9日、React 19.3をnpmで公開し、実験扱いだったView TransitionsとFragment Refsを安定APIにした。SSRを避けたい箇所向けに`use(browser())`を追加し、Trusted Typesにも対応する。画面遷移とXSS対策を、実験フラグなしで本番コードに載せられるようになる。

Tailwind LabsがShopifyに加入、開発継続へ安定体制確保
フロントエンド

Tailwind LabsがShopifyに加入、開発継続へ安定体制確保

Tailwind LabsはShopifyへの加入を発表し、週1億1000万回以上のインストール数を誇る人気CSSフレームワークの長期開発を安定させる狙いだ。Shopifyは初期活用企業の一つで、MITライセンスは変わらずチームがプロジェクトをリードし続ける。AIツール影響でテンプレート事業の収益が減った背景があり、開発者からは前向きな反応が多い。

Chrome 153安定版、Iterator.zip追加 V8のゼロデイも修正
フロントエンド

Chrome 153安定版、Iterator.zip追加 V8のゼロデイも修正

Googleは9月8日、Chrome 153安定版を公開し、JavaScriptにIterator.zip()/zipKeyed()を追加、カメラとマイク専用の宣言的HTML要素も投入した。同時に230件の脆弱性を修正し、悪用確認済みのV8境界外書き込みCVE-2026-87491を含む。2週間サイクル最初の安定版として、機能確認と即時更新が同時に必要になる。

窓の杜 元記事 ↗
Chrome、9月8日から2週間サイクルへ 153安定版が起点
フロントエンド

Chrome、9月8日から2週間サイクルへ 153安定版が起点

Googleは2026年9月8日のChrome 153安定版から、メジャーリリース間隔を4週間から2週間に短縮すると発表していた。対象はデスクトップ、Android、iOSで、Dev/Canaryは従来どおり。Enterprise向けExtended Stableは8週間のままなので、検証負荷と更新頻度の設計を分ける必要がある。

Chrome for Developers 元記事 ↗
Safari 27、モジュールローダを書き直しトップレベルawaitを仕様準拠に
フロントエンド

Safari 27、モジュールローダを書き直しトップレベルawaitを仕様準拠に

WebKitはSafari 27向けにESモジュールローダをネイティブC++で書き直し、トップレベルawaitを仕様どおりに実装したと説明した。旧実装では初期化前アクセスや完了順の不具合があり、Safari限定の回避が必要だった。Safari 27ベータとTechnology Preview 251で検証できる。

Chrome 154ベータ公開 WebCryptoに耐量子暗号とChaCha20追加
フロントエンド

Chrome 154ベータ公開 WebCryptoに耐量子暗号とChaCha20追加

Googleは9月2日、Chrome 154ベータを公開した。Web Cryptography APIへML-KEM/ML-DSAなど耐量子アルゴリズムとChaCha20-Poly1305を追加する。Private Verification Tokensのオリジン試験も始まり、フロントとセキュリティ実装の両方に影響する。

Chrome for Developers 元記事 ↗
Chrome安定版がCritical含む26件の脆弱性を修正
フロントエンド

Chrome安定版がCritical含む26件の脆弱性を修正

Googleは9月1日、デスクトップ向けChrome安定版を152.0.7977.75/.76へ更新し、セキュリティ修正26件を配信した。Shared Tab GroupsとWebGLのUse-after-freeがCritical扱いで、FileSystemやV8関連のHighも複数含まれる。Chromium系ブラウザやElectron埋め込みを使う開発者は、速やかな更新と社内配布の確認が必要になる。

Chrome Releases 元記事 ↗
Chrome DevTools 152、SPAのソフトナビでもCWVをLive Metrics表示
フロントエンド

Chrome DevTools 152、SPAのソフトナビでもCWVをLive Metrics表示

ChromeチームはDevTools 152の更新を公開し、Performance Live MetricsがSPAのクライアント側ソフトナビゲーションでもLCPやINPなどのCore Web Vitalsを既定で計測するとした。加えてNetworkの再送、Elementsのカスタム要素表示、コーディングエージェント向けMCPのヒープ検査強化が加わった。フロント計測とエージェント連携の実務に直結する。

Chrome for Developers 元記事 ↗
web.dev、8月のWeb更新を整理 text-boxとsibling関数がBaseline入り
フロントエンド

web.dev、8月のWeb更新を整理 text-boxとsibling関数がBaseline入り

web.devが2026年8月のブラウザ更新をまとめ、Firefox 154でtext-box系CSSとsibling-count()/sibling-index()が揃いBaseline Newly availableになったと報告した。Chrome 152ではautocorrect属性やwindow-drag、OpaqueRangeなども追加された。フロントエンドはベンダー接頭辞やJS補助を減らせるタイミングに入った。

Chrome 153ベータ、XML解析をRust実装へ Related Website Setsも削除
フロントエンド

Chrome 153ベータ、XML解析をRust実装へ Related Website Setsも削除

GoogleはChrome 153ベータを公開し、XSLT不要な一般的なXML解析をメモリ安全なRust実装へ切り替えると発表した。あわせてRelated Website SetsとrequestStorageAccessForを削除する。フロントエンドは互換確認と、Cookie連携前提の設計見直しが必要になる。

Chrome for Developers 元記事 ↗