Maalesef, bu blog popüler bir SPA (Single Page Application – Tek Sayfa Uygulaması) JavaScript kütüphanesinin en hızlı ya da diğerlerinden daha hızlı olduğunu iddia etmesi hakkında değil. Bunun yerine, hem kod yürütme (code execution) hem de kod yazmada hız sunan küçük bir TypeScript kütüphanesi hakkında.
TypeScript Nedir?
“TypeScript” adı oldukça açıklayıcıdır. “Type” (Tür), değişken türlerinin kesin olarak tanımlandığı, tür bazlı bir dil olduğunu belirtir ve “Script” JavaScript’ten gelir. Yani, TypeScript temel olarak “tür bazlı JavaScript” anlamına gelir.
TypeScript, JavaScript’in üzerine eklenmiş, dile statik tip ekleyen bir üst kümedir. Bu sayede geliştiriciler, hataları erken tespit edebilir ve daha sağlıklı kodlar yazabilir. Microsoft tarafından geliştirilen TypeScript, JavaScript’in üzerine türler, arayüzler ve genellikle statik tiplendirilmiş dillerde bulunan diğer özellikleri ekler. TypeScript, sade JavaScript’e derlenir ve böylece JavaScript çalıştıran herhangi bir ortamla uyumlu hale gelir.
Neden TypeScript’i Seviyorum?
Yazılım geliştirmede tür bazlı dillerin avantajlarını daha iyi anlamak için TypeScript’in özelliklerini aşağıda sıralıyorum:
- Erken Hata Tespiti: Tür bazlı diller, derleme aşamasında türle ilgili hataları yakalayarak çalışma zamanı hatalarının oluşma olasılığını azaltır. Bu, daha güvenilir ve kararlı bir kodlamaya yol açar.
- Geliştirilmiş Kod Kalitesi: Belirgin türler ile kod, daha kendi kendine anlaşılır bir hale gelir, bu da genişletilmesini ve bakımını kolaylaştırır. Tür sistemi, verinin yapısını ve davranışını düşünmeleri için geliştiricileri teşvik eden bir disiplini zorunlu kılar.
- Daha İyi Araç Desteği: Tür bazlı diller, otomatik tamamlama, yeniden yapılandırma araçları ve statik analiz gibi daha gelişmiş IDE özelliklerini mümkün kılar. Bu, geliştirici verimliliğini artırır ve hataların önlenmesine yardımcı olur.
- Artan Okunabilirlik ve Belgelenme: Türler, bir tür belge niteliği taşır ve yeni geliştiricilerin veya eski koda tekrar bakıldığında kod tabanını daha kolay anlamalarını sağlar. Fonksiyonlardan beklenen ve döndürülen veri türleri nettir.
- Optimize Edilmiş Performans: Değişkenlerin türü derleme zamanında bilindiği için, tür bazlı diller derleyici tarafından daha kolay optimize edilebilir. Bu, çalıştırma zamanında dinamik olarak tiplendirilmiş dillere kıyasla daha iyi performans sağlayabilir.
- Daha Güvenli Yeniden Yapılandırma (Refactoring): Kod değiştirildiğinde, tür bazlı diller etkilenmiş alanların doğru bir şekilde güncellenmesini sağlar. Derleyici, uyumsuzlukları veya uygunsuz değişiklikleri yakalar, bu da yeniden yapılandırma sırasında hata yapma riskini azaltır.
- Gelişmiş İşbirliği: Büyük ekiplerde, tür bazlı diller kod tabanı genelinde tutarlılık ve açıklık sağlanmasına yardımcı olur. Fonksiyonlar ve değişkenlerin ne yapması gerektiğine dair belirsizliği azaltır, böylece işbirliği daha karmaşık olmaktan çıkar.
- Daha Kolay Test: Türler testlerin yerini almasa da, belirli hata türlerinin oluşamayacağını garanti ederek test edilmesi gereken kapsamı azaltır. Bu, geliştiricilerin daha karmaşık test senaryolarına odaklanmasına olanak tanır.
En Hızlı JavaScript Kodunu veya Uygulamasını Nasıl Elde Edebilirsiniz?
İnternet, bazen bir kütüphanenin üzerine inşa edildiği dilden daha hızlı olabileceğini iddia eden, kendini uzman ilan etmiş kişilerle doludur. Bu, kullanım durumlarının %99.99’u için neredeyse her zaman yanlıştır. En hızlı JavaScript kodunu arıyorsanız, bu sadece vanilla JavaScript ile mümkündür, herhangi bir kütüphane veya çerçeve (framework) olmadan—nokta.
Vanilla JavaScript Kullanmalı mıyız?
TypeScript kullanmaya ilk başladığımda, herhangi bir kütüphane kullanmadan TypeScript ile bazı küçük uygulamalar yazmaya karar verdim. Bu yaklaşım, deneyimli bir geliştirici olmama rağmen, JavaScript’e daha derinlemesine dalmama yardımcı oldu.
Vanilla JavaScript Kullanmanın Avantajları
- Performans: Vanilla JavaScript, kütüphane ve çerçevelerle ilişkili ek yükleri önleyerek en iyi performansı sunabilir. Bu, performansın kritik olduğu uygulamalar için çok önemli olabilir.
- Öğrenme Fırsatı: Vanilla JavaScript ile kod yazmak, dilin ve temel kavramlarının anlaşılmasını derinleştirebilir, becerilerinizi ve bilginizi geliştirir.
- Azaltılmış Bağımlılıklar: Harici kütüphane ve çerçevelerden kaçınmak, yönetilmesi gereken daha az bağımlılık anlamına gelir; bu, projenizi basitleştirir ve potansiyel çakışmaları azaltır.
- Özel Çözümler: Kodu tamamen kontrol ederek, kütüphanelerin kısıtlamaları veya tasarım tercihleriyle sınırlanmadan, ihtiyaçlarınıza özel çözümler üretebilirsiniz.
Ancak, er ya da geç, mevcut kütüphaneler tarafından zaten çözülmüş problemlerle karşılaşacaksınız. Kütüphane kullanmadan kod yazmak en hızlı kod yürütmeyi sağlayabilir, ancak bu mutlaka en verimli geliştirme yöntemi değildir.
Vanilla JavaScript Kullanmanın Dezavantajları
- Geliştirme Hızı: Çerçeveler ve kütüphaneler genellikle geliştirmeyi önemli ölçüde hızlandırabilecek önceden oluşturulmuş bileşenler ve yardımcı programlar sağlar. Bu özellikleri vanilla JavaScript ile yeniden yazmak zaman alıcı olabilir.
- Bakım Kolaylığı: Çerçeveler ve kütüphaneler genellikle en iyi uygulamaları ve tasarım mimarilerini kullanır, bu da daha sürdürülebilir ve ölçeklenebilir koda sahip olmanızı sağlar. Vanilla JavaScript bu yazılım tasarım mimari yaklaşımlardan yoksun olabilir, bu da bakımı daha zor hale getirebilir.
- Topluluk ve Ekosistem: Çerçeveler, geliştirmeyi kolaylaştıracak destek, eklentiler ve araçlar sunan güçlü topluluklar ve ekosistemlerle birlikte gelir. Vanilla JavaScript, bu kaynaklardan yoksundur.
- Tekerleği Yeniden İcat Etmek: Mevcut kütüphane ve çerçeveler birçok yaygın problem ve özelliği çözmüş ve optimize etmiştir. Bu çözümleri saf JavaScript ile yeniden uygulamak, gereksiz çaba ve potansiyel sorunlara yol açabilir.
Çözüm: Tay
Çözüm, jQuery fonksiyonları ve komutlarından ilham alarak “az yaz, çok yap” felsefesini benimsemek ve bunu TypeScript’te uygulamaktır. TypeScript’in tür güvenliği ve yapısını kullanırken jQuery’de animasyon gibi gereksiz karmaşıklıklardan kaçınarak, geliştirme hızı, bakım kolaylığı ve kod yürütme performansı arasında bir denge sağlayabilirsiniz.
Bu nedenlerle Tay kütüphanesini geliştirdim ve sonuçlar şöyle:
- Sıkıştırılmış dosya boyutunun sadece 1KB olmasıyla küçük boyutu, hızlı indirilmesini ve kısa sürede kullanıma hazır olmasını sağlar.
- jQuery’ye kıyasla daha hızlı yürütme süresi.
- TypeScript’in ES5 veya ES6’ya derleme yeteneği sayesinde farklı tarayıcılar arası uyumluluk.
- Kendini kanıtlamış jQuery yöntemlerinden yararlandığı için daha az kod yazma süresi.
Tay MVC Mimarisine Mi Sahip?
Tay’ı yazmadan önce, MVC (Model-View-Controller) mimarisini düşündüm ve hatta bir MVC yapısı geliştirmeye başladım. Ancak, hızın çok önemli olduğu bir ön yüz uygulaması için MVC’nin fazla karmaşık olabileceği sonucuna vardım.
Arka uç (backend) geliştirmede, kodu MVC mimarisiyle birden fazla dosyaya ayırmak bakım kolaylığını artırabilir. Ancak ön yüz geliştirmede, performans önceliklendirildiğinde bu yaklaşım en iyi uygulama olmayabilir. Örneğin, Angular gibi 5-7 yıl önce MVC ilkelerine uygunlukları nedeniyle popüler olan çerçeveler oldukça büyük boyutlu hale geldi, bu da optimal hız gerektiren uygulamalar için ideal değildir.
Peki ya Nesne Yönelimli Programlama (OOP)?
Nesne Yönelimli Programlama (OOP), gerçekten değerli bir yaklaşımdır ve TypeScript ile modern JavaScript standartlarını takip eden sınıflar yazabilir ve bunları nesne tabanlı sınıfları desteklemeyen ES5’e aktarabilirsiniz. OOP, dosya boyutunu minimal tutarken kodun bakımını kolayştırır.
Ancak, Tay OOP kullanımını zorunlu kılmaz; bu, isteğe bağlı veya önerilen bir yaklaşımdır. Projenize uygunsa OOP prensiplerini kullanabilirsiniz, ancak Tay, gerektiğinde diğer kodlama stillerine izin vererek esnekliğini korur.
Neden Tay’ı e-ticaret için öneriyorum?
E-ticaret web siteleri için kurtarılan her milisaniye daha fazla satış ve artan organik trafiğe dönüşür. İşte e-ticaret siteleri için avantajlar listesi:
- Performans Etkisi: E-ticarette, daha hızlı yükleme süreleri doğrudan kullanıcı deneyimini etkiler. Kurtarılan her milisaniye, daha yüksek dönüşüm oranlarına ve daha düşük çıkış oranlarına yol açarak daha fazla satışa dönüşebilir.
- Kullanıcı Deneyimi: Web uygulamasındaki etkileşimleri hızlandırmak ve gecikmeyi azaltmak, genel kullanıcı deneyimini iyileştirir. Bu, potansiyel müşterileri meşgul ve memnun tutmak için çok önemlidir.
- SEO Avantajları: Arama motorları hızlı yüklenen web sitelerini sıralamalarında önceliklendirir. Daha hızlı bir site, arama motoru görünürlüğünüzü artırabilir, e-ticaret mağazanıza daha fazla organik trafik çekebilir.
- Rekabet Avantajı: Rekabetçi e-ticaret ortamında, küçük performans iyileştirmeleri bile sitenizi rakiplerinizden ayırabilir. Daha hızlı web siteleri, müşteri çekme ve elde tutma olasılığı daha yüksek olanlardır.
- Sunucu Yükünü Azaltma: Optimize edilmiş kod, sunucu yükünü azaltarak barındırma maliyetlerinden tasarruf sağlar ve trafik artışları sırasında daha iyi ölçeklenebilirlik sunar.
- Artan Mobil Performans: E-ticaret trafiğinin önemli bir kısmını oluşturan mobil kullanıcılar, daha hızlı yükleme sürelerinden faydalanır. Bu, daha yüksek mobil dönüşüm oranlarına yol açabilir.
Tay Nasıl Kullanılır?
Copied!t(".benimsinifim").addClass("ornek"); myElement.parent().find(".switch").toggleClass("ornek");