[原創]全球首款不使用ViewState的Asp.Net2.0控制項陳列庫

來源:互聯網
上載者:User

首先來張:

ViewState在Asp.Net中舉足輕重的作用:

ViewState是Asp.Net的一個非常重要的特性,用來在頁面回傳過程中維護控制項的伺服器端狀態,這樣我們就能方便的在按鈕的點擊事件處理函數中寫代碼:

Label1.Text = TextBox1.Text;

對ViewState的詳細描述一篇經典文章可以參考,相信很多人都看過。簡單概括如下:

1.  頁面第一次載入時,伺服器控制項把自身的屬性儲存在頁面上的一個隱藏欄位 __VIEWSTATE 中.

2.  頁面PostBack時,表單提交的同時 __VIEWSTATE  的值也被提交到後台,Asp.Net會從這個隱藏欄位中恢複這些屬性

在傳統的網站開發中,ViewState的這一工作原理無可厚非,並且極大的簡化了程式員的工作量。但是隨著AJAX的興起,特別是純JavaScript渲染的用戶端介面的應用程式中,

ViewState的實現顯得有點捉襟見肘。

使用ExtAspNet建立的頁面:

在使用ExtAspNet建立的頁面中,所有的頁面內容都是有JavaScript中用戶端渲染的,我們就以下面一個典型的頁面為例:

如果你開啟頁面原始碼,你會發現在<body>和</body>之間除了聊聊幾行HTML代碼外,大部分是伺服器端產生的JavaScript代碼:

不過不用擔心,程式員無需寫這些代碼(這些是ExtAspNet自動產生的),程式員所要關注的就是ASPX標籤和C#代碼:

ViewState在富用戶端應用的缺點:

在上面的例子中,如果繼續使用Asp.Net的ViewState模式,我們來看下會發生什麼事情:

1. 頁面第一次載入,由於頁面上面的富文字框的內容是通過C#代碼設定的,所以這個屬性會出現在 __VIEWSTATE 欄位中:

同時,由於整個頁面是由JavaScript渲染的,這個屬性同樣會傳遞到頁面上的JavaScript指令碼中,如所示:

可見,在頁面第一次載入時就已經有資料重複的問題了。

2. 點擊“Get html editor content”按鈕,會把上面富文字框的內容設定到下面TextArea中,此時的和C#原始碼如下:

我們再來看這次AJAX響應的資料,由於需要把TextArea的資料改變反映到前段,同樣需要更新JavaScript和ViewState兩份資料:

這就又一次的造成了資料轉送的浪費,在一個使用大量伺服器控制項的頁面中,這種浪費有時是驚人的。

放棄ViewState,ExtAspNet怎麼辦?

在一個提倡簡單編程的全新用戶端架構中放棄ViewState,是否就意味著放棄在PostBack中使用C#動作伺服器控制項的便利呢?顯然這是不可能的!

唯一的辦法就是自己實現適合於AJAX資料轉送的ViewState機制,ExtAspNet在這一方面領先一步,建立了全新的XState概念,使得在不放棄PostBack中C#動作伺服器控制項便利的同時,拒絕了任何的資料轉送的浪費。

下面同樣以上面的那個頁面為例,簡單闡述一下在最新的ExtAspNet v2.3.1 版本中,XState的實現過程:

1. 頁面第一次載入,富文字框的資料只在產生的JavaScript有一份,由於不使用ViewState,所以 __VIEWSTATE 只是儲存了一個ControlState的屬性:

2. 點擊“Get html editor content”按鈕,此時AJAX響應資料也沒有重複的部分:

使用ViewState與不使用ViewState的資料對比:

還是上面一個例子,我們分別從頁面第一載入和PostBack的資料轉送量兩個方面著手:

         響應資料(使用ViewState)     響應資料(不使用ViewState)

第一次載入    5068              4922

點擊第一個按鈕  1251              709

附記:

ExtAspNet是一組專業的Asp.net控制項陳列庫,擁有原生的AJAX支援和豐富的UI效果,
目標是建立沒有ViewState,沒有JavaScript,沒有CSS,沒有UpdatePanel,沒有WebServices的Web應用程式。

樣本: http://extasp.net/
開源: http://extaspnet.codeplex.com/

如果你喜愛ExtAspNet,可以通過如下QQ群和大家交流:

ExtAspNet技術交流群1:158028499(已飽和),100人,創始人:sanshi  
ExtAspNet技術交流群2:111870015(已飽和),200人,創始人:愛淘課
ExtAspNet技術交流群3:102333298(已飽和),200人,創始人:愛淘課
ExtAspNet技術交流群4:123899180(已飽和),200人,創始人:愛淘課  
ExtAspNet技術交流群5:105052447(未飽和),500人,創始人:╰☆阿波◆羅
註:
1. 所有群為技術交流,拒絕任何形式的廣告,一經發現,立即踢出群。
2. 如果你想為ExtAspNet貢獻群,請建立後把群號發給我的Gmail郵箱(只接受進階群和超級群,謝謝)。


相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.