行を仮想化したグリッドを、スクリーンリーダーに正しく読ませる

数万行のグリッドで行の仮想化を実装するとき、スクリーンリーダーが実際の行数と現在位置を把握できなくなる問題を、aria-rowcount / aria-rowindex などの ARIA 属性で解決する実装方法と React コンポーネント例を解説。

React, WAI-ARIA