Profiling
- React Native kursu
- Uzman
- Ders 7/47
- 5 dk
Profiling ve performans ölçümünü öğrenirsin.
Profiling nedir?
Profil çıkarma (profiling), uygulamanın nerede zaman harcadığını ölçmektir. React Native'de bu, JS ve native tarafı ayrı ayrı ölçmeyi gerektirir; darboğaz hangi tarafta olduğunu bilmek önemlidir.
React Native, Perf Monitor ile JS ve UI thread kare sürelerini gösterir. Daha derin analiz için react-native-performance ve Flipper kullanılır. Ölçmeden optimize etme; önce ölç, sonra darboğazı bul.
Perf Monitor
React Native'in Perf Monitor'ü geliştirici menüsünden açılır. Ekranda iki çubuk görünür: üstte JS, altta UI thread. Her biri kare başına milisaniye gösterir.
JS çubuğu sürekli yüksekse sorun JS tarafında; UI çubuğu yüksekse native render darboğazı var. Hedef 16 ms'dir; bu 60 FPS demektir.
Uygulama Perf Monitor bayrağını aç
React Native geliştirici ayarlarında Perf Monitor'ü açan bayrağı yaz. Değer true olsun, anahtar showPerfMonitor olsun.
Başlangıç kodu
// app.json içine eklenecek bayrak
// showPerfMonitor: ...
export default {
expo: { name: 'Uygulama' }
};Örnek çözüm
// app.json içine eklenecek bayrak
export default {
expo: {
name: 'Uygulama',
showPerfMonitor: true
}
};Soru ve cevaplar
Dersin sorularını cevaplarıyla birlikte inceleyebilirsin. Kendini denemek istersen dersi interaktif olarak çöz.
1 Performans sorununu çözmeye başlamadan önce ne yapılır?
- Üçüncü partı kütüphane eklemek
- Hemen kodu yeniden yazmak
- Profil çıkarıp ölçmek Doğru cevap
- Expo'yu kaldırmak
Açıklama: Önce ölçüm yapılır, sonra darboğaza müdahale edilir.
2 Hedef kare süresini yaz
60 FPS için hedef kare süresi ____ ms'dir.
60 FPS için hedef kare süresi 16 ms'dir.
Açıklama: 60 FPS = 16 ms kare süresi.
3 Perf Monitor çubuklarını eşleştir
| Kavram | Anlamı |
|---|---|
JS çubuğu |
JavaScript thread |
UI çubuğu |
Native render |
16 ms |
60 FPS hedefi |
Flipper |
Derin analiz aracı |