最新微軟Ajax庫更新 新功能概覽
前日，ASP.NET開發(fā)團隊發(fā)布了Microsoft Ajax Library的一個重大更新版本(第六個預(yù)覽版)。這個更新版本包括了我們客戶端AJAX庫的一堆新的功能和改進，可用于ASP.NET的任何一個版本(包括ASP.NET 2.0, 3.5 和 4.0)，可用于ASP.NET Web Forms 和 ASP.NET MVC項目。今天的發(fā)布包括下述主要改進：
- 更好的命令式（Imperative）句法: 用于創(chuàng)建客戶端控件的新的簡化代碼句法
- 客戶腳本裝載器（Client Script Loader）: 一個新的客戶端腳本裝載器，可以自動地動態(tài)裝載客戶端控件或庫所需的所有JavaScript文件，同時按正確的順序執(zhí)行腳本。
- 更棒的jQuery集成: 所有的Microsoft Ajax控件現(xiàn)在自動呈示為jQuery插件。
除了客戶端腳本庫改進外，今天我們還發(fā)布了一個新的Microsoft AJAX腳本縮小器（Minifier）工具（免費），這個工具允許你通過減少JavaScript文件的大小，顯著地改進你網(wǎng)站的性能。該工具可以命令行工具的形式運行，也發(fā)布有Visual Studio MSBuild任務(wù)，你可以將其與你的VS項目集成，在編譯時，自動地縮小JavaScript文件。
使用Microsoft AJAX庫 (第六個預(yù)覽版)
使用Microsoft AJAX庫(第六個預(yù)覽版)發(fā)布開始建造應(yīng)用，有以下兩種方式：
1) 你可以訪問 ASP.NET CodePlex網(wǎng)站，下載第六個預(yù)覽版（內(nèi)含一大堆例程）。
2) 或者，你也可以直接使用Microsoft Ajax 內(nèi)容分發(fā)網(wǎng)絡(luò) (CDN)上的Microsoft Ajax庫腳本， 可以在.aspx 或 .html網(wǎng)頁中加入下述腳本標(biāo)識來做：
- <script src=”http://ajax.microsoft.com/ajax/beta/0910/Start.js” type=”text/javascript”></script>
想了解Microsoft AJAX CDN的話，閱讀一下我上個月的博客貼子，或者訪問http://www.asp.net/ajax/cdn。
該發(fā)布中更好的命令式代碼句法
ASP.NET開發(fā)團隊聽到了社區(qū)的反饋，在創(chuàng)建客戶端控件時，許多開發(fā)人員更喜歡命令式（imperative）的代碼方式（較之于聲明式的句法方式）。在今天的發(fā)布中，我們引進了一個簡單的命令式代碼句法來創(chuàng)建客戶端控件，并與網(wǎng)頁中的HTML元素進行綁定。該句法將得到VS 2008 和 VS 2010中的JavaScript Intellisense的完整支持。
下面是你現(xiàn)在可以編寫的命令式代碼的一個例子，用編程的手法創(chuàng)建一個客戶端DataView控件，顯示來自WCF web服務(wù)的數(shù)據(jù)：
上面的代碼生成一個新的Microsoft Ajax DataVie控件，將該控件附于一個id為“imageView”的HTML <div>元素。WCF服務(wù)的URL是由“dataProvider”屬性指定的，服務(wù)上的調(diào)用方法名是由“fetchOperation” 屬性指定的，“autoFetch”屬性表示在控件裝載時應(yīng)該自動與WCF服務(wù)進行綁定。
下面是DataView控件所依附的“imageView” HTML <div>元素的標(biāo)識，該<div>內(nèi)含一個模板，用于顯示從服務(wù)中獲取的每個數(shù)據(jù)項（注：模板是我們在Microsoft Ajax以前一個預(yù)覽版本中引入的）：
上面模板中的 {{ Uri }} 和 {{ Name }} 表達式將為從服務(wù)中獲取的圖片的 Name 和 Uri屬性所替代，<img>元素上的屬性命名空間前綴 “sys:src”是用來防止瀏覽器試圖在實際的路徑 {Uri} 上裝載圖片的。 在模板裝載時，sys:src屬性的值將被插入src屬性中。
該網(wǎng)頁在瀏覽器中顯示時，我們將得到象下面這樣的一個簡單相片陳列室：
或者，如果你不想在模板中使用聲明式綁定句法的話，你可以把模板修改為象下面這樣的純HTML標(biāo)識（不含{{ }}表達式）：
然后在創(chuàng)建DataView控件時，你可以象下面這樣，連接和指定一個itemRendered 事件處理函數(shù)：
然后， 你可以使用下面的JavaScript，實現(xiàn)“imageRendered” 事件處理， 使用 Sys.bind() 方法，用編程的手法 將值賦給模板中的 <img> and <span> 標(biāo)識：
這允許你將你的模板保持為純HTML標(biāo)識，而在運行時提供顯示同樣的相片陳列室的體驗。
使用Microsoft Ajax 客戶腳本裝載器（Client Script Loader）
Microsoft AJAX客戶端腳本庫現(xiàn)在分成了多個JavaScript文件，允許你只下載和使用你實際需要的那些腳本文件（也減小了下載大小）。
但手工添加使用Ajax控件所需的所有腳本文件是很枯燥的，而且也容易出錯。為方便使用客戶端控件以及單獨的客戶端腳本庫組件，我們在今天的發(fā)布中引進了一個新的客戶端腳本裝載器（client script loader）。這個裝載器可以幫你自動地裝載一個控件所需的所有腳本文件，同時在頁面裝載時，按正確的順序執(zhí)行這些腳本。
例如，下面這個頁面用了客戶端腳本裝載器裝載“watermark”（水?。┛丶璧乃心_本，然后將watermark控件連接到一個<input>文本框上：
注意一下上面的Sys.require()方法調(diào)用。在調(diào)用Sys.require()時，你提供你想裝載的客戶端組件的名稱（或者客戶端組件名稱的數(shù)組）。然后， sys.require()客戶端裝載器就會自動地并行下載所需的所有腳本文件 （允許你的腳本較快地裝載，還允許你避免阻塞頁面的顯示）。在所要求的組件所需的所有腳本裝載完畢后，Sys.onReady() 就會被調(diào)用，生成一個watermark。
在上面，我們將“watermark”控件綁定到了一個id為 “name”的 <input> 文本框。在運行時，watermark 控件會導(dǎo)致文本框有一個watermark（水?。ㄔ谟脩魧⒐鈽?biāo)設(shè)置到文本框，開始鍵入文字時會自動消失）：
客戶端腳本裝載器支持許多高級的功能，包括自動腳本合并和懶式裝載，還能聰明地決定下載腳本庫的調(diào)試或者正式版本。還允許你通過使用Sys.require()句法，注冊自己的腳本庫，自動地裝載它們。
將Microsoft Ajax 腳本庫控件與jQuery結(jié)合使用
Microsoft將jQuery作為ASP.NET MVC框架的一個標(biāo)準(zhǔn)組件發(fā)布，還將在Visual Studio 2010中，將其默認(rèn)加入新創(chuàng)建的ASP.NET Web Forms項目中。
在今天的預(yù)覽版中，我們將方便 jQuery 和 Microsoft Ajax 控件的集成，允許使用jQuery的開發(fā)人員通過熟悉的 jQuery 插件 API句法來使用Microsoft Ajax控件。特別地，我們現(xiàn)在將把所有的Microsoft Ajax控件自動地呈示為 jQuery 插件。也就是說，在你往網(wǎng)頁上加jQuery時，你可以象使用jQuery插件那樣使用Microsoft Ajax控件。
例如，下面的腳本示范了如何使用jQuery來創(chuàng)建一個DataView以顯示來自WCF服務(wù)的數(shù)據(jù)（使用了jQuery插件那樣的代碼句法）：
注意上面，我是通過調(diào)用Sys.require()客戶端裝載器API來裝載jQuery的。你可以使用新的客戶端腳本裝載器來裝載jQuery，或者，你也可以使用標(biāo)準(zhǔn)的 <script>標(biāo)識來將jQuery腳本庫包含在頁面中。
在jQuery加到頁面中后，Microsoft Ajax腳本庫控件自動呈示為jQuery插件。這意味著，你可以使用標(biāo)準(zhǔn)的jQuery插件句法來創(chuàng)建和依附Microsoft Ajax控件（就象上面那樣），并與jQuery的選擇器（selector）句法完美集成。
使用Microsoft Ajax Minifier減小JavaScript文件大小
大家用來減小JavaScript文件下載大小的常見的方式有2種： 壓縮（compression）和縮?。╩inification）。
在Windows服務(wù)器上使用IIS 7.0來宿主你的網(wǎng)站時，你可以配置IIS來自動地使用GZIP壓縮算法來壓縮你的JavaScript文件，這在性能和文件的下載大小方面提供顯著的改進。但是，你可以同時通過壓縮和縮?。╩inifying）你的JavaScript文件來得到附加的性能好處。Steve Sounders在他的優(yōu)秀圖書《High Performance Web Sites》中描述了這些附加好處。
除了發(fā)布MMicrosoft Ajax 腳本庫 (第六個預(yù)覽版)外，今天我們還發(fā)布了一個新的免費Microsoft Ajax Minifier工具，該工具可以幫你顯著減小你的JavaScript文件的大小。該工具是由MSN開發(fā)團隊的Ron Logon創(chuàng)建的，你可以在ASP.NET CodePlex網(wǎng)站上免費下載Microsoft Ajax Minifier。
下面的屏幕截圖示范了使用諸如Douglas Crockford 的 JSMin, Dean Edward 的 Packer, 和 YUI Compressor 對標(biāo)準(zhǔn)的jQuery腳本庫進行縮小后的結(jié)果。最下面的2個文件是用了Microsoft Ajax Minifier工具縮小后的。注意，Microsoft Ajax Minifier把jQuery的大小從125 KB 減小到了只有 53 KB之大。
Microsoft Ajax Minifier支持2個級別的縮?。撼Ｒ?guī)級，以及超級壓扁（hypercrunched）級。在使用常規(guī)級縮小時，Microsoft Ajax Minifier除去所有不必要的空白，注釋，花括號和分號。在啟用超級壓扁（hypercrunched）級時，Microsoft Ajax Minifier會全力減小JavaScript文件大小，它會縮小局部變量名稱，除去調(diào)用不到（unreachable）的代碼。
下面是一個JavaScript文件例子：
下面是用Microsoft Ajax Minifier(啟用了超級壓扁級別)縮小后的JavaScript文件：
注意，所有不必要的空白都被除去了，還注意，函數(shù)的參數(shù)firstValue和 secondValue 被重新命名為b 和 a了。
Microsoft Ajax Minifier下載包含了下述組件：
- ajaxmin.exe – 縮小JavaScript文件的命令行工具
- ajaxmintask.dll – 在Visual Studio項目中縮小JavaScript文件的MSBuild任務(wù)
- ajaxmin.dll – 可用在C# 或 VB.NET 應(yīng)用中縮小JavaScript文件的組件
在安裝Microsoft Ajax Minifier之后，你可以使用Microsoft Ajax Minifier命令行工具在控制臺命令行上縮小JavaScript文件。
你也可以選擇將Microsoft Ajax Minifier作為一個自定義的MSBuild任務(wù)加到 Visual Studio中去。將該MSBuild任務(wù)加到你的Visual Studio項目文件中去，允許你在任何時候編譯時，自動地縮小所有的JavaScript文件，允許你以自動化的方式進行縮小操作。
結(jié)束語
今天的Microsoft Ajax腳本庫發(fā)布給客戶端開發(fā)人員帶來了若干個令人興奮的新功能。新的簡化命令式句法應(yīng)該對JavaScript開發(fā)人員有吸引力。客戶端腳本裝載器極大地方便了客戶端控件的創(chuàng)建和文件下載的優(yōu)化。另外，jQuery集成也允許使用jQuery的開發(fā)人員來利用Microsoft Ajax腳本庫的客戶端控件，模板化和數(shù)據(jù)訪問功能，而不必改變他們的編程風(fēng)格。
最后，新的Microsoft Ajax Minifier也允許你通過減小JavaScrip文件的大小來顯著地改進你的Ajax應(yīng)用的性能。你可以在命令行上使用該工具，或者在Visual Studio中編譯項目時使用。
閱讀Bertrand Le Roy關(guān)于第六個預(yù)覽版的博客貼子，更多地了解今天的發(fā)布的詳情。 點擊這里下載 Microsoft Ajax 腳本庫 (第六個預(yù)覽版) 和新的 Microsoft Ajax Minifier。
希望本文對你有所幫助，
Scott
【編輯推薦】
