アントロピックがクロード・コード端末のちらつきを修正：根本原因分析からレンダリングシステムの再構築まで Claude Code 開発者 @trq212 によるプレゼンテーションでは、Claude Code で長年問題となっていた画面のちらつきの問題について詳しく説明し、レンダリング システムを書き直すことでチームがどのようにしてちらつきを約 85% 削減したかについて説明します。 ちらつき問題の根本的な原因は、端末インターフェースが 2 つの部分で構成されていることです。 • ビューポート: 現在ユーザーに表示されている下部の領域。 • スクロールバック バッファ: スクロールされた履歴コンテンツ。 通常のコマンドラインツール（lsやechoなど）は、出力を一度だけ出力して終了し、インターフェースを頻繁に更新しません。しかし、Claude Codeは長時間実行されるインタラクティブUIであり、ビューポートを1秒間に数十回再描画することがあります。 コンテンツがビューポートの高さを超えると、最上行がスクロールバッファに押し込まれ、一部のレンダリングが「オフスクリーン」で発生します。端末がコンテンツのサイズを変更する際のレンダリングエラーや混乱を避けるため、以前のシステムでは毎回スクロールバッファ全体をクリアする必要があり、その結果、ちらつきが目立っていました。 解決策：レンダリングシステムの書き換え 過去数ヶ月にわたり、チームはレンダリングエンジンを一から書き換えました。主な改良点は以下の通りです。 • 差分: 各端末セルの変更を 1 つずつ比較し、変更された部分を更新するために必要な ANSI エスケープ シーケンスのみを発行します。 全画面再描画を最小限に抑える: 絶対に必要な場合 (端末サイズが変更された場合など) のみ、完全な再描画を実行します。 「代替画面」モードを使用してみませんか? 一部のターミナル アプリケーション (Emacs や Vim など) は、「代替画面」モードに切り替わります。 • プログラムはスクロール、選択、その他の機能を完全に制御します。 • 終了すると、元の端末の内容が自動的に復元されます。 これにより、ちらつきを完全に排除できます。 ただし、欠点としては、デバイスのネイティブ ユーザー エクスペリエンスが失われることです。次に例を示します。 • Cmd+F でグローバル検索。 • マウスによるテキスト選択。 • コピー/貼り付け機能など チームはこれらのネイティブデバイス機能を非常に重視しているため、現在はメイン画面モードの維持に注力しています。将来的には代替画面を検討する可能性もありますが、基準は高く、簡単に妥協することはありません。 なぜ修理にはこんなに時間がかかるのでしょうか? 初期のレンダリングコードには十分な自動テストがありませんでした。ある部分を修正すると、他の部分で予期せぬエラーが発生することが多く、作業の進行が遅れていました。 重要な進歩は、プロパティベースのテストが導入されたことです。 何千ものランダムな UI 状態 (さまざまな端末の幅、コンテンツの長さ、Unicode エッジ ケースなど) を生成します。 • 古いシステムと新しいシステムの両方で同じ状態を同時にレンダリングし、出力を自動的に比較して一貫性をチェックします。
