Tesadüfen Javascript ile yazılmış bir Commodore 64 emülatörü ve QBASIC compiler'ı gördükten sonra iyiden yaşlanmaya başladığımı anladım. İlk göz ağrılarım artık scripting dilleri ile bile gerçeklenebilecek kadar teknoloji dışı kalmış :)
Yeni bir Flash-Javascript uygulaması keşfettim. Downloadify isimli uygulama, bir Flash uygulaması ve bu Flash uygulamasındaki bazı fonksiyonları dışarıdan Javascript üzerinden çağırmanızı sağlayan framework'ten oluşuyor.
Uygulamanın amacı, hiç bir server etkileşimi olmaksızın, client üzerinden javascript+Flash kullanarak kullanıcının makinesine dosya yazdırmak. Kullanıcıya gösterilen bir "Save" kutusunun ardından dosya içerisine istediğinizi yazabiliyorsunuz.
Uygulamanın detayları ve (varsa) kısıtları ile ilgili bir uygulama yapmadım, yapabilirsem tecrübelerimi burada paylaşacağım. Girdiğiniz metni, clientside olarak kullanıcını makinesine yazdıran basit bir uygulamayı http://downloadify.info/downloadify/test.html adresinden deneyebilirsiniz.
W3C, bugün (09.12.2009) bir taslak yayınlayarak yeni önerisini sundu. Bu çalışma, javascript yardımıyla kameradan anlık görüntü, mikrofondan ise ses alabilmeyi sağlayacak bir API için yazılan ilk draft.
Çalışma oldukça enteresan ve enteresan olduğu kadar bütün web geliştiricileri heyecanlandıracak türden. Özellikle sosyal ağ platformu çılgınlığının sürdüğü ve şekil değiştirerek sürmeye devam edeceği bu dönemde, böyle bir özellik gerçekten çok farklı hizmetlerin sunulmasında kullanılabilir.
Elbette ki bu tip uygulamalar Flash ile yapılmakta ve yapılacak da. Mesela gerçekten güzel bir (yerli) uygulama olan, üyelik kartınız için gereken fotoğrafı anında çekip kartta size gösteren Müzekart uygulaması gibi. Ancak bu tip işlemlerin, javascript ile çok farklı alanlara ve geliştirici kitlesine yayılacağı da kesin.
Taslağı kabaca incelediğimde, kameradan bir görüntü yakalamak için ihtiyaç duyulacak kod aşağı yukarı şu kadar:
// Create a container div element and append it to the document body.
var container = document.createElement("div");
document.body.appendChild(container);
// The browser viewport width in pixels.
var screenWidth = window.innerWidth;
function successCallback(data) {
for (var i in data) {
var img = document.createElement("img");
img.src = data[i].uri;
// If the image width exceeds that of the browser viewport, the image
// is scaled to fit the screen keeping the aspect ratio intact.
if (data[i].format.width> screenWidth) {
img.style.width = screenWidth + "px";
img.style.height = (data[i].format.height/data[i].format.width)*screenWidth + "px";
}
container.appendChild(img);
}
}
function errorCallback(err) {
alert(err.message + " (" + err.code + ")");
}
// Launch the device camera application and invoke the callback once
// the user exits the camera application.
transactionId = navigator.device.captureImage(successCallback, 1, errorCallback);
Gerçekten ilgi çekici değil mi?
Son olarak tabi ki W3C Taslağına ulaşmak için: http://dev.w3.org/2009/dap/camera
LABjs isimli bir proje (http://labjs.com), web sayfalarına dışarıdan yüklediğimiz (js gibi) dış kaynakların yüklenmesini optimize etmeye yönelmiş bir Javascript kaynağı. Dış kaynakların aynı anda (veya sizin belirteceğiniz bir sıralama ile) yüklenmeye başlamasını sağlayabiliyorsunuz.
Bu tip bir iyileştirmenin Firefox 3.5 ile geldiğini biliyoruz. Kısmen (tarayıcının tanımlayabildiği) ilişkisi bulunmayan kaynaklar aynı anda yüklenmeye başlanarak önemli bir kaynak artışı sağlamışlardı.
Firefox 3.0'da bazı kaynakların yüklenmesi aşağıdaki şekildeyken (16.84 saniye):
Firefox 3.5'te kaynakların yüklenmesi bir miktar hızlanmıştı (10.69 saniye):
Ancak görebildiğiniz gibi hala bazı kaynaklar paralel yüklemeye maruz kalmıyorlar. Bunun sebebi yukarıda bahsetmeye çalıştığım tarayıcının kararverdiği öngereklilik koşulları.
Bu örnekte de LABjs tarafından önceliğe konulmuş dış kaynakların yüklenmesini görebilirsiniz (6.24 saniye):
Görüldüğü gibi LABjs önemli bir performans artışı daha sağlamış oluyor. Konuyla ilgili detaylı bir incelemeyi (resimleri da aldığım kaynak olan) http://blog.getify.com/2009/11/labjs-new-hotness-for-script-loading adresinden okuyabilirsiniz.
Ancak tavsiye, yukarıda belirttiğim sitede yazan uyarılara gözatmadan sistemlerinize entegre etmeyin. Bu uyarıları "Are there any negative side effects?" başlığı altında görebilirsiniz.
Kendim yaptığım testleri derli toplu hale getirebilirsem burada yayınlayacağım...
Bugün artık zengin internet uygulamaları geliştiren her web yazılımcısı, jQuery, Prototype, Dojo, MooTools gibi farklı farklı Javascript kütüphanelerinden birini mutlaka kullanıyor. Hatta artık $ olmadan bir javascript tümcesine başladık mı garip gelir haldeyiz...
Bu kütüphaneler ortada yokken, yada varken ama henüz "experimental" seviyeyi geçmediği dönemlerde, ben ve benim gibi web geliştiriciliği yapan bütün yazılımcıların ağzının suyunun akmasına sebep olan uygulamalar görmeye başladık. Google kaynaklı GMail, Google Maps, Google Docs... gibi uygulamalar gerçekten o gün için hayal gücümüzün sınırlarını zorluyordu.
Gitgide javascript çerçeve çalışmaları ile tanıştıkça artık bu tip uygulamalar hiç birimiz için çok uzak değildi. Ama Google zamanında bunları nasıl yapmıştı? Kendi bir çerçevesi olmadan pure javascript mi yazmıştı? Tabi ki hayır. Bugün dahi halen hiç bir Google uygulaması, yukarıda örneklerini verdiğim bildik javascript kütüphanelerini kullanmıyor.
Bir zamanlar kulaktan kulağa efsane gibi yayılan, daha sonra doğruluğuna emin olduğumuz ama sır gibi saklanan Closure artık Google tarafından açık kod olarak dağıtılmaya başladı.
Şu noktada artık alışkanlıklarımızı değiştirir miyiz, bir jQuery'den bir Prototype'tan vazgeçer miyiz bilemem. Ama işin içinde Google varsa incelemeye değer. İncelediğimde gördüğüm ince zeka örnekleri gerçekten hala çok etkileyici...
Buyrun: http://code.google.com/closure
JS Bin adındaki sistem, yazdığınız javascript kodunun, online olarak nasıl çalışacağını denemenizi sağlıyor. Ayrıca örneklerinizi tek bir tıklama ile kısaltılmış URL'lere indirgeyebiliyorsunuz, bu sayede paylaşma şansınız da oluyor.
En ilgi çekici yanı ise kod yazdığınız kutunun üzerindeki bir açılır menü sayesinde, popüler bütün javascript frameworklerini çalışmanıza tek tıkla dahil edebiliyorsunuz. Bu sayede frameworkler üzerinde de deneme yapma şansınız oluyor. Desteklenen frameworkler:
- jQuery
- Prototype
- script.aculo.us
- YUI
- MooTools
- Dojo
- Ext JS
Özellikle kısa javascriptler denemek istediğinizde, yada bir kod farklı kütüphanelere çevirmek istediğinizde pratik bir araç olabilir.
Buyrun: http://jsbin.com
Bundan bir kaç gün önce, Microsoft'un Ajax Minifier projesiyle ilgili bir post yapmıştım.
Bugün Ajaxian ekibinin, Microsoft Ajax Minifier ile YUI Compressor karşılaştırmasını okudum. İki ürün de birbirlerine üstünlük sağlamıyorlar yazarların yorumlarına göre. Bence YUI Compressor bir adım önde görünüyor. Özellikle sıkıştırdığı/küçülttüğü örnek kodları incelediğinizde, kodu körü körüne küçültmek yerine akışı algılayıp gereksiz tekrarları ve kaynak hebalarını yakalayabildiğini gözlemliyoruz. Bu bile oldukça ilgi çekici :)
Buradan okuyabilirsiniz: http://ajaxian.com/archives/microsoft-ajax-minifier-vs-yui-compressor
Microsoft, AJAX.NET faciasından sonra tekrar bir Ajax kütüphanesi işine girişmiş. Henüz inceleme fırsatım olmadı, Pazartesi incelemeyi umuyorum. Sonra tekrar yorumlarımı yazarım inceleyebilirsem. Ama yorumlardan bakıldığında bu sefer "boyunun ölçüsünü" biliyor gibi görünüyor. jQuery pluginlerine geçiş vs. desteği verdiğine göre, babaları kabul etmiş, kendileri de bir şeyler eklemiş olabilir...
Bunula beraber Microsoft Ajax Minifier'ı test ettim. Bildiğimiz metotlarla Javascript dosyalarında boyut küçültmeye gidiyor. Denediğim JS'leri bozmadan iyi oranda küçülttü. Özellikle hyperchruncing özelliğini de denemenizi tavsiye ederim.
Projeyi CodePlex'ten alabilirsiniz: http://aspnet.codeplex.com/Release/ProjectReleases.aspx?ReleaseId=34488