TypeScript vs. ERBの型安全性

TypeScriptだけをいくら使用しても型安全にはなりません。逆にRuby ERBを使用すればほとんど何もしなくても高い型安全性が得られます。これはJavaScript/Reactが弱い型である一方、Rubyは強い型を持つからです。

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

結論

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