Bundle config dosyası,Asp.NET MVC projelerinde varsayılan olarak gelmektedir. Burdan Microsoft’un bu dosyayı kullanmamızı istediği çıkarımını yapabiliriz.
Peki nedir bu Bundle config dosyası ? Neden kullanımına ihtiyaç vardır ?
Büyük çaplı projelerde script ve css dosyalarımızın kontrolünü yapmak, küçük çaplı bir projelere nispeten daha karmaşıktır. Tek bir sayfada beşten fazla script her biri için css dosyası olduğunu da varsayarsak 10 satır yapar. Projemizde on sayfa olsa ve her sayfada bu dosyalara ihtiyaç duysak 100 satır yapar.Oluşan karmaşıklığı ve projeyi geliştireyim derken içine düşülen takip operasyonunu varın siz hayal edin :)Bu dosyalar bu kadar ne olabilir ki derseniz: kodlamaya yeni başlayanlar için örnekleyeyim: Jquery.min.js,Jquery-ui.js, Bootstrap.min.js, Bootstrap.css,kendi yazdığımız ‘custom’ css ve js dosyaları, kullanılan bir diğer plugin’lere ait css ve js uzantılı dosyalar..
İşte bu durum, proje geliştirme sürecinde zorluklar çıkarabilir. Projede dosyaların daha düzenli tutulması için bundle config dosyası kullanılmaktadır. Tabi ki tek yararı karmaşıklığı ortadan kaldırmak değil. Projemize eklediğimiz css ve script dosyalarını optimize ederek performans tasarrufu sağlar ve google aramalarında bizi üst sıralara taşır.
BundleConfig.cs dosyamıs App_Start klasörünün içerisinde bulunmaktadır. Varsayılan bir proje başlatmamışssanız ve sonradan kendiniz ekleyecekseniz bu klasör içerisine eklemeniz gerekmektedir.Siz kendiniz bu dosyayı oluşturmuşsanız
‘BundleTable.EnableOptimizations = true;’ komutunu mutlaka yazmalısınız.Aksi taktirde bu dosyanın optimizasyon yapmasına izin vermemiş olursunuz ve amacımız olan optimizasyonda yapılamaz.
Script ve css dosyalarımızı gelişigüzel sırada bu dosyaya ekleyebiliriz ama tabi ki gelişi güzel değil her sayfa için ya da her sayfada kullanılacak olanları bir bir araya getirerek render etmenizi öneririm.
Örnek olarak kendi projemin bundleconfig.cs dosyasından bir ekran görüntüsü paylaşıyorum.Sizde incelerseniz fark edeceksiniz ki onlarca dosya kullanıyorum. Her biri için request yapılsa performans düşecektir. Siz normal bir sayfa açılışında 10 farklı js dosyası için 10 farklı request işlemi gerçekleştirirken bundle tekniği ile dosyalar “yığın” haline getiriliyor ve tek bir dosya olarak geriye döndürülüyor. 1 request işlemi gerçekleşiyor.Yine performansa dair etkisini örneklersem bundle edilen tüm dosyaların minification işlemine tabii tutulması.Yani sıkıştırılmış ve boyutu düşürülmüş bir biçimde geriye döndürülüyor.
Gelelim bu BundleConfig dosyamızı html içinde nasıl çağıracağımıza.. Resimde anlatıldığı şekilde Razor kod yardımıyla, ulaşmak istediğimiz dosyayı BundleConfig.cs dosyası içerisinde hangi isimin altına koyduysak o isimle çağırıyoruz. Yani bir isim altına 10 dosya koymuşsak 10’unada aynı tek bir satırla erişiyoruz.
Diğer yazımda görüşmek dileğiyle..
Nisanur Bulut
NisanurBulut 