Performans odaklı yaklaşım: Tree Shaking

Görsel kaynağı: https://linguinecode.com/post/reduce-css-file-size-webpack-tree-shaking

Bugün videolarını severek izlediğim Abdullah Uğraşkan abimiz güzel bir video (Vite Nedir?) çekmiş. Videosunda bir aracı incelerken anlatım sırasında daha önce duymadığım bir kavramla karşılaştım: tree shaking. Bende unutmamak için buraya notlarımın arasına eklemek istedim.

Biliyorsunuz ben yeni yazılımcıyım. Yazılıma dair genel kültür seviyesinde bir çok bilgiye sahibim. Fakat teknik konularda özellikle derinlerdeki kavramlarda çok gerideyim. Aslında Tree Shaking konusunu es geçmeyi düşünüyordum. Çünkü ben backend alanında ilerlemeyi düşünüyorum. Tabiiki gelecek bana neyi gösterir bilemem. Bu yüzden büyük konuşmamak lazım. 

İlk defa duyduğum kavramı burada sizlere de göstermek istedim. Olayın özü aslında performans. Adamlar hızlı olsun diye kullanılmayan şeyleri işe (koda, çıktıya vs. artık herneresiyse) dahil etmiyorlar. Böylece gereksiz yüklerden kurtulmuş ve hızlı çalışmış oluyorlar. Tree shaking dediğimiz şeyin mantığı da bu oluyor basitçe.

Biraz araştırdım. Javascript webpack ve wordpress için amp eklentisinin sayfasında buldum. Özellikle bloğuma not olarak eklemek istiyorum, çünkü bunu unutum :)

Tree Shaking kavramı için wikipedia sayfasına bakalım

Tree Shaking konusu wikipedia'da bulunuyor. Ben aşağıya o sayfanın türkçeye çevrilmiş halini koyuyorum.
wikipedia - https://en.m.wikipedia.org/wiki/Tree_shaking



Diğer gördüğüm yerler

https://tr.wordpress.org/plugins/accelerated-mobile-pages/

https://ampforwp.com/tutorials/article/what-is-tree-shaking-optimize-css-in-amp/

https://webpack.js.org/guides/tree-shaking/

Makale ile ilgili linkler

Yorumlar