TypeScript vs. ERBの型安全性

TypeScriptだけをいくら使用しても型安全にはなりません。逆にRuby ERBを使用すればほとんど何もしなくても高い型安全性が得られます。

  • RubyおよびERBは実行時に強い型付けとなるため、存在しないフィールドにアクセスするとエラーが発生してすぐに気づきます。
    • 簡単なテスト(controller test, request spec)でカバーできます。
    • 例えばDBのフィールド名を変更したけれども、アプリ側で変更忘れがあった場合がこれに当たります。
  • 一方でReact/JSXは実行時に弱い型付けになるため、存在しないプロパティをアクセスしてもエラーは発生しません。
    • JSXがundefinedを空白文字列に自動変換してしまうためです。undefinedならthrowするようにJSXが設計されていればこのようの問題は回避できたはずですが、Reactはそのように設計されていません。1
    • QAでも気づきにくい場合があるため、本番に出てしまうリスクが高いバグです。
    • E2Eテストがあっても、普通はすり抜けてしまいます。
    • TypeScriptは実行時には存在しないため、役に立ちません。
    • 例えばバックエンドがJSON APIのプロパティ名を変えてしまい、フロントエンドで未対応の場合がこれに当たります。

結論

  • 面倒なツールを導入して細かいテスト等を用意しない限り、Ruby/ERBの方がTypeScript/Reactよりも型安全になります。ここでいう型安全性は、本番にバグを出すリスクを減らしてくれるという意味です。
  • 画面に表示するデータをなるべく正確にしたいというのであれば、TypeScript/ReactよりもRuby/ERBの方が安全だと言えます。

  1. ちなみにJavaScriptはundefined"undefined"文字列に自動変換します。これも問題ではありますが、空白文字列よりは多少目立ちますのでまだマシです。