「今週のフロントエンド」2026/04/17号

はじめに

「Opus 4.7来ましたね」— 金曜の朝会でその声が上がってから、話題はClaude Codeの/ultrareview、auto mode、/rewindや1Mコンテキストのセッション運用、routinesまで一気に転がっていきました。そこにaxiosのCVSS 10.0続報やCSSマルチカラムの新プロパティのような地続きの更新も重なっていて、手元に持ち帰れる変化が濃い一週間です。

今週のトピックス

Claude Opus 4.7 — エージェント側の進化が効いてくるアップデート

www.anthropic.com

今週のトップはやはりここです。Anthropicが2026年4月16日にClaude Opus 4.7をリリースしました。モデル単体の変化は4.6からの積み増しという印象ながら、コーディング・指示追従・高解像度画像(長辺最大2,576pxまで対応)まわりの改善がまとまっています。ベンチマークでもOpus 4.6をはっきり上回ったと公式発表されています。個人的には、モデル本体よりClaude Code側の使い勝手の刷新でした。Claude公式アカウントの告知どおり、/ultrareviewコマンドが「注意深いレビュアーが拾いそうな指摘」を専用セッションで洗い出してくれるようになりました。auto modeもMaxプランへ降りてきたので、長めのタスクを割り込みなしで回し切れるようになっています。Claude CodeのリードエンジニアであるBoris Cherny氏がTipsスレッドを公開中です。朝会でも「モデルに合わせてハーネスも毎回チューニングされるので、純粋なモデル性能だけを切り分けて評価するのは難しくなってきた」という話になりました。

axiosのCVSS 10.0脆弱性 — 初報と続報で評価が変わった一件

zenn.dev

axiosにCRLFインジェクションとプロトタイプ汚染を組み合わせたHTTP Request Smuggling脆弱性(GHSA-fvcv-3m26-pcqx)が公開されました。影響範囲は1.13.2未満、1.13.2〜1.14.xは部分修正、1.15.0以上で正式修正で、PoCではプロトタイプ汚染経由でIMDSv2までたどり着ける組み立てです。初報ではCVSS 10.0の数字とあわせてチームでもざわつきましたが、翌日malaさんから続報ポストで「これは偽脆弱性と言ってもよいのでは」という指摘が入りました。実際に刺さるのは独自アダプターやinterceptor経由、ブラウザ/React Native/fetch adapterなどNode.jsのhttpを通らない経路に限られるようです。とはいえlockfileに1.15.0未満が残るとnpm auditでCriticalが居座り続けます。npm ls axiosで確認してoverridesresolutionsで持ち上げたいところです。

CSSマルチカラムレイアウトの新機能 — 縦カルーセルがCSSだけで組める

css-tricks.com

Chrome 145でcolumn-wrap(列を横に作り続けるか下の行に折返すかを指定)とcolumn-heightプロパティが入りました。これまでMulti-columnはコンテンツが溢れると横スクロールを発生させてしまうのがUX的に厳しくて実務では避けがちだったので、2Dフローとして組めるようになったのは地味に助かるやつです。組み合わせとして面白かったのはcolumn-wrap: wrapscroll-snap-type: y mandatoryを足す縦カルーセルの作例です。ビューポート高にcolumn-heightを合わせるだけで、JSなしのページネーション風スナップが成立します。執筆時点でFirefox・Safari・EdgeはMulti-columnの新プロパティ未対応なので、プログレッシブエンハンスメントの使い方になります。

Claude Codeのセッション管理と1Mコンテキスト — Rewindが効いてくる

claude.com

Claude Codeが100万トークンのコンテキストに対応しました。Continue・Rewind・Clear・Compact・サブエージェント移譲という5つのセッション運用の選択肢をどう使い分けるか、というThariq氏の解説ポストがチーム内でかなり刺さりました。特に実感が強かったのがRewind(Esc二度押しまたは/rewind)です。Claudeが5ファイル読んで試した結果うまくいかなかったとき、「それはダメ、Xで」と追加プロンプトするより、ファイル読み込み直後までいったん戻して学んだことを反映した指示で再実行する方が良いです。Compactはタイミングが難しく、次のタスクが見えてから/compact focus on ~と明示的に渡すのが良さそうという話になりました。1M対応で「context rot(300〜400k付近から精度が落ちる現象)」にぶつかるケースも出てきていて、サブエージェントに結果検証だけ投げて結論を戻してもらう使い方をチームで試しています。

