Sayfalarımızın performasını arttırmak için bir kaç ufak öneri
Pazartesi, Mayıs 25, 2009 16:50Geçenlerde Fatih Hayrioğlu sayesinde bir Firebug eklentisi olan ve aynı zamanda Yahoo tarafından yazılmış bir ufak ek paket olan Yslow ile tanıştım.
Daha önce de şu an ne yazık ki adresini hatırlayamadığım bir sitede ufak bir değinmeye denk gelmiştim.
Sayfalarımızda bir kaç önemli ayar yaparak Yslow’dan “A” almamız mümkün. En azından benim fikrimce bunları birer alışkanlık hatta kendi standardımız haline getirmek en doğrusu.
Genelde ilk html yazmaya başlarken genel bir html iskeleti içine kodları yazmaya başlarız. Ben Dreamweaver‘ın isketini kullanıyorum.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> </body> </html>
Tabi herkes bunu kullanmak zorunda değil yada bazıları elle yazmayı tercih edebilir. Ben etmiyorum kısacası 
Hemen konuya devam.
İlk başta benim burada yapacağım şey css dökümanımı sayfaya import etmek oluyor. Bunun için bir kaç yöntem var bu yöntemleri Kadir Günay şu makalesinin başlarında belirtmiş. Ben bu yöntemlerden;
bunu tercih ediyorum çünkü sayfaya kodumuzun daha hızlı import edilmesini sağlıyor ayrıca Yslow‘a göre css dökümanımız sayfamızın başında olmalıymış.
Bir diğer madde de javascript dökümanının sayfanın aşağıda import edilmesi gerektiğiydi. İlk başta garip geldi ama javascript dökümanı import edilmeye başlandığı zaman sayfamızdaki diğer elementlerin yüklenmesini durduruyormuş. Bununla ilgili bir kaç konuya başka bir makalede yer vereceğim. Şimdilik kısa kısa geçiyorum ve bende bundan sonra javascript dökümanlarımı sayfanın sonunda “</body>” etiketinden önce import edeceğim.
Dikkatimi çeken diğer bir madde de background resimlerimizi css sprite ile birleştirmemiz gerektiğini öneriyordu. Yakında css sprite ile ilgili de bir kaç bilgi vereceğim. Sadece şimdilik bütün backgroundların css sprite ile birleştirilmesi gerektiği gibi bir izlenim bırakmak istemediğimden söylüyorum, bu tamamen minimum düzeye indirilmeli yani diyelim ki sitenin genel arkaplan resmi ile bir ikon aynı resim dosyasında olmamalı tabi ki de.
İlgili çeken diğer maddelerde oldu ama diğerlerinin çoğu gözden kaçan şeyleri göstermek içindi yani aynı kodları tekrar yazmayın gibisinden. O yüzden size ve araştırmanıza bırakıyorum diğer maddeleri.
Son olarak ta daha önce çok sayıda tartışmasını gördüğüm bir konu ile ilgili bir madde vardı. Birden fazla olan css dökümanlarının hepsini birleştirin diyordu. Bence de birleştirilmeli çünkü her dökümanın tek tek çağırılması sunucudan ayrı bir istek demek ve ne gerek var hele ki yorum satırı diye bir şey varken
Bunun dışında benim geçenlerde dikkatimi çeken bir şey oldu, eskiden css dosyalarımın ve javascript dosyalarımın adlarını aynı tutardım yani main.css, main.js gibi, ama bir çok iş ile aynı anda uğraşırken örneğin bir kaç ftp birden açıkken veya dosyaları kopyalarken bunların karışıp birbirlerinin üzerine yazılma ihtimalleri çok fazla. Herkes ben düzenliyim dikkat ederim vesaire diyebilir ama insanlık hali diye de bir şey var durduk yere onca kod boşa gitmesin
Sizin ekleyecekleriniz yada söyleyecekleriniz varsa lütfen çekinmeyin