# Todo ## Web [CourseMap](https://hackmd.io/zpak6bIvQtaHMJjTVjgAsg) - [ ] 進度 ## Server - [ ] email server - [ ] remote attach security - [ ] FireWall - [ ] VPN? # Performance - Lazy Load - [img](https://www.freecodecamp.org/news/how-to-lazy-load-images-in-react/) ![image](https://hackmd.io/_uploads/S1jtKTNVa.png) - [code](https://react.dev/reference/react/lazy#load) - [memo](https://react.dev/reference/react/memo) - memo - useCallback - useMemo ### When to use? * Use React Memo if your component will render quite often. * Use it when your component often renders with the same props. * Use it in pure functional components alone. * Use it if your component is big enough (contains a decent amount of UI elements or complex logic) to have props equality check. ref: - [React 性能優化那件大事,使用 memo、useCallback、useMemo](https://medium.com/%E6%89%8B%E5%AF%AB%E7%AD%86%E8%A8%98/react-optimize-performance-using-memo-usecallback-usememo-a76b6b272df3) - [What is React memo and how to use it?](https://hygraph.com/blog/react-memo)