Muzibu system-check sayfasındaki gecikme ölçüm algoritması ve tüm bileşenlerin detaylı analizi
Öncelikli Analiz Alanı
Gecikme nedir? İnternetinizin "tepki süresi"dir. Siz bir şarkıyı tıkladığınızda, bu komutun sunucuya gidip cevap gelene kadar geçen süre. Milisaniye (ms) ile ölçülür.
Neden önemli? Yüksek gecikme = şarkılar geç başlar, geçişlerde takılma olur. Düşük gecikme = anlık tepki, akıcı deneyim.
// Ping testleri sırasında ilerleme (30-60%)
const latencies = [];
for (let i = 0; i < 5; i++) {
const start = performance.now();
try {
// Laravel API - gerçek sistem yanıt süresini ölç
await fetch('/api/muzibu/ping?t=' + Date.now(), {
method: 'HEAD',
cache: 'no-store'
});
latencies.push(performance.now() - start);
} catch (e) {
latencies.push(500); // Hata durumunda 500ms fallback
}
this.connectionProgress = 30 + (i + 1) * 6; // Progress: 36, 42, 48, 54, 60
}
// Ortalama gecikme hesaplama
this.latencyMs = Math.round(
latencies.reduce((a, b) => a + b, 0) / latencies.length
);
Jitter, ping değerlerinin ne kadar "tutarsız" olduğunu gösterir. Düşük jitter = stabil bağlantı.
const avg = this.latencyMs;
this.jitterMs = Math.round(
latencies.reduce((sum, lat) => sum + Math.abs(lat - avg), 0)
/ latencies.length
);
// Jitter Eşikleri:
≤20ms → İyi (Stabil bağlantı)
21-50ms → Normal
51-100ms → Kararsız
>100ms → Çok Kararsız
// calculateConnectionScore() içinde
if (this.latencyMs <= 50) score += 40; // Çok iyi
else if (this.latencyMs <= 100) score += 35; // İyi
else if (this.latencyMs <= 200) score += 25; // Normal
else if (this.latencyMs <= 400) {
score += 15;
warnings.push('Bağlantınızın tepki süresi yüksek');
}
else {
score += 5;
warnings.push('Bağlantınızın tepki süresi çok yüksek');
}
public/themes/muzibu/js/alpine-apps.js
resources/views/themes/muzibu/system-check.blade.php
// Computed Properties
get latencyLabel() {
return this.latencyMs + ' ms';
}
get latencyBar() {
// 0ms = %100, 500ms = %0
return Math.max(0, 100 - (this.latencyMs / 5));
}
get latencyColor() {
if (this.latencyMs <= 50) return '#059669';
if (this.latencyMs <= 100) return '#4ade80';
if (this.latencyMs <= 200) return '#facc15';
return '#dc2626';
}
get stabilityLabel() {
if (this.jitterMs <= 50) return 'İyi';
if (this.jitterMs <= 100) return 'Normal';
return 'Kötü';
}
get stabilityBar() {
// 0ms jitter = %100, 100ms jitter = %0
return Math.max(0, 100 - this.jitterMs);
}
get stabilityColor() {
if (this.jitterMs <= 20) return '#059669';
if (this.jitterMs <= 50) return '#4ade80';
if (this.jitterMs <= 100) return '#facc15';
return '#dc2626';
}
Basit: İnternetinizin indirme hızını ölçer. Mbps (Megabit/saniye) cinsinden gösterilir.
// 100MB test dosyası ile ölçüm
const response = await fetch(
'/themes/muzibu/speed-test-payload.bin?t=' + Date.now()
);
const blob = await response.blob();
const duration = (performance.now() - speedStart) / 1000;
this.speedMbps = Math.round(
(blob.size * 8 / duration / 1000000) * 10
) / 10;
// Puan Katkısı:
≥50 Mbps → +40 puan
≥20 Mbps → +35 puan
≥10 Mbps → +28 puan
≥5 Mbps → +20 puan
≥2 Mbps → +12 puan
<2 Mbps → +5 puan
Basit: Cihazınızın RAM, CPU ve tarayıcı sürümünü kontrol eder. Eski veya zayıf cihazlar uyarı alır.
// UAParser.js ile cihaz tespiti
const parser = new UAParser();
const result = parser.getResult();
this.devicePlatform = result.os?.name;
this.deviceBrowser = result.browser?.name;
this.browserVersion = parseInt(result.browser?.version);
// Navigator API
this.deviceMemory = navigator.deviceMemory || 0;
this.deviceCores = navigator.hardwareConcurrency || 0;
// Tarayıcı Eşikleri:
Chrome: 120+
Firefox: 120+
Safari: 17+
Edge: 120+
POST /api/muzibu/speed-test
{
"trigger_type": "manual",
"download_speed": 45.2,
"latency_ms": 67,
"jitter_ms": 12,
"connection": {
"type": "wifi",
"effective_type": "4g",
"downlink": 10,
"rtt": 50
},
"device_profile_id": "abc123"
}
HEAD /api/muzibu/ping
// Latency ölçümü için kullanılır
// Laravel API - gerçek sistem yanıt süresi
// Alternatif (eski):
GET /ping.php // Lightweight, ~50ms