TanStack StartのRSC対応 — データプリミティブ中心の独自実装

tanstack.com

TanStack StartがReact Server Components対応を発表しました。createServerFunctionsuspenseQueryを軸に、RSCをフェッチ・キャッシュ可能なデータプリミティブとして扱う設計で、サーバーアクションやキャッシュコントロールもTanStack Queryの延長で書ける形です。実例として紹介されているtanstack.com自身の移行では、ブログページで約153KB(gzip)のJS削減と、LighthouseスコアのTBT 1,200ms→260msというビフォーアフターが出ています。朝会では「Composite Componentsの考え方がNext.jsのRSC実装より筋が良さそう」という感想も出ていて、全サーバーに倒しきらないisomorphicなRSCの選択肢として移行先候補に置いておきたいところです。

MDNの新フロントエンド — React SPAからLit+Server Componentsへ刷新

developer.mozilla.org

MDN Web Docsがフロントエンド(旧称Yari)を刷新し、React SPAからLitベースのWeb Componentsと独自のServer Componentsに移行しました。旧構成はdangerouslySetInnerHTML頼みでローカル起動に約2分かかる状態だったそうです。新構成はRspackベースで起動約2秒、しかもSSRが常時動く単一コマンドに統一されていて、開発体験が別物になったとのこと。チームでもWF用HTMLのテンプレ実装に何を使うかという議論が続いていたので、Lit+Server Components構成を候補として具体的に検討できる良い事例になりました。

Claude Code Routines — クラウドで回る自動化トリガー

code.claude.com

Claude Codeにroutinesが入り、プロンプト・対象リポジトリ・MCPコネクタを束ねてスケジュール・APIエンドポイント・GitHubイベントで自走させられるようになりました。ローカルではなくAnthropic側のクラウドインフラで動くので、PCを閉じていても走り続けてくれるのがポイント。用途例としては、毎晩issueの整理とラベル貼りをしてSlackに投稿するパターンや、監視ツールからのアラートでスタックトレース調査+修正PRを自動で開くパターンがドキュメントに並んでいます。朝会では「このブログ下書きパイプラインもroutineに載せ替えればローカル起動しなくて済むのでは」という話が出ていて、週次の雑務系をエージェントに寄せる動きがまた一段進みそうです。

Clear-Site-Dataヘッダー — ログアウト時のストレージ一括クリア

developer.mozilla.org

MDN Web Docsの投稿で改めて紹介されていたClear-Site-Data、Cookie・storage・cacheをサーバー側からまとめて消せるHTTPレスポンスヘッダーです。ログアウト用エンドポイントのレスポンスにClear-Site-Data: "cookies", "storage", "cache"を付けるだけでOK。フロントエンドでlocalStorageやIndexedDBをクリアする処理が不要になります。主要ブラウザで数年前から対応済みで、「消し忘れ起点のログイン済み状態残留」が起きやすいログアウト周りを一本のヘッダーで片付けられるのは助かります。チームでも「これ知らなかった、次のログアウト改修で使いたい」という反応でした。

Bunのヘッドレスブラウザ自動化 — bunwvが標準搭載

www.publickey1.jp

Bun v1.3.12で、bunwvコマンド経由でヘッドレスブラウザを操作できるHeadless Browser Automationが標準搭載されました。bunwv startでWebViewを起動し、bunwv navigatebunwv screenshotあたりだけでも基本動作が揃っています。macOSではWKWebView、Windows・クロスプラットフォームではChrome/Chromiumを自動検知して使う構成で、DevToolsプロトコル経由のアクセスにも対応しているそうです。Anthropicが2025年12月にBunを買収しているので、Claude Code連携が想定ユースケースに前のめりで入っている点も面白いところ。まずbunwv screenshotを手元のエージェントパイプラインに突っ込んでみて感触を見たいところです。

HTML in Canvas API — Canvas上にHTMLをそのまま描画する

