Angular Circular Dependency Problemi

UMUT ÇELİK
HAVELSAN
Published in
2 min readOct 28, 2023

Tavuk mu yumurtadan, yumurta mı tavuktan ?

Selamlar,

Frontend geliştirenler genellikle bir kere de olsun circular dependency problemi ile karşı karşıya kalmıştır. Peki nedir bu Circular Dependency ?

Şimdi gelelim asıl mevzumuza şimdi alt başlıkta yazıldığı gibi aslında tavuk mu yumurtadan yoksa yumurta mı tavuktan sorusu tam da bu circular dependency hatasını söylüyor, Zaten çoğu kaynakta bu soruna HEN(Tavuk) problemi de deniyor.Hocam şimdi nasıl yani tavukla balıkla yumurtayla ne alaksı var kod yazmanın hata alamanın diye düşünenler oluyordur :) Anlatalım o zaman kısaca; şimdi circular dependency aslında komponentlerin birbirlerine bağımlı olmasıdır, kısaca A Componenti ve B Componenti olduğunu düşünelim. B Componenti A komponetini kalıtım olarak alıyor sonra bir süre sonra A komponenti de B komponenetine ihtiyaç duyup kalıtım alıyorsa işte tam da burada döngüsel bir bağımlılık oluşuyor. Yani tavuk yumurta ilişkisi buradan geliyor :)

Döngüsel bir bağımlılıktır.
Olmasını istemediğimiz durum!

Evet şimdi artık bağımlılıklar çift yönlü olursa circular aldığımızı anladık. Peki yukarıdaki bir bağımlılık yaptık bu hatayı bilmeden de yapabiliriz nerede ne zaman önümüze gelir aşağıdaki gibi Browserda console’da hatayı alırız.

Browser Console Error Warning in circular dependency detected.

Yukarıdaki gibi bir hatayla karşılaştığımızda kodumuzu açıp bağımlıklarımızı kontrol ediyoruz, yapımızı bir daha gözden geçiriyoruz.

Son olarak birkaç joker bilgi ;

DOM (Document Object Module): HTML blokları içindeki nesnelere kolaylıkla erişim sağlamak ve üzerinde işlemler yapabilmek için tasarlanan bir modeldir. DOM ile HTML dosyamızda bulunan her şeye erişim sağlayabiliriz.

Virtual DOM: üzerinde document objelerimiz anahtar-değer yani bilindiği üzere key-value değerleri olarak saklanmaktadır. Yani bellekte aynı anda hem real dom hem de virtual dom bulunmaktadır. Burada virtual dom’ un artısı, bizim verilerimizde bir güncelleme olduğunda bu değişiklik sayfalarımıza da anında yansıyacak ve kullanıcılar bu değişiklikleri anında görecekler. Yani performans açısından değerlendirirsek oldukça başarılı.

Teşekkürler…

--

--