ONLINEENGLISH (EN)
随笔与小抄
碎碎念、技术快捷小抄、开发避坑指南与踩坑记录。即写即发,免去繁琐排版。
React useEffect 清除函数小贴士
在处理以下情况时,务必在 useEffect 中返回清除函数(cleanup function)来避免内存泄漏:
- 事件监听器 (
window.addEventListener) - WebSocket 连接与订阅
- 定时器 (
setTimeout,setInterval)
useEffect(() => {
const handleResize = () => console.log(window.innerWidth);
window.addEventListener('resize', handleResize);
// 清除函数
return () => window.removeEventListener('resize', handleResize);
}, []);
避免内存泄漏对于提高页面的 INP(Interaction to Next Paint)性能分数至关重要。
#react#前端