GitHubX
GitHubが100万行の差分表示に対応するプルリクエスト画面の裏側を解説
インプレッション38,000リポスト13いいね171
保存・既読はこの端末のブラウザにのみ記録されます。コピーには記事の公開情報のみが含まれます。保存データの管理 →
専門用語をかみ砕いて、仕事で使える言い方にしています。
結論
GitHubが大量の変更点がある画面をスムーズに表示できるように仕組みを新しくしました
これまではコメントの表示方法が原因で巨大な変更を見る時に画面が重くなっていました
画像や文字のサイズによって変わるコメントの高さの計算方法を工夫して解決しています
詳細内容
プログラムの変更点である差分を表示すること自体よりも、そこに付くコメントの処理に技術的な苦労がありました
形式の文章、開閉式の詳細、返信入力欄、読み込み中の画像など、要素ごとに高さが変わることが処理を重くする原因でした
実際に画面に描画するまで正確なサイズが分からないという課題を、独自の設計で克服しています
使えるシチュエーション
- 1大規模なシステム更新で膨大なコードの変更を確認する時
- 2多くのメンバーからたくさんのコメントが付いたをレビューする時
- 3読み込みの遅延や画面のカクつきを気にせず快適にコードレビューを行いたい時