ReactとかSwiftUIみたいに、UIを定義するとその状態にDOMをいい感じにしてくれる仕組みのこと

でいいのかな

1(フレーム|状態)ごとのアプリの状態を設定するだけで済んだという点が重要という認識

before

前(フレーム|の状態)に変更を加えて新しい状態を表示していた

前の状態がどうなっているのかを知らないといけない

after

今どう表示したいかだけ書けばよくなった

以前どんな状態だったか、今後どんな状態になるかは一切考えなくていい

今まではafterを実現するのに、時間がかかりすぎるという技術的な問題があった

DOMを毎回毎回全部捨てて一から作り直すことで実装できるのだが、あんまりにもコストが大きすぎる

もちろん、小規模アプリならこれでもいい

e.g. 更新行をスクロールバーに表示するUserScript

Reactは以前のDOMとの差分だけを更新する手段を取ることで、現実的な処理速度と負荷でDOMを構築できるようになった

それでも要素数がえぐい(2万~)時は結構重かったりする

Cosenseがこれで困る

差分更新は全部Reactがやってくれるので、アプリ開発者は今の状態だけをReactに伝えればいい

const Component = (...) => { ...; return <div>...</div>} のreturn文がその今の状態に当たる

jQuery地獄から脱することができる今世紀最大の発明

jQueryと組み合わせても問題ないはず

References