recompose とかいう困ったちゃん
React 使って中～大規模サイトを作ったことがある人であれば、State の管理に Redux や MobX などのパッケージを使ったことがある人は多いと思う、もちろん GraphQL でも問題ない。
これらのパッケージを使用すると、コンポーネントの粒度はどう分ければ良いのか、という問題にぶちあたるケースは多いと思う。
自分は React を触り始めて 3 年目に入ったが、未だにベストプラクティスが見つかっていない状態である。
ネットで調べても、『これ！』という回答も見当たらないし、多分みんな同じような感じなんじゃないかな、と。
（逆にベストプラクティスを持っている人とかいたら、ちょっと怖い気もする）
ただ、一つだけ自分の中で、これだけは強く人にオススメできるアプローチがあって、それが Presentational Components と Container Components という考え方である。
Presentational and Container Components
Redux の公式サイトに昔から載っている考え方なのだが、Redux に限らず、MobX であろうが GraphQL であろうが、ともすれば素の React であっても導入すべきアプローチだと、個人的には考えている。
Presentational Components と Container Components については、（情報が正しいかどうかは置いといて、）ネットで調べれば山ほど情報が出てくるので、ここでは割愛する。
ただ一つ言えるのは、とかく State は、Container 側でのみ扱え、ということである。
ということは、以下のような実装になることは、想像に難くないと思う。
Component（= Presentational Components）は State を扱わない → SFC（もしくは function）となる
Container（= Container Components）は State を扱う → SFC となれない → React.Component を継承した class となる
で、実際自分が今携わっているプロジェクトでは、上記の思想に則ってコーディングを行っている。
が、一つ小さな問題として、Container の記述量が多くなりがちである。
当たり前だけど、基本的に、SFC の方が class よりも記述量は少ない。
また、container は class で component は SFC と書き分けるのは、やってみるとわかると思うが、結構面倒くさい。
そんな問題を解決してくれるのが、recomposeというパッケージである。
このパッケージ、どんなパッケージかというと、今まで class で扱っていたもの、例えば、
- componentDidMount や shouldComponentUpdate などのライフサイクルメソッド
- onClick や onChange などの state を更新するメソッド
- state
- context
などを、全て HOC で扱えるようにし、container は FC で書いちゃおうぜ！という、かなりパワフルなパッケージである。
で、実際に recompose を使ってみると、型定義はともかくとして、なかなかどうして使いやすい。
他にもたくさんの APIが同梱されているので、class の肥大化を抑えたいのであれば、とりあえず recompose 使っとけ！くらいのノリでいける。
（もちろん言わずもがな、HOC の呼び出し箇所はかなり肥大化するので、悪しからず）
ただ、ここまで書いておいてなんだが、今から recompose を使うことはおすすめできない。
なぜなら、github の recompose のトップページに書いてあるとおり、recompose の開発者は、現在 React の開発メンバーに加わっており、recompose にあった機能を React 自身に移し替えようとしている。
そのため、将来的には recompose 自体が不要となるため、もう recompose の開発は行わないよ、とのことで。
先立って、React の公式から、recompose の機能導入第一弾として、Hooksという機能がアルファ版でリリースされた。
今日仕事中に少しだけ使ってみたが、確かに FC において state がとても気軽に扱えたので、個人的には好印象である。
また、recompose では、HOC で全て解決しようとしていたが、そのアプローチすらもやめてしまって、もう全部 function の実装に入れちゃえば良いんじゃない？というノリもアリだなーと思う。
（HOC って、確かに便利だけど、面倒な部分も多い）
ただ、言わずもがなアルファ版のため、まだ機能が全然足りていない、今 Hooks を業務に持ち込むのは自殺行為だと思われる。
かといって、recompose は開発が終了しているし、今から勉強するのもアホらしいよなーと思いつつ。
ひとまずは無難に class で書くのが案外一番落ち着きが良いのかも、と思った今日この頃です。
余談
これを読んだけれど、かなり悲惨だった。
フロントに関する本は陳腐化が早すぎるので、需要はあっても利益率は相当低そうな気がする…。