การจัดการหน่วยความจำ
Memory leaks, cleanup, useEffect cleanup, listeners, timers, การจัดการรูปภาพขนาดใหญ่
1memory leak ในแอปพลิเคชัน React Native คืออะไร?
memory leak ในแอปพลิเคชัน React Native คืออะไร?
คำตอบ
memory leak เกิดขึ้นเมื่อออบเจกต์ในหน่วยความจำไม่ถูกใช้งานโดยแอปพลิเคชันอีกต่อไป แต่ garbage collector ไม่สามารถคืนหน่วยความจำได้เพราะยังมีการอ้างอิงถึงออบเจกต์เหล่านั้นอยู่ ใน React Native มักเกิดจาก subscription ที่ไม่ได้ทำ cleanup, timer ที่ยังทำงานอยู่หลังจาก unmount หรือ closure ที่จับการอ้างอิงเก่าเอาไว้ memory leak จะค่อย ๆ ลดประสิทธิภาพและอาจทำให้แอปแครชในเซสชันที่ยาวนาน
2ฟังก์ชันที่ return ออกมา (cleanup function) ใน useEffect มีบทบาทอย่างไรในการจัดการหน่วยความจำ?
ฟังก์ชันที่ return ออกมา (cleanup function) ใน useEffect มีบทบาทอย่างไรในการจัดการหน่วยความจำ?
คำตอบ
cleanup function ที่ useEffect return ออกมาจะถูกเรียกก่อนที่ component จะถูก unmount หรือก่อนที่ effect จะถูกเรียกใหม่ด้วย dependency ใหม่ บทบาทหลักของมันคือการเคลียร์ทรัพยากรที่ effect จองไว้ เช่น ยกเลิก subscription, clearTimeout/clearInterval, ลบ event listener หรือยกเลิก request ที่ค้างอยู่ หากไม่มี cleanup นี้ ทรัพยากรเหล่านี้จะยังคงอยู่ในหน่วยความจำและอาจพยายามอัปเดต component ที่ถูก unmount ไปแล้ว
3ทำไมการใช้ clearTimeout และ clearInterval ใน cleanup function ของ useEffect จึงสำคัญ?
ทำไมการใช้ clearTimeout และ clearInterval ใน cleanup function ของ useEffect จึงสำคัญ?
คำตอบ
timer ที่สร้างด้วย setTimeout และ setInterval จะยังคงทำงานต่อแม้หลังจาก component ถูก unmount แล้ว หาก callback ของ timer พยายามอัปเดต state ของ component ที่ถูก unmount จะทำให้เกิด warning 'Can't perform a React state update on an unmounted component' และกลายเป็น memory leak timer จะเก็บการอ้างอิงไปยัง callback และ closure ของมัน ทำให้ garbage collector ไม่สามารถคืนทรัพยากรเหล่านี้ได้ การใช้ clearTimeout/clearInterval ใน cleanup ช่วยให้ยกเลิก timer เหล่านี้ได้อย่างถูกต้อง
จะป้องกัน memory leak อย่างไรเมื่อใช้ event listener ใน React Native?
closure ส่งผลต่อการจัดการหน่วยความจำในคอมโพเนนต์ React Native อย่างไร?
+17 คำถามสัมภาษณ์
หัวข้อสัมภาษณ์ React Native อื่นๆ
พื้นฐาน JavaScript
พื้นฐาน React
พื้นฐาน React Native
React Hooks
TypeScript สำหรับ React และ React Native
คอมโพเนนต์และ API ของ React Native
การจัดสไตล์และเลย์เอาต์ใน React Native
การนำทางใน React Native
การจัดการ State ใน React Native
Networking และ API ใน React Native
การคงอยู่ของข้อมูล
ฟอร์มและการตรวจสอบความถูกต้อง
แอนิเมชัน React Native
Native Modules & Bridge
โค้ดเฉพาะแพลตฟอร์ม
สิทธิ์และ Device API
Push Notifications
การทดสอบ React Native
การ Debug React Native
Build & Deployment
Expo vs React Native Bare
การเพิ่มประสิทธิภาพ
Architecture Patterns
React Native New Architecture
แนวทางปฏิบัติที่ดีที่สุดด้านความปลอดภัย
Offline-First Architecture
CI/CD React Native
Monorepo และการแชร์โค้ด
หัวข้อขั้นสูง
วงจรชีวิตแอปและการทำงานเบื้องหลัง
การยืนยันตัวตนและการจัดการเซสชัน
Monitoring & Crash Reporting
เชี่ยวชาญ React Native สำหรับการสัมภาษณ์ครั้งถัดไป
เข้าถึงคำถามทั้งหมด flashcards แบบทดสอบเทคนิค แบบฝึกหัด code review และตัวจำลองสัมภาษณ์
เริ่มใช้ฟรี