網頁

Friday, February 10, 2012

[C#] ASP.NET Html Reducing 網頁瘦身

最近抽空在看如何讓網頁讀取更快速,其中一個小部分是縮小HTML本身的檔案大小,這項還蠻簡單可以達到的,也不需要裝什麼額外的套件,於是就先實作了這塊,我在專案內測過了大部分的頁面,效果還不錯,大約可以減少25%~30%的檔案大小,但是需要注意的是,一些JavaScript會用<--(多行)-->包起來,這種語法就需要修掉,不然其內的js就會被當作註解砍掉了(這其實也可以另外抓出來處理就是)

總之,跟大家分享這個還不錯的方式,我是直接在 master page 去 override Render ,所以只要有吃 master page 就會受到影響,使用上請各自看情況去運用吧,語法如下。

//html reduce
    protected override void Render(System.Web.UI.HtmlTextWriter writer)
    {
        Regex REGEX_BETWEEN_TAGS = new Regex(">\\s+<", RegexOptions.Compiled);
        Regex REGEX_COMMENT = new Regex("\\<![ \\r\\n\\t]*(--([^\\-]|[\\r\\n]|-[^\\-])*--[ \\r\\n\\t]*)\\>", RegexOptions.Compiled);
        Regex REGEX_EXTRA_SPACE = new Regex("\\s+", RegexOptions.Compiled);
        Regex REGEX_COMMENT_SINGLE = new Regex("\\/\\/\\s.*\\r\\n", RegexOptions.Compiled);
        using (HtmlTextWriter htmlwriter = new HtmlTextWriter(new System.IO.StringWriter()))
        {
            base.Render(htmlwriter);
            string html = htmlwriter.InnerWriter.ToString();

            html = REGEX_COMMENT_SINGLE.Replace(html, string.Empty);
            html = REGEX_BETWEEN_TAGS.Replace(html, "><");
            html = REGEX_COMMENT.Replace(html, string.Empty);
            html = REGEX_EXTRA_SPACE.Replace(html, " ");

            html = html.Replace("//<![CDATA[", "//<![CDATA[" + Environment.NewLine);
            html = html.Replace("//]]>", "//]]>" + Environment.NewLine);

            writer.Write(html.Trim());
        }
    }

若有更好或更完善的做法也請跟我說,感謝。

HtmlReduce

順便有圖有真相一下。



3 comments:

  1. 用Gzip就不用壓了,不然你php輸出的檔案怎麼壓

    ReplyDelete
  2. @小強 :

    即使輸出用gzip還是會小一點,不然google也不會這樣縮html。
    再者php也有套件做這件事,你在C#的code上提php是要張飛打岳飛嗎 ?

    ReplyDelete
  3. 我提php,是要指動態產生的網頁= =
    Gzip交給server端來做,省了約70%的大小..依你的數據
    你程式端做一次server端做一次,多省了2%..嗯...

    ReplyDelete