azukiazusa.dev

Canvas上にHTML要素をそのまま描画できるHTML in Canvas APIが、WICGで実験的に提案されています。これまでcanvas内に文字やレイアウトを置こうとすると、アクセシビリティも選択も諦めて頑張って描くしかない領域がありました。朝会でも話題になったCW氏のポストでは、HTMLをthree.jsシーンに投影するデモが公開されていて、そこが地続きになる未来が一気に近づいた感じがします。「最近コレ系の表現が流行ってますよね」という話でチームも盛り上がっていて、ビジュアル側のFEがまだまだ面白くなりそうな気配です。

メモ

  • Vitest 4.1のAgent ReporterVoidZeroの投稿で、Vitest 4.1からエージェント実行を検出したときは失敗テストとサマリだけを返すAgent reporterが既定になるとアナウンスされています。LLMへ流すトークンを無駄に太らせないあたり、エージェント時代のテストランナーらしい気配りです。
  • Microsoft APM — Agent Package Manager — Microsoftがエージェント向けパッケージマネージャー「APM」を公開しました。apm.ymlでinstructions・skills・prompts・agents・hooks・MCPサーバーなどを宣言し、Copilot/Claude/Cursor向けに依存解決ありで配れる設計です。
  • Caveman — LLMのレスポンスから敬語・クッション言葉・冗長な助詞や前置きを削って、意味を保ったまま出力トークンを大幅に減らす仕組みです。caveman-commitcaveman-reviewなどの派生が揃っていて、/cavemanで切り替えられます
  • Simon Oxley氏 逝去 — Twitterの青い鳥ロゴとGitHubのOctocatをデザインしたSimon Oxley氏が56歳で逝去されました。普段目にしているアイコンの多くを手掛けてくれた方で、謹んでご冥福をお祈りします。
  • Meta Boxer — 屋内向け3D物体検出モデル — Metaが屋内環境向けの3D物体検出モデル「Boxer」を公開しました。2D画像上の物体検出結果を方向付きの3Dバウンディングボックスに持ち上げ、6DoFや動画のカメラモーションにも対応します。
  • Ray-Ban Metaスマートグラスが日本発売予定 — Ray-Ban Metaスマートグラスが今夏日本で発売予定と報じられ、海外では新モデルも登場しています。朝会では「会社で使ってよいのか」「プライバシー配慮をどうするか」あたりが論点でした。
  • Curiosityが撮影した火星の夜空Night Sky Todayの投稿で紹介されていた、火星探査機Curiosityが撮影した映像。フロントエンドの話題とは別軸ですが、技術的ロマンを補給したい方向けに。
  • 基本関数を一つの演算子で表す論文 — sin・cos・指数関数など数学の基本関数が単一の演算子「E」で表現できるという論文が紹介されていました。真偽の判断は専門家に委ねたいところですが、話のネタとしては面白かったので共有。

まとめ

今週はエージェント側の大きな動きが続きながら、CSSマルチカラムのcolumn-wrapやMDNの新フロントエンドのように、Web標準・プラットフォーム側の着実な前進もセットで並んだ週でした。派手な一発より、こっち側の積み上げが効いてくる場面が増えていきそうだな、という空気がチーム内にもあります。

手元で動けるところだと、axiosはnpm ls axiosで1.15.0未満が残っていないかを確認し、独自アダプターやinterceptor経由で刺さる条件が無いかも合わせて見ておきたいところ。Chrome 145が降りてきたらLPやニュースレター的な縦レイアウトでcolumn-wrap: wrapscroll-snapを試してみるのも、短時間で手応えが得られる作業です。

今週いちばん考えさせられたのは、「CVSS 10.0」という数字に反射で動きかけた自分を止められたかどうか、でした。スコアやバージョン警告に反応して手が動く前に、アドバイザリ本文と自分のプロジェクトでの使い方を突き合わせる——そのひと手間を挟めるか。朝会で「このくらいの騒ぎ、半年前より冷静に受け止められるようになってきた気がする」と話せたのが、今週いちばんの手応えだったかもしれません。


この記事はXtoneフロントエンドチームの朝会の議事録を元に作成されました。