Memory leak
- React Native kursu
- Uzman
- Ders 11/47
- 5 dk
Memory leak tespiti ve önlemeyi öğrenirsin.
Memory leak
Bellek sızıntısı (memory leak), kullanılmayan nesnelerin bellekten temizlenmemesidir. React Native'de en yaygın nedenler: temizlenmeyen setInterval, kaldırılan abonelikler ve kenarda kalan setTimeout.
Bileşen kaldırıldığında (unmount) tüm yan etkiler temizlenmelidir. useEffect bir temizlik fonksiyonu döner; bu fonksiyon timer'ı ve aboneliği kaldırır. Aksi halde bileşen gelse de bellekte kalır.
Abonelik temizleme
Olay abonelikleri (event listener), native modül abonelikleri ve WebSocket bağlantıları unmount'ta kaldırılmalı. Aksi halde eski bileşen olay almaya devam eder; bu hem bellek hem davranış hatası yaratır.
Örnek: DeviceEventEmitter.addListener bir subscription döner. useEffect içinde subscription.remove() ile temizlenir. Aynı yöntem NetInfo.addEventListener için de geçerli.
Uygulama Timer'ı temizle
Bir useEffect yaz. İçinde setInterval(tick, 1000) çağrısı yapılsın, ID id değişkenine atansın. Temizlik fonksiyonu () => clearInterval(id) dönsün. useEffect'i react'tan içe aktar.
Başlangıç kodu
import React from 'react';
// useEffect'i react'tan içe aktar
// useEffect ile interval kur ve temizle
export default function App() {
return null;
}Örnek çözüm
import React, { useEffect } from 'react';
function tick() {}
export default function App() {
useEffect(() => {
const id = setInterval(tick, 1000);
return () => clearInterval(id);
}, []);
return null;
}Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 useEffect temizlik dönüşü
useEffect(() => {
const id = setInterval(tick, 1000);
____;
}, []);
useEffect(() => {
const id = setInterval(tick, 1000);
return () => clearInterval(id);
}, []);
Açıklama: Temizlik fonksiyonu interval'ı kaldırır.
2 Bellek sızıntısı nedenlerini eşleştir
| Kavram | Anlamı |
|---|---|
setInterval |
Temizlenmeyen timer |
addListener |
Abonelik sızıntısı |
setTimeout |
Bekleyen timer |
WebSocket |
Açık bağlantı |
3 Bileşen kaldırıldığında ne yapılmalı?
- useEffect temizlik fonksiyonu çalıştırılır
- State sıfırlanır
- Yeni bileşen eklenir Doğru cevap
- Uygulama kapanır
Açıklama: Temizlik fonksiyonu unmount'ta çalışır.