⏱

Player Gecikme Analizi

Eski Cihaz & Kotu Internet - Sifir Donma Plani

6 Sorun Tespit Edildi 6 Cozum Planlandi Tek Dosya Degisecek

📝 Basit Anlatim (Herkes Icin)

Sorun ne?

Muzik calar (player) sarki calarken bazen kisa sureli donuyor. Bu donmeler 117ms ile 223ms arasinda suruyor. Normal bir kullaniciya pek hissettirmese de, eski telefonlarda veya yavas internette ciddi takılmalara yol aciyor.

Neden oluyor?

Player, muzik dosyalarini parcalara (segment) ayirip caliyor. Bu parcalari cozumlemek (decode etmek) icin agir islem yapiyor ve bu islem tarayicinin ana is parcaciginda (main thread) calisiyor. Yani sarki calarken ayni anda ekranin tepki vermesi gereken islem de bloke oluyor.

Neden onemli?

Eski cihazlarda (2GB RAM, 2 cekirdek CPU) veya 3G/2G baglantida bu donmeler cok daha belirgin oluyor. Kullanici sarkiyi acinca 1-2 saniye bos ekran gorebilir, ileri/geri suruklerken takilma yasayabilir.

Nasil duzeltilecek?

Agir islemi arka plan islemine (Web Worker) tasiyacagiz. Ayrica player'in cihazin gucune ve internet hizina gore kendini otomatik ayarlamasini saglayacagiz. Eski telefonda dusuuk kalite, iyi telefonda yuksek kalite.

🔎 Teknik Analiz: Mevcut Durum

Mevcut Altyapi (Kullanilmiyor!)

old-device-checker.js

Cihaz profilini tespit ediyor (RAM, CPU, tarayici surumu) ama player ayarlarini DEGISTIRMIYOR

Durum: Pasif - kullanilmiyor

speed-tester.js

Baglanti hizini oluyor ama HLS konfigurasyonunu ETKILEMIYOR

Durum: Pasif - sadece raporluyor

buffer-monitor.js

Buffer sorunlarini algilayip hiz testi tetikliyor

Durum: Aktif - ama sadece izliyor

🚨 Tespit Edilen 6 Sorun

KRITIK

1. Web Worker Kapali (enableWorker: false)

Etki

HLS.js segment cozumlemesi (ADTS demux, MP3 frame parsing) tamamen main thread'de calisiyor. Her 2-4 saniyede yeni segment geldiginde ana is parcacigi 100-200ms bloke oluyor.

Dosya: player-core.js:296 Gecikme: 150-223ms

Eski cihazlara etkisi:

2 cekirdekli CPU'da segment parsing 300-500ms surebilir. Kullanici ekranin donmasini hisseder.

YUKSEK

2. ontimeupdate Throttle Yok

Etki

Audio element'in ontimeupdate eventi saniyede 4-250 kez ateslenebiliyor (tarayiciya bagli). Her ateslendiginde preload kontrolu, crossfade zamanlama hesabi ve UI guncelleme yapiyor. 5 farkli yerde ayni handler kayitli.

5 lokasyon: satir ~5155, ~5361, ~2545, ~3958, ~4136

Eski cihazlara etkisi:

Firefox'ta saniyede 250 kez ateslenebilir. Eski cihazda her biri 0.5ms surse = 125ms/sn CPU yuku sadece bu handler'dan.

YUKSEK

3. Progress Interval 100ms (Gereksiz Sik)

Etki

setInterval(fn, 100) ile saniyede 10 kez progress guncelleniyor. Bu ontimeupdate ile AYNI isleri yapiyor - cift islem. Muzik calarda 250ms (saniyede 4) yeterli.

3 lokasyon: startProgressTracking, startProgressTrackingWithElement, crossfade
ORTA

4. Adaptif HLS Konfigurasyonu Yok

Etki

HLS buffer ayarlari sabit: 20sn buffer, 30MB limit, baslangic kalitesi belirtilmemis. Eski cihazda ayni 30MB buffer RAM'i doldurur. Yavas baglantida en yuksek kaliteden baslar, sonra duser = ilk calmada uzun bekleme.

Yavas baglantiya etkisi:

3G'de (1.5Mbps) ilk segment 270kbps kalitede gelirse ~1.5sn bekler. 32kbps'den baslasa 0.2sn'de baslar.

ORTA

5. DOM Sorgusu Her 100ms'de

Etki

getActiveHlsAudio() fonksiyonu her cagirildiginda document.getElementById() yapiyor. Saniyede ~10 kez DOM'a erisim. Sonuc her zaman ayni ama cache'lenmiyor.

ORTA

6. Yavas Baglantida Preload Bant Genisligi Caliyor

Etki

Sarkinin 10. saniyesinde sonraki sarki preload ediliyor. 3G/2G baglantida bu preload mevcut sarkinin buffer'ini doldurmasini engelliyor. Sonuc: mevcut sarki takilir.

Yavas baglantiya etkisi:

2G'de (250kbps): Mevcut sarki 32kbps + preload 32kbps = 64kbps. Baglanti 250kbps olsa bile her ikisi icin de takilma olusabilir.

⚡ Cozum Plani (6 Fix)

Tum degisiklikler tek dosyada: player-core.js

1

Web Worker Aktiflegtir

EN BUYUK ETKI - Tek satir degisiklik
Dusuk Risk 
- enableWorker: false,
+ enableWorker: true,

HLS segment parsing Web Worker'a tasini. Tarayici desteklemezse hls.js otomatik fallback yapar. Safari zaten native HLS kullanir, etkilenmez.

Beklenen iyilesme: 150-223ms gecikmeler yok olur Rollback: Tek satir
2

Adaptif HLS Config (Cihaz + Baglanti)

Eski cihaz/yavas net otomatik algilanir
Orta Risk

Normal Cihaz (4G)

  • Buffer: 20sn hedef, 30sn max
  • RAM limiti: 30MB
  • Baslangic: Otomatik (en iyi kalite)

Eski Cihaz / 3G

  • Buffer: 10sn hedef, 20sn max
  • RAM limiti: 15MB
  • Baslangic: ultralow (32kbps)
  • Fragment timeout: 20sn (10sn yerine)

Tespit: navigator.deviceMemory (RAM), navigator.hardwareConcurrency (CPU), navigator.connection.effectiveType (baglanti)

3

ontimeupdate Throttle (250ms)

5 handler'a throttle guard eklenir
Dusuk Risk 
const now = performance.now();
if (now - self._lastTimeupdateProcess < 250) return;
self._lastTimeupdateProcess = now;

Saniyede 250 kez yerine max 4 kez calisir. Kullanici fark edemez cunku muzik calari icin 250ms yeterli hassasiyet.

4

Progress Interval: 100ms → 250ms

3 lokasyonda setInterval suresi arttirilir
Dusuk Risk

Main thread yuku %60 azalir. Progress bar hareketi hala akici gorulur (saniyede 4 guncelleme yeterli).

5

getActiveHlsAudio DOM Cache

Sonuc cache'lenir, DOM sorgusu ~0'a duser
Cok Dusuk Risk

Saniyede ~10 DOM sorgusu yerine sadece audio ID degistiginde 1 kez sorgu yapilir.

6

Yavas Baglantida Preload Erteleme

2G'de preload kapatilir, 3G'de son 5sn'de yapilir
Dusuk Risk

2G

Preload KAPALI

3G

Son 5sn'de

4G+

Normal (10sn)

🛠 Uygulama Sirasi & Risk Tablosu

Adim Fix Risk Beklenen Etki Rollback
1 enableWorker: true Dusuk 150-223ms gecikmeler yok olur Tek satir
2 DOM cache Cok dusuk 10 DOM sorgu/sn → 0 5 satir
3 Throttle + interval Dusuk Main thread yuku %60 azalir Sayi degisikligi
4 Adaptif HLS config Orta Eski cihaz: hizli baslangic + az RAM Config geri al
5 Preload erteleme Dusuk Yavas nette buffer takilmasi yok Guard kaldir

✅ Beklenen Sonuclar

Metrik Simdi Sonra
Max longtask 223ms <50ms
ontimeupdate/sn 4-250 Max 4
Progress interval 100ms (10/sn) 250ms (4/sn)
DOM sorgu/sn ~10 ~0 (cached)
HLS demux thread Main thread Web Worker
2G baglanti preload Hemen (bant genisligi calar) Kapali (mevcut sarkiya odaklanir)
19 Subat 2026 • Muzibu.com