12 Kasım 2007

Static Metotlarla AJAX Sayfalarını Daha da Hızlandırın!

ASP.NET AJAX istemci ve sunucu merkezli çalıştığı için mimarisi gereği sayfada asenkron postback işlemi başlatsak dahi sunucu tarafında sayfamızın yaşam döngüsü tam olarak çalışmakta ve sayfa baştan itibaren üretilmekte, fakat istemciye sadece UpdatePanel'in içeriği gönderilmektedir. Bu işleyiş aslında kötü bir durum gibi gözükse de ASP.NET sayfa mimarisi açısında gerekli bir işlemdir ki; çoğu noktada faydalarını da görebiliriz. Olayın diğer tarafına bakacak olursak sayfanın sunucu tarafında baştan üretilmesi biraz da olsa yavaşlığa sebep olacaktır. Eğer sayfanızda bir kontrolün içeriğini asenkron olarak güncellemek ve bu işlemi hızlı bir şekilde yapmak istiyorsanız sunucu tarafında çalışacak static metotlar oluşturarak istemci tarafında hazırlayacağınız basit JavaScript fonksiyonlarıyla da asenkron güncelleme işlemini gerçekleştirebilirsiniz. Metot static olduğu için sunucuda sayfanın nesne örneği üretilmeden de çağrılabilir bir metot olacaktır. Metot ile ilgili en önemli husus ise System.Web.Services isim alanı altındaki WebMethod niteleyici (attribute) sınıfını uygulaması gerekeceğidir. Böylece istemcide hazırlanan JavaScript fonksiyonu bu metodu asenkron olarak çağırabilecektir. Metot HTML içeriği güncelleyeceği için string değer döndürmelidir. Aşağıda sayfamızın code-behind kısmına yazabileceğimiz örnek metot bulunmaktadır.

[System.Web.Services.WebMethod]
public static string KareKok(int sayi)
{
    return Math.Sqrt(sayi).ToString();
}

Gelelim istemci tarafında yapacaklarımıza. Burada en ilgi çekici durumlarımızdan birisi UpdatePanel'e ihtiyaç duymadan da bu işlemi yapabilmemiz. Bir diğer ayrıntımız ise ScriptManager ile ilgili. Sunucu tarafında yazılmış WebMethod attribute'unu uygulayan static metodu çağırabilmemizi sağlayan PageMethods isimli JavaScript fonksiyonunu kullanabilmek için ScriptManager'ın EnablePageMethods özelliğini true olarak ayarlamamız gerecektir. Yine istemci tarafında çalışacağımız için sunucu kontrolleri yerine HTML kontrolleri kullanmamız da herhangi bir sakınca yok. İstemci tarafında hazırladığım kodları aşağıda görebilirsiniz.

<head runat="server">
    <title>Untitled Page</title>
    <script language="javascript">
        function AsenkronMetotCagir()
        {
            // Sunucudaki static metodu çağırıyoruz. Sonucu IslemBitti metoduna iletiyoruz
            PageMethods.KareKok(form1.txtSayi.value, IslemBitti);
        }

        function IslemBitti(deger)
        {

            // İşlemin sonucunu sonuc adındaki span etiketine yazdırıyoruz
            document.getElementById('sonuc').innerHTML = deger;
        }

    </script>
</head>
<body>
<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" />
    <input type="text" id="txtSayi" />
    <input type="button" value="Karekök Bul" onclick="AsenkronMetotCagir();" />&nbsp;<br />
    <span id="sonuc"></span>
</form>
</body>

Bu şekilde sunucu tarafında sayfanın baştan üretilmesine gerek kalmadan çok daha hızlı bir şekilde asenkron güncelleme işlemleri yapabilmekteyiz. Buradaki en büyük sıkıntılarımızdan birisi ise HTML kodunu kendimizin oluşturması gerekeceğidir. Eğer gridview, detailsview gibi kompleks bir kontrolün çıktısını elde etmek istiyorsak ilgili kontrolleri programatik olarak oluşturup RenderControl metodu ile de HTML çıktılarını istemciye yine static metot aracılığıyla gönderebiliriz.

Hiç yorum yok: