[ASP.NET]ASP.NET 4.0 Overview-New Features in Microsoft Ajax Library

[ASP.NET]ASP.NET 4.0 Overview-New Features in Microsoft Ajax Library

ASP.NET 4.0 Beta 2跟VS2010 Beta 2推出都1-2個月了,還沒有時間把他的White paper跟IDE裝起來玩一下,今天晚上總算將White paper看了一遍,有興趣的人可以到這個網址看看細節:

ASP.NET 4 and Visual Studio 2010 Web Development Beta 2 Overview

這篇主要針對以下內容進行說明:

New Features in the Microsoft Ajax Library

其實我還是不知道該怎麼來翻譯Imperative Syntax比較好,因為我看Whitepaper還是不了解他想表達的重點,我想我姑且稱之為直覺式的語法好了,如下面這個句子,它的意思是在畫面上找到叫Name的元件,並在上頭加個浮水印(Watermark),裡頭顯示(Text) Add name here…字樣:


Sys.create.watermark("#Name", {WatermarkText: "Add name here..." } );

結果就像這樣:

clip_image002[4]

講真的這應該算是ASP.NET 4.0加的新功能了,可以讓我們簡單的做到上述的功能,我記得之前在點部落有看過一篇自己hard-code寫的文章,這樣是不是簡單多了。

 

這部分提到幾個重點:

    • Automatically loads all resources that are required by a script.
    • Makes sure that each script is loaded only once.
    • Improves performance by loading scripts in parallel and by combining scripts.
    • Supports loading scripts only when they are needed (“lazy loading”).
    • Supports loading third-party scripts like jQuery and your own scripts.

重點在這邊,我們可以透過Sys.require這個function將我們所要用到的function名稱作註 冊,Script loader就會在執行接下來的程式前動態到Server上去載入必要的script到client端,即使我們在aspx中並沒有參考這個js檔:


<script type="text/javascript">
Sys.require(Sys.components.watermark, function() {
Sys.create.watermark("#Name", { 
WatermarkText: "Add name here..." 
});
});
</script>

乍看之下好處不顯著,但其實它的好處就是我們可以不用一開始就載入所有的js檔,可以透過程式去控制,有需要的時候再去載,某些程度可以提高網頁的載入效率。

 

ASP.NET 4.0也提供了Client端的資料存取架構,此架構主要分成三個大模組:

    • Client data controls
    • Client templates
    • Client data context

例如以下這個範例:


<!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>
<title>Movies</title>
<link href="Site.css" rel="stylesheet" type="text/css" />
<script src="Scripts/MicrosoftAjax/start.js" type="text/javascript"></script>
<script type="text/javascript">
Sys.require([Sys.components.dataView, Sys.components.dataContext], function() {
Sys.create.dataView("#moviesView",
{
dataProvider : "Services/MovieService.svc",
fetchOperation: "GetMovies",
autoFetch: true
}
);
});
</script>
</head>
<body>
<h1>Movies</h1>
<ul id="moviesView" class="sys-template">
<li>{{Title}} - {{Director}}</li>
</ul>
</body>
</html>

它的意思就是在Javascript中建立一個dataView,而這個dataView的資料來源 (dataProvider)是一個名為MovieService的WCF服務,透過這個服務來獲得所要的資料,並將資料呈現在moviesView這 個<ul>中,而呈現的格式則以[Title-Director]這樣的格式來呈現每筆資料,所以執行出來的效果如下:

clip_image004[4]

dataView的資料來源可以是下面幾種:

    • ASP.NET (.asmx) Web services.
    • WCF Web services.
    • ADO.NET Data Services.
    • Anything that returns JSON-formatted data.

提供了Client端的Control感覺是很不錯,但總覺得透過{{Title}}-{{Director}}這樣的格式來定義還是不太方便。

 

ASP.NET AJAX嘗試在Client端去實作了類似LINQ to SQL DataContext或Entity Framework ObjectContext classes的功能,這個功能目前我還沒有找到範例可以參考,不過它有提到它支援以下幾個功能:

    • Supports read and write access to database data.
    • Supports identity management and change tracking.
    • Provides support for managing complex links and associations between entities from multiple entity sets or tables.

感覺還是要實際用看看才會知道優點在哪邊,我的VS 2010灌好後執行的效率真的非常的慢,慢到我都沒有什麼耐心了...XD

 

VS 2010新增Web專案或者WebSite後,就會發現在Scripts的目錄中有三個jQuery的js檔,而且也可支援jQuery的Intell-sense,這部分還是需要透過vsdoc.js檔阿。

clip_image006[4]

這部分比較有沒看到讓我覺得比較值得期待的功能,不過我還是覺得在ASP.NET這一塊,微軟應該可以多在 Client-Side多下點苦工,因為目前的網頁Javascript的功能要求愈來愈多,也愈寫愈複雜了,若微軟有又快又輕又簡單的解決方案(我的妄想),應該會大大的加分吧,哈哈。

游舒帆 (gipi)

探索原力Co-founder,曾任TutorABC協理與鼎新電腦總監,並曾獲選兩屆微軟最有價值專家 ( MVP ),離開職場後創辦探索原力,致力於協助青少年培養面對未來的能力。認為教育與組織育才其實息息相關,都是在為未來儲備能量,2018年起成立為期一年的專題課程《職涯躍升的關鍵24堂課》,為培養台灣未來的領袖而努力。