frontend– tag –

同じデータのテーブルと削除確認ダイアログを、Before/Afterで作り比べました。数値の揃え方、列の並び、確認ダイアログに書くべき4つ、フォームの検証タイミングまでまとめます。

ReactのErrorBoundaryが実際にどこまで捕捉するか、5通りの壊し方で検証しました。捕まえたのは2つだけで、実務でよく起きる3つは素通りします。取りこぼしを拾う設計までまとめます。

React 18で子コンポーネント500個を並べて再レンダリング回数を実測しました。memoを貼っただけでは5,000回のまま変わらず、useCallbackで参照を固定して初めて0回になりました。

TypeScriptの型注釈は外から来るデータを検証しません。tscが止めてくれるコードと素通りするコードの境界を実際にコンパイル・実行して確かめ、境界での検証設計までまとめます。

同じ入力フォームを、要素も文言も変えずに余白・揃え・階層だけ直して比較しました。あわせて自分のブログの余白を実測し、pxとemどちらで考えるかの違いもまとめます。