肥大的前端框架

前端技術近年來大爆發,各種優秀前端框架孕育而生:jQuery、jQuery UI、KendoUI、Modernizr、Bootstrap、Responsive、Knockout、AngularJS、RequireJS等等。但不管是CSS Framework或JavaScript Framework,雖然帶來強大的功能也不斷加大網頁的大小。大量使用各種前端框架頁面,還有一個問題,那就是不斷增加HTTP要求(HTTP Request)數量。


當FriendlyUrls偵測到要求是來自行動設備時,會自動採用同一支程式的Mobile版本。如圖12,Site.Master是正常版本,當有個要求來自行動設備,就會採用Site.Mobile.Master;ASPX應用程式也是相同原理,例如Default.aspx,我們可以設計Default.Mobile.aspx提供給行動設備使用。

一般:Site.Master

行動:Site.Mobile.Master

 

一般:Default.aspx

行動:Default.Mobile.aspx

 

上吧,HTML5隊長

HTML5協定已經是未來網站發展確定的方向,Visual Studio 2013對於HTML5的支援度相當完整,Web Forms也以此為基礎進行改良,TextBox控制項提供TextMode屬性讓Web Forms開發者非常簡單就能選用各種HTML5表單屬性:

<div>
  Color:
  <asp:TextBox runat="server" TextMode="Color"></asp:TextBox>
  <br />
  Date:
  <asp:TextBox runat="server" TextMode="Date"></asp:TextBox>
  <br />
  DateTime:
  <asp:TextBox runat="server" TextMode="DateTime"></asp:TextBox>
  <br />
  DateTimeLocal:
  <asp:TextBox runat="server" TextMode="DateTimeLocal"></asp:TextBox>
  <br />
  Email:
  <asp:TextBox runat="server" TextMode="Email"></asp:TextBox>
  <br />
  Month:
  <asp:TextBox runat="server" TextMode="Month"></asp:TextBox>
  <br />
  Multiline:
  <asp:TextBox runat="server" TextMode="MultiLine"></asp:TextBox>
  <br />
  Number:
  <asp:TextBox runat="server" TextMode="Number"></asp:TextBox>
  <br />
  Password:
  <asp:TextBox runat="server" TextMode="Password"></asp:TextBox>
  <br />
  Phone:
  <asp:TextBox runat="server" TextMode="Phone"></asp:TextBox>
  <br />
  Range:
  <asp:TextBox runat="server" TextMode="Range"></asp:TextBox>
  <br />
  Search:
  <asp:TextBox runat="server" TextMode="Search"></asp:TextBox>
  <br />
  SingleLine:
  <asp:TextBox runat="server" TextMode="SingleLine"></asp:TextBox>
  <br />
  Time:
  <asp:TextBox runat="server" TextMode="Time"></asp:TextBox>
  <br />
  Url:
  <asp:TextBox runat="server" TextMode="Url"></asp:TextBox>
  <br />
  Week:
  <asp:TextBox runat="server" TextMode="Week"></asp:TextBox>
  <br />
</div>

註:呈現與各種效果依瀏覽器與瀏覽器版本有所不同。

另外強烈推薦安裝Visual Studio 2013的Web Essentials擴充套件,它可以讓我們在開發各種HTML5、CSS3、JavaScript時可以如虎添翼。

註:Web Essentials 2013 RTM now available

結語

Web Forms經過十多年的淬煉已經有非常良好的基礎,但也有”歷史包袱”,但ASP.NET開發團隊並不以此為藉口,反而努力找出方法為了讓Web Forms開發技術也能具備現代化網站開發能力,其中像是不再依賴ViewState的控制項更是一大突破。

另一方面,ASP.NET MVC框架在網站開發技術上獲得的成功,讓ASP.NET開發團隊思考向ASP.NET MVC借用其成功經驗與技術,將ASP.NET MVC優良的技術導入Web Forms開發技術之內,整合Model Binding、Bundling and Minification、ASP.NET Routing等技術的Web Forms,開發現代化網站,No problem!:D

 

—————————————————————————————————————————-

如何訂閱MSDN電子報?
請登入您的LiveID之後,勾選 台灣微軟 MSDN 程式開發人員電子報
———————————————————————————————