ReactのDevtoolが入っていると重くなるケース

Next.js v15、React Developer Tools 6.1.1 (2/7/2025)で確認しています。

ボタンをクリックしたら、そのボタンの数値が増えていくプログラム。
Devtoolを開いていない状態でも、ReactのDevtoolがインストールされているとボタン押下時のレスポンスが悪くなる。

再現コードは以下の通り。ページを開いてボタンを連打すると、重い方は数字がスキップして表示されるようになる。軽い方では発生しない。

"use client"
import { useState } from "react";
import { JSX } from "react/jsx-runtime";
// MARK:ページ最上部
export function ClientBody() {
  const list: JSX.Element[] = [];
  for (const title of Array.from({ length: 10000 }, (_, i) => `${String(i + 10000)}`)) {
    // ↓重い
    list.push(<div key={title}><BlockElement title={title}></BlockElement></div>)
    // ↓軽い
    //list.push(<BlockElement key={title} title={title}></BlockElement>)
  }
  return (<div>{list}</div>);
}
// MARK:子要素Element
function BlockElement(params: { title: string }) {
  const [a, b] = useState(0);
  return (
    <div className="p-2">
      <h1>No:{params.title}</h1>
      <button onClick={() => b(a + 1)}>
        カウント:{a}
      </button>
    </div>
  )
}

chromeの設定からReact Developer Toolsを無効化すると軽くなる。
重い方のロジックはReact Developer ToolsのHighlight updates when components render.機能をonにすると全てのdomにハイライトが表示されるのだけど、これがDevtoolを開いていない状態でも何らかの処理をして重くなっているのかな。