來自於 gemini 給出的回應
IIFE 放在 render return 前又或是放在 JSX 中基本上是對效能沒有什麼影響的,最主要的影響還是來自於可讀性,首先為什麼會 幾乎 ,放在 JSX 中時代表著在 reneder 階段會需要額外索取記憶體空間進行匿名函式的建立跟調度,且這對於 JS 引擎來說也沒辦法做靜態的分析與優化,但這些在整個 React 複雜的 DOM 操作與 Reconciliation 來說是很小很小的花費。
當邏輯被寫成 JSX 的 IIFE 時代表他是一個 runtime 的黑盒子, 編譯器(JIT) 難以預測其行為,因為每次都會是一個新的
並且如果將來想做 react 優化,還是得搬到 react 前使用 useMemo 來處理。
在可讀性來說就是顯而易見的先計算再 render 比較好