- 441枚出しているのでズームアウトするともっさりする
- 逆に言えばoverflow: hiddenだけでブラウザがレンダリングの枝刈りをしてくれてるってことか
- ほぼブラウザのネイティブ実装に丸投げしている
- まあ状態更新はReactを使っているのでここだけ自前管理にするという手もあるが(前回はそうした)それによってメリットがあったかどうかはイマイチ微妙
- うーん、何をしたらいいかわからないな
一部の付箋でフォントサイズ調整が失敗しているのが気になる
- 直した
- 付箋をstyledに変えた時にフォントサイズ計測用の隠し付箋がクラス名ベースでスタイルを共有してたのにそちらのケアを忘れてた
グループのレンダリングのテスト
- まずテストケースを作るか
- 付箋は雑にオブジェクトのリストを作ってテストしてたが、グループをやるとなるとそろそろJSONのインポートを。
- まずはグループの前に付箋だけでインポートを作るか
- 付箋だけのJSONからのインポート、できた
- 本当はJSONのバージョン番号を見て分岐すべき
- だけどテストのおかげでそれは必要になってからリファクタリングしたらいいやという気持ちになった
- 今回も、まず付箋を描くのに必要なオブジェクトのリストがfusensに入るところからスタートして型の支援でするんと移行したから
- 一度「JSONから付箋は読めたが位置がおかしい」が発生した
- 元の構造では
{x: number, y: number} - 新しい構造では
{position: number[]}
- 元の構造では
構造が違うのだから型エラーになるべきだがならなかったのはなぜかというと、テストコードがJSだからanyの状態で渡ってしまうせい
- テストコードをTSにすべきかなぁ
- Firestoreから読んだ時でも型がないのは同じなので「型がないものに対して期待通りの構造か確認して型をつけて返す関数」が必要だとは思う