Proposal: 特に理由がなければ PropTypes なしの StatelessComponent にしたい

[recruit-tech]

Proposal: 特に理由がなければ PropTypes なしの StatelessComponent にしたい

[mizchi]

一旦 pure に揃える、という話になった

[yosuke-furukawa]

yosuke_furukawa [12:25 AM]
親が毎回ちゃんとprops意識して渡してくれたら良いけど、 {...props} とかで渡してくると関心のないpropertyも子に渡しちゃうからその時に大変っていう。ただそういう渡し方をしない、かつ、必ず渡したpropsの型定義を書く、ならPureといっしょになると思われる。
まぁでもPureComponentにして、onlyUpdateFor書かせない or ほんとうに必要な時に書く、というのが時代の流れな気もするな、、、
関数ってでも基本的に一回作って渡したら変えないけど、connectからpropsで渡しちゃうとどうなるんだっけ、参照だから変わってないはず？
この辺が確か変わるんだったような気がするんだよな。。。
onClickか何かに関数作って渡しちゃうケースが多いからかな。
ちょっと細かい話になってきたな。
https://www.sitepoint.com/optimizing-react-performance-stateless-components/
SitePoint
Optimizing React Performance with Stateless Components — SitePoint
Writing inefficient React components can cause them to rerender too often. Peter Bengtsson looks at ways of creating and optimizing stateless components.
May 4th, 2017
https://www.sitepoint.com/wp-content/themes/sitepoint/assets/images/icon.javascript.png
こうやって毎回関数を作って渡しちゃうっていう書き方すると必ず新しい関数だから一回だけbindして欲しい時とかにPureだと毎回renderされちゃう。
```render() {
    return <div>
      <h1>Users</h1>
      {
        this.state.users.map(user => {
          return <User
            name={user.name}
            highlighted={user.highlighted}
            userSelected={() => {
              this.toggleUserHighlight(user)
            }}/>
         })
      }
    </div>
  }```
この userSelected が毎回関数作っちゃう

yosuke_furukawa [12:41 AM]
ただこうやって書いちゃうとやっぱり型定義と性能を両立させるためっていう文脈でbabel-pluginで解決させる策は Pure と変わらないものになるな。。。
koichikの奴はなくてもいいやっていう気がしてきた。
型定義と性能を両立するっていうのがそもそもあんまりだな。
型定義は型定義、性能は性能って切り分けたほうが考え方はシンプル。
Flowは書くけど、onlyUpdateForは必要に応じて書く。
僕の中ではスッキリした。なくていいやって結論になった。
flowtypeの型定義の強力さを受け入れるならonlyUpdateForはぶっちゃけ邪魔なんだな、、、そして性能を両立させようとすると型定義が曖昧になる。
型定義厳密にすると性能が落ちる
落ちるというかPureと変わらなくなる。

=> 型定義の厳密性と性能の両方を取ろうとすると中途半端になりがち && 設計が難しくなるので、一旦シンプルにDXを取って型定義の厳密さを採用。性能は別途都度でやったほうが良い。その時の啓蒙も合わせてする。