jQuery (ve diğerlerini) Google üzerinde barındırmak için 3 neden

Genelde jQuery (ve diğerleri de) framework’ünü kullanmak için aşağıdakine benzer bir kod bulunur.

<script type="text/javascript" src="/js/jQuery.min.js"></script>

Eğer yerel bir sunucuda çalışıyorsanız her şey iyi ve güzel. Ama bunun yanında halka açık bir web sunucusunda Google’ın ajax api’sini kullanmanın bazı avantajları var.

Düşük Gecikme (Latency) Süresi
Javascript Framework’ünüzü Google üzerinden kullanmanın en büyük avantajlarından biri Google’ın yüksek hızlı CDN’i sayesinde scriptlere global ve hızlı ulaşım. Bu durumda kullanıcılar dosyaları Google üzerinden sizin sunucunuzdan indirebileceklerinden daha hızlı indirebilirler.

Paralellik
Bazı Internet tarayıcıları sunucuları gereksiz yere meşgul etmemek için bir sunucya yapılan paralel istekleri sınırlarlar. Dolayısı ile framework’ü başka bir yerde barındırmak sunucunuz açıından en azından bir eksik istek demektir.

Daha iyi önbellek
Herhalde Ajax dosyları için Google’ın içerik teslim servisini kullanmanın en büyük avantajından biri de belki kullanıcının dosyaları indirmesine gerek kalmaması.
Bir ziyaretçi sizin sitenize ait olan jQuery dosyasını en azından bir kere (sunucu caching ayarlarına göre belki de daha fazla) yüklemek zorunda. Kullanıcının diskinde birbirinin aynısı bir çok jQuery kaynak dosyası olabilir. Buna rağmen her yeni site için bunları tekrar indirmek zorunda.

Öte yandan Google üzerinde barındırılan dosyalar için kaç site olursa olsun bunu sadece bir kere indirmiş olacak.
Bunun iki yolu var. Birisi Google Api’si kullanarak…

<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript">// <![CDATA[
// bu arada 1.3 yazarsanız, 1.3'ün en son sürümünü
// yüklemiş olursunuz
google.load("jquery", "1.3.2");
google.setOnLoadCallback(function() {
//kod...
});
// ]]--> </script>

Diğer yöntem ise doğrudan dosyanın URL sini girerek.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
</script><!--[CDATA[
$(document).ready(function() {
// kod...
});
// ]]>

Bu yazı anında Google aşağıdaki Javascript kütüphanelerini destekliyor…

  • jQuery
  • jQuery UI
  • Prototype
  • script_aculo_us
  • MooTools
  • Dojo
  • SWFObject
  • Yahoo! User Interface Library (YUI)
  • Ext Core

Daha detaylı bilgiye http://code.google.com/apis/ajaxlibs adresinden ulaşabilirsiniz.

Browser içi Web Geliştirme Araçları

Web browserların işe yarayan bir sürü eklentileri var. Bu eklentilerden bir kısmı da web geliştirme ile ilgili. Bu browser (ya da tarayıcı) içi eklentiler sayesinde browser’ınızın içinden çıkmadan bir çok işi halledebilirsiniz.

Kendi kullandığım ve diğer popüler eklentilerin bir listesi.

Firebug

Firebug web geliştirme araçları arasında sanırım en saygın yere sahip uygulamalardan biri. HTML, CSS, DOM ve Javascript’i incelemek ve hataları ayıklamak amacı ile yaratılmış bir eklenti. Ama Firebug’ı asıl üne kavuşturan şey herhalde Javascript ile program yazanların hataları ayıklama yöntemlerini kökten değiştirmiş olması. Artık Javascrit programcıları hataları ayıklamak için alert() fonksiyonundan daha fazlasına sahip. Ayrıca DOM’a müdahele yeteneği ile web sayfasında olabilecek değişiklikleri anında görmenizi sağlıyor.

DOM’u anında değiştirme yeteneği dışında, aynı şeyi CSS ve HTML içinde yapabiliyor. Aynı zamanda ağ hareketlerini de kontrol ediyor ve HTTP bağlantıları hakkında detaylı bilgiler verebiliyor.

Bunların dışında Firebug ile çalışan bir iki eklenti ile çok daha fazlasını da yapabiliyor. Örneğin FirePHP,  PHP ile geliştirilen Ajax uygulamalarında büyük kolaylık sağlıyor. FireScope adlı başka bir eklenti ise HTML ve CSS konusunda referans materyelleri ekleyerek Firebug’ı bir adım daha öne taşıyor.

Yahoo! tarafından geliştirilmiş başka bir eklenti Yslow‘da Firebug üzerinden çalışıyor. Sayfanın front-end içeriğini analiz ederek performansı ile ilgili bilgiler ve bir de not veriyor. (A en iyi F en kötü şeklinde) Ayrıntılı analiz sonuçlarına bakarak sayfanızda tıkanmalara yol açan yerleri görüp bunları düzeltebilirsiniz.

Firebug bir Firefox eklentisi ama diğer tarayıcılarda çalışanlar bu muhteşem eklentinin bazı özelliklerinden yararlanabilirler. Firebug’ın bir ‘lite’ sürümü var. Bu IE, Safari, Opera gibi diğer tarayıcılara da belli ölçüde bir Firebug işlevselliği kazandırıyor.

Web Developer

Web Developer Mozilla tabanlı tarayıcılar (Firefox, Flock, Seamonkey gibi) için bir eklenti. Tarayıcıya bir toolbar ve menu ekliyor. Bir web sitesini incelemek ve hatalarını ayıklamak konusunda çok sayıda seçenek sunuyor.  CSS ve stiller, sayfada bulunan seçiciler hakkında geniş bilgi veriyor.

Bunların dışında CSS’i, Javascript’i resimleri etkisiz hale getirmekten tutun da sintaks kontrolörlerine kadar bir sürü yararlı özelliği de bünyesinde barındırıyor. Formlarla çalışmayı kolaylaştıran bir başka seçeneğe daha sahip. Doğrusu Web Developer’ın o kadar yararlı özellikleri var ki hepsini saymak zor. Firebug kadar popüler başka bir eklenti.

Venkman

Venkman Mozilla’nın kendi Javascript debugger’ının kod adı. Aynı zamanda bir Firefox eklentisi olarak da mevcut. Dolayısı ile karmaşık Javascript programlarında hata ayıklamak için oldukça faydalı bir eklenti.

ColorZilla

ColorZilla basit bir eklenti. Tarayıcının sol alt köşesine bir ikon ekliyor. Bu ikona basınca gezmekte olduğunuz web sitesinde hangi renkler kullanııldığını görüp onların renk kodlarını alabiliyorsunuz. Oldukça basit ama bir o kadar da kullanışlı bir eklenti. Renklerle çalışmayı son derece kolaylaştırıyor.

MeasureIt

ColorZilla renklerle çalışmayı ne kadar kolaylaştırıyorsa MeasureIt de web sayfasında ki uzunluklara çalışmayı o kadar kolaylaştırıyor. Bir web sayfasında istediğiniz yerden istediğiniz yere kadar bir cetvel çekerek oradaki uzunlukların kaç piksel olduğunu size hemen söylüyor. Basit ama son derece faydalı.

FireShot

FireShot bir browser içi görüntü yakalama programı. Browser’ın içinde bulunan görüntüyü yakalayıp, üzerinde değişiklikler yapabilir, yazılar yazabilir, şekiller çizebilir ve onları kaydedebilirsiniz. Firefox ve IE içinde mevcut.

FireFTP

Bir FTP programının bir web geliştiricisi için gerekliliği ortada. Ama dosya transferi işlerinizi tarayıcınızın içinden çıkmadan halletmek istiyorsanız FireFTP tam size göre. Sistem bağımsız olması dışında, FireFTP tam teşekküllü bir FTP yazılımından hiç bir eksiği yok.

HTML Validator

HTML Validator görüntülenen sayfanın HTML kodundaki hatalar olup olmadığını gösteren basit bir yazılım. Tidy ve OpenSP algoritmalarına göre sayfayı kontrol ediyorlar. İki algoritmada Firefox’un içinde bulunduğundan kodunuz başka bir sunucuya gitmiyor.

TamperData

TamperData sunucudan gelen HTTP başlıklarını incelemenize ve aynı zamanda sunucuya gönderilen POST isteklerini değiştirerek müdahale etmenizi sağlayan bir eklenti.

Kısa Kısa…

HackBar: HackBar web sitenizin güvenliğini kontrol etmenizi sağlayan başka bir Firefox eklentisi.

Modify Headers: Sunucuya gönderilen istek başlıklarına (request headers) müdahele etmeniz gerekirse.

HttpFox: Sunucu ve istemci arasından bütün istek ve cevapları izleyen başka bir eklenti.

Siz ne kullanıyorsunuz?

Burada yazdıklarım dışından web geliştiriciler için binlerce farklı tarayıcı eklentisi var. Sizin favori eklentiniz hangisi? Ben Firefox kullandığım için buradaki eklentilerin büyük çoğunluğu Firefox eklentileri. Eğer başka bir browser kullanarak geliştirme yapıyorsanız tarayıcınız içinde kullandığınız favori eklentileri bizimle paylaşın. :)