Two Way Binding - One Time Binding In AngularJS

Two way binding (çift yönlü veri bağlama) modeldeki değişiklikleri view’e, view’deki değişiklikleri modele aktarma işlemidir. Daha önceki yazımda two way binding ve doğal olarak digest cycle’dan uzun uzadıya bahsetmiştim.

Two way binding, kullanıcı etkileşimlerinin direk view kısmına aktarılması kısmında çok güzel bir işleve sahip olsa da; digest cycle tetiklendikten sonra en az 2, maksimum 10 kez çalıştığı düşünülürse performans anlamında büyük sorunlar oluşturacaktır. Şöyle ki; benim data binding sayım arttığı ölçüde $digest loop’un sayısı da artacaktır. Kullanıcı etkileşiminin yoğun olduğu bir sayfada performans anlamında yaşanabilecek sıkıntılar elbette ki kaçınılmaz olacaktır.

Hal böyle olunca Angularjs geliştiricileri Angular 1.3 versiyonu ile data binding’den kaynaklanan performans sorunlarını gidermek adına one-time binding’i tanıttılar. One time binding view-model güncelleme işlemini bir kez yapıyor, bundan sonra yapılan etkileşimler herhangi bir şekilde view’e ya da modele yansıtılmıyor. Yani digest cycle bir kez kullanıcı etkileşimlerini dinliyor ve bu sayede güncelleme bir kez yapılmış oluyor.

One-time binding nasıl çalışır görelim

Yukarıdaki gif’den de anlaşılacağı üzere model’de yazdığım yazının ilk karakteri view’e bağlanıyor. Ondan sonraki etkileşimlerde hiçbir şekilde veri bağlama yapılmıyor.

Syntax farkına bakalım

Two way binding

  <p> {{ name }} </p>

One time binding

  <p> {{ ::name }} </p>

Ecmel Albayrak