Just $ A sandbox

プログラミングと計算機科学とかわいさ

React ComponentにImmutable.jsは(多分)だめ

github.com

ここにもはっきり書いてあるように,

Note that state must be a plain JS object, and not an Immutable collection, because React's setState API expects an object literal and will merge it (Object.assign) with the previous state.

React ComponentのstateをImmutableデータ構造にするのは良くない.
これをするとsetStateで渡ってくるものが(型情報的には確かにImmutable.Listでも)JSArrayになってたりする.

ググったら以下の2つの方法をとっている人が多かった.

  • setState内では全てのstate.piyoImmutable.DataType(state.piyo)みたいにラップする

これは一見うまく行くように見えて, たまたまラップすることを忘れたりするとImmutable.List.unshiftじゃなくてArray.unshiftが発動したりして死ぬ可能性がある.

  • state一つ一つをImmutableにするんじゃなくてstateをまるごとImmutable.Mapにする

これはデータの取り出しがImmutable.Map.get("nyan")みたいになるので(型をつけている場合は)型情報が消滅するので自明にダメ.
なお一瞬だけMapのKeyにString Literal Typeを渡すみたいなのも考えたけど, 与えられたデータ構造からString Literal Typeをメタ生成するとかできるんだろうか. できてもやりたくはないけど.

他にいい方法があるなら知りたい.
(やはりTypescriptでも型レベルMapを作るしかない)
(ていうかこんな分かりやすいトラップがあるのにImmutable.jsはReactと相性がいいって言ったやつ誰だよ)
(interfaceの貧弱っぷりを見るにつけてもTypescriptはまだまだ改良の余地アリアリな感じがする)