Basit Anlatım (Herkes İçin)
Sorun Nedir?
Müzik çalar (player) bazı durumlarda donuyor. Özellikle:
- Yavaş internet bağlantısında
- Eski cihazlarda
- Şarkı atlarken
- Sekme arka plana alındığında
Neden Oluyor?
Player kodu karmaşık bir yapıya sahip. Ana sorunlar:
- Bellek (RAM) düzgün temizlenmiyor
- Şarkı geçişlerinde karışıklık
- Hata yakalama yetersiz
- Zamanlayıcılar üst üste biniyor
Çözüm Seçenekleri
- Kod Düzeltme: Mevcut player'ı tamir et (haftalar/aylar)
- Profesyonel SDK: Hazır çözüm satın al (hızlı)
- Hibrit: Kritik sorunları düzelt + ileride geçiş
Öneri
Hibrit yaklaşım önerilir: Önce kritik 3-4 sorunu düzelt (acil rahatlama), sonra profesyonel çözüme geçiş planla. Spotify, Deezer gibi devler bile kendi player'larını geliştiriyor ama milyonlarca dolar yatırım yapıyorlar.
Mevcut Player Analizi
342 KB • 4000+ satırSistem Mimarisi
- player-core.js (ana mantık)
- safe-storage.js (localStorage)
- api.js, session.js
- spot-player.js (anons)
- spa-router.js, favorites.js
- HLS.js (streaming)
- Howler.js (MP3 fallback)
- Alpine.js (state)
Tespit Edilen Kritik Sorunlar
HLS Fatal Error Crash
Fatal HLS hatası (bufferAppendError, networkError) olduğunda cleanup eksik. Event listener'lar temizlenmiyor → sonsuz döngü riski.
// player-core.js:2110-2156
this.hlsNext.on(Hls.Events.ERROR, async function(event, data) {
if (data.fatal) {
// ❌ Eski HLS event listener'ları temizlenmiyor!
if (self.hlsNext) { self.hlsNext.destroy(); }
// Recursive playSongFromQueue() çağrısı
self.playSongFromQueue(nextIdx);
}
});
Crossfade Timeout Sonsuz Döngü
Crossfade devre dışı ama state'ler tutuluyor. Fatal error → timeout cancel → ama nextIndex play başlatılıyor → state karışıklığı.
Buffer Timeout Sorunu
Seek işlemi sırasında isSeeking=true kalabilir. 3 saniye sonra zorla kapatılıyor ama buffer yüklenmemişse müzik donmuş görünür.
// player-core.js:2323-2329
setTimeout(() => {
if (self.isSeeking) {
self.isSeeking = false; // ❌ Buffer kontrol edilmiyor!
}
}, 3000);
Audio Element Cleanup Hatası
audio.load() empty source ile buffer temizlemeyi amaçlıyor ama HLS.js ile çakışma yaratabiliyor. Progress tracking interval'ları temizlenmiyor → memory leak.
Blob URL Memory Leak
revokeBlobUrl() fonksiyonu tanımlı ama ASLA çağrılmıyor. HLS.js blob URL'leri tab kapatılana kadar memory'de kalıyor.
Safari Native HLS Deadlock (iOS)
Safari native HLS path'inde audio.load() beklenmedik buffer eviction tetikleyebiliyor → iOS'ta donma/restart.
Spot Player Overlap
Anons audio element ve müzik player audio element'ları çatışabiliyor. Anons sonrası müzik başlamayabilir.
Donma Nasıl Oluşuyor? (Root Cause)
Profesyonel Streaming Çözümleri
Kurumsal (Enterprise) SDK'lar
THEOplayer
ÖNERİLEN- Low-latency HLS desteği (ilk sağlayan)
- Tüm platformlar (Web, iOS, Android, Smart TV)
- White-label, tam özelleştirme
- Enterprise SLA ve destek
Bitmovin
PREMIUM- En hızlı ticari adaptive streaming
- VP9, HEVC, 4K/60FPS desteği
- Kubernetes tabanlı encoding
- Gelişmiş analytics
JW Player
POPÜLER- En yüksek pazar payı
- Kolay entegrasyon
- Geniş dokümantasyon
- Standalone SDK yok (OTT app)
Wowza
PROFESYONEL- Ultra-low latency HLS
- SecureToken koruması
- CSS skinning, plugins
- Yayıncılar tarafından tercih ediliyor
Realtime Audio SDK'lar
ZEGOCLOUD
- Adaptive bitrate streaming
- iOS, Android, Flutter, React Native
- Milyonlara ölçeklenebilir
Agora
- Gaming endüstrisinde popüler
- Cross-platform
- Yüksek stabilite
Superpowered SDK
- Tüm platformlar + Web
- HLS örnek projeleri
- Efektler, time stretching
Ant Media Server
- WebRTC, HLS, RTMP, SRT
- Self-hosted seçeneği
- Community Edition ücretsiz
Open Source Alternatifler
Video.js + HLS Plugin
CSS ile özelleştirme, güçlü plugin sistemi. Mevcut HLS.js'den daha iyi yapılandırılmış.
Amplitude.js
Howler.js'in en iyi alternatifi. jQuery bağımlılığı yok, tamamen özelleştirilebilir.
ExoPlayer (Android)
Google tarafından geliştiriliyor. Granüler kontrol, Play Store güncellemeleri.
Devler Nasıl Yapıyor?
Spotify
- Mimari: Microservices (Java, Scala, Node.js)
- Streaming: Apache Kafka (real-time), RTSP + HLS
- Storage: Apache Cassandra (yüksek erişilebilirlik)
- CDN: Global edge servers, bölgesel routing
- Codec: Ogg Vorbis + MPEG
- Altyapı: Google Cloud (10 yıldır)
Deezer & Apple Music
- Deezer HiFi: 16-bit/44.1kHz FLAC, 1,411 kbps
- Apple Music: 256 kbps AAC + ALAC lossless
- Apple Lossless: 24-bit/192kHz, 3730 kbps'e kadar
- Buffer: Adaptive, 128-512 frame
Karşılaştırma Tablosu
| Çözüm | Fiyat | Entegrasyon | Low Latency | Destek | Audio Odaklı |
|---|---|---|---|---|---|
| THEOplayer | $$$ | Kolay | Enterprise | ||
| Bitmovin | $$$$ | Orta | Enterprise | ||
| Wowza | $$ | Kolay | Pro | ||
| JW Player | $ | Çok Kolay | Standard | ||
| ZEGOCLOUD | $ | Kolay | Pro | ||
| Video.js | Ücretsiz | Orta | Community | ||
| Mevcut (HLS.js) | Ücretsiz | Karmaşık | Yok |
Öneriler
Acil (Bu Hafta)
- 1. HLS Fatal Error handler'ı izole et (try-catch nested)
- 2. Progress interval cleanup'ı tüm yerlere ekle
- 3. revokeBlobUrl() çağrılarını ekle
- 4. Buffer durumu için görsel feedback ekle (spinner)
Kısa Vadeli
- 1. State machine refactor (tek kaynak)
- 2. iOS Safari path'ini test et ve düzelt
- 3. Spot player overlap sorununu çöz
- 4. Session polling'i yeniden değerlendir
Uzun Vadeli
Seçenek A: Kod Refactor
- • Event emitter pattern
- • Async queue (concurrent engelle)
- • FSM (Finite State Machine)
- • Unit testler
Seçenek B: SDK Geçişi
- • THEOplayer veya Wowza değerlendir
- • POC (Proof of Concept) yap
- • Maliyet/fayda analizi
- • Kademeli geçiş planı
Benim Önerim
Hibrit Yaklaşım: Önce acil düzeltmeleri yap (1-2 hafta), kullanıcı deneyimini hemen iyileştir. Paralelde Wowza veya THEOplayer için POC hazırla. Eğer profesyonel SDK'nın ROI'si mantıklıysa, Q2'de geçiş planla. Audio streaming için Wowza fiyat/performans açısından en mantıklı görünüyor.