Todo by Todo

全員私の作ったTodoアプリを使いなさい！（高圧的お嬢様風） by Todo様

技術構成

フロントエンド

• TypeScript
• Solid.js
• Rough.js (手書き風UIライブラリ)
• Zdog (軽量な3Dライブラリ)
• Three.js (有名な3Dライブラリ)
• MagicUI(よくわからんなんかおもろいUIライブラリ)
• Cow (難解プログラミング言語)

バックエンド/ インフラ

複数言語のWASMをWIT(WASM Interface Type)で繋ぐことで、多言語モジュラモノリスをする予定だった。 自作DIツールkessokuを利用しています。 インフラはシンプルにCloud Runで構築しています。

WIT(WASM Interface Type)

WITは複数のWASMをリンクし1つのWASMにまとめることができるWASM Preview 2で導入された機能です。 CやC++を触ったことがある人だと、ヘッダーファイルを通じて複数のオブジェクトファイルをリンクするのがWASMでできるようになったと思ってもらえれば大体あっています。

ただし、WASMの場合はより多数の言語からコンパイルが可能です。

モジュラモノリス

マイクロサービスアーキテクチャでは機能ごとにサービスを分割し、それらがHTTPで通信をすること1つのプロダクトができます。 しかし、これらは複雑性が高いため、サービルレベルではなくモジュール単位での分割し、サービスは1つにまとめるのがモジュラモノリスです。

今回はこのモジュールをWASMにしています。

kessoku

自作のDIライブラリkessokuを採用しています。 https://github.com/mazrean/kessoku

無駄ポイント

ライブラリ機構という比較的扱いやすい形にすることでマイクロサービス寄り複雑性を抑えられるのがモジュラモノリスのよさです。 しかし、HTTPより複雑性の高いWITで置き換え、しかもモジュールにWASM上で動くように書くという極めて厳しい制約をかけています。 このように、一見合理的なのにマイナスしかない無駄な構成となっています。

GitHub

• https://github.com/YukaChoco/todo-by-todo-frontend-solid
• https://github.com/YukaChoco/todo-by-todo-frontend-pure
• https://github.com/YukaChoco/todo-by-todo-backend