|
最近使用ASP.NET為公司構建了一個簡單的公共網(wǎng)站(該網(wǎng)站的地址:http://superexpert.com/。在這個過程中,我們使用了數(shù)量很多的免費工具,如果把構建ASP.NET網(wǎng)站的必備工具總結一下,將會是一件十分有趣的事情。這些工具既支持ASP.NET Web Forms又支持ASP.NET MVC。
性能工具
讀了兩本關于網(wǎng)站的前端性能的書(這兩本優(yōu)秀的圖書分別是:《High Performance Web Sites》 和 《Even Faster Web Sites》,作者是Steve Souders)以后,我對網(wǎng)站的前端性能十分敏感。根據(jù)Steve Souders的性能黃金法則:
“首先應該對前端性能進行優(yōu)化,終端用戶的響應時間有80%或更多花費在這方面了。”你可以使用下面這些工具來減少ASP.NET應用程序使用的圖像的尺寸,以及JavaScript文件,CSS文件的體積。
1,Sprite and Image Optimization Framework
在A List Apart的一篇文章中(這篇文章的題目是:CSS sprites: Image Slicing’s Kiss of Death,具體可以參考:http://www.alistapart.com/articles/sprites),首次提到了CSS sprites。當你使用sprites的時候,你需要把一個網(wǎng)站使用的多個圖像合并成為一個單一的圖像。然后,在一個Web頁面中,使用CSS trickery來顯示特定的“子圖像”。
sprites的主要優(yōu)勢是,顯示一個Web頁面的時候,它可以有效地減少請求的次數(shù)。請求一個大圖像比請求多個小圖像快得多。一般來說,通過網(wǎng)線傳輸?shù)馁Y源(圖像,JavaScript文件,CSS文件)越多,你的網(wǎng)站就越慢。
但是,大多數(shù)人都不愿意使用sprites,因為使用sprites需要做很多的工作。你必須要合并所有的圖像,然后編寫合適的CSS規(guī)則來顯示子圖像。微軟的 Sprite and Image Optimization Framework 可以讓我們省去這些繁瑣的工作。這個框架可以自動地為你合并圖像。此外,這個框架還包含一個ASP.NET Web Forms control 和一個ASP.NET MVC helper,它們可以讓顯示子圖像變得更加容易。你可以從CodePlex下載 Sprite and Image Optimization Framework。
下載地址:http://ASPNET.codeplex.com/releases/view/50869
Sprite and Image Optimization Framework是 Morgan McClean 編寫的。在微軟,他的辦公室和我的辦公室緊挨著。Morgan是一個十分聰明的人,他是加拿大的實習生。當他構建這個框架的時候,我們一起討論了那個框架。(據(jù)我所知,他還在繼續(xù)開發(fā)這個框架。)
Morgan給這個框架添加了一些高級的功能。例如,Sprite and Image Optimization Framework支持“image inlining”。當你使用“image inlining”的時候,真正的圖像被存儲在CSS文件中。這是一個“image inlining”的例子:
.Home_StephenWalther_small-jpg
{
width:75px;
height:100px;
background: url(data:image/png;base64,
iVBORw0KGgoAAAANSUhEUgAAAEsAAABkCAIAAABB1lpeAAAAB
GdBTUEAALGOfPtRkwAAACBjSFJNAACHDwAAjA8AAP1SAA
CBQAAAfXkAAOmLAAA85QAAGcxzPIV3AAAKL
s+zNfREAAAAASUVORK5CYII=) no-repeat 0% 0%;
}
NET技術:細數(shù)十大免費構建ASP.NET網(wǎng)站必備工具,轉載需保留來源!
鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯(lián)系我們修改或刪除,多謝。