javascript işlemci kullanımı azaltma

Merhaba arkadaşlar web alanına yeni başladım. Yakın zamanda JS kullanarak sayaç yaptım fakat operada incelediğim zaman işlemcinin %35 ini kullandığını gördüm. Bunları azaltmak için hangi konuları öğrenmeli yada ne tür teknikler kullanmalıyım. şimdiden teşekkürler


var t = new Date();
var date;
var h,m,s,ms,tarih;
var ah,am,as;

function saat(x){
if(x<=9){
return "0"+x;
}else{
return x;
}
}

function msaat(x){
if (x<=9) {
return "00"+x;
}else if(x<=99){
return "0"+x;
}else{
return x;
}
}

setInterval(function(){
date = new Date();

h = date.getHours();
m = date.getMinutes();
s = date.getSeconds();
ms = date.getMilliseconds();

h = saat(h);
m = saat(m);
s = saat(s);
ms = msaat(ms);

tarih=h+":"+m+":"+s+":"+ms;

document.getElementById("taha").innerHTML=tarih;
},1)

function alarm(){
setInterval(function(){
ah = document.getElementById("asaat").value;
am = document.getElementById("adak").value;
as = document.getElementById("asan").value;

if(ah!="" && am!="" && as!=""){
document.getElementById("taha3").style.display="block";
document.getElementById("taha3").innerHTML="Alarm Kuruldu"+ah+":"+am+":"+as;

if(ah == h && am == m && as == s){
document.getElementById("taha4").innerHTML='';

}

}

},1000)}


Kodunu görmeden nasıl yorum yapabiliriz?

kodu ekledim ama sorum daha çok genel olarak yani herhangi bir durumda nasıl daha performanslı yapılır.

Genel geçer bir çözüm yolu yok, bazı best practicesleri uygulamayı deneyebilirsin. Yazdığın kod kullanıcı tarafında çalışmak zorundaysa WebAssembly kullanmayı deneyebilirsin.

https://www.keycdn.com/blog/javascript-performance

https://medium.com/@OPTASY.com/webassembly-vs-javascript-is-wasm-faster-than-js-when-does-javascript-perform-better-db86d2ecf2cc

Genel olarak OOP öğrenmen gerek ama hakkıyla öğenmelisin ki gördüğün her söküğü dikebilirsin, spagetti ile hep yarı yolda kalırsın.

Koduna baktığımda çok basit bir mantık hatası gördüm,

setInterval(function(){
date = new Date();

h = date.getHours();
m = date.getMinutes();
s = date.getSeconds();
ms = date.getMilliseconds();

h = saat(h);
m = saat(m);
s = saat(s);
ms = msaat(ms);

tarih=h+":"+m+":"+s+":"+ms;

document.getElementById("taha").innerHTML=tarih;
},1)


en son satırda interval 1 ms ayarlanmış. 1 milisaniyelik hassaslıkta ne yapıyorsun? Eğer atomik hesaplamalar vs yapmıyorsan 1ms tabiki çok yüksek işlem gücü gerektirir. Bizim için 1 saniye makine için 1000ms demek. Yani yukardaki kod her saniye yaklaşık olarak 1000 kere çalışıyor. Ayrıca bu 1000 kere çalışan bloğun içinde new Date(); demişsin, yine çeşitli fonksiyonlar çalıştırmışsın.

Eğer ms değerine ihtiyacın varsa 250 ms gibi daha makul bir interval seçersen hem makineyi daha az yorarsın hem de 250ms gecikmeyi insan gözü pek algılayamaz zaten.