Tại sao
Trong một trang web bình thường có rất nhiều khoảng trắng. Chúng ta đặt nó ở đó trong Form của các tab và làm cho dễ bảo trì và dễ đọc hơn. Nhưng nó có giá của nó ,thêm vào tăng trọng lượng tài liệu với nhiều kilobyte và phải mất lâu hơn cho trình duyệt để hiển thị một trang với rất nhiều khoảng trắng. Điều này đặc biệt đúng đối với IE6, điều này làm cho khoảng trắng chậm hơn rất nhiều.
Bằng cách loại bỏ tất cả các khoảng trắng thêm trong HTML bạn có thể tiết kiệm lên đến ~ 25% tổng trọng lượng của các trang trong kilo byte và tạo dựng hình trong trình duyệt nhanh hơn.
Bằng cách nào
Có một số cách loại bỏ các khoảng trắng từ HTML. Bạn có thể ghi đè lên các phương thức Render trong lớp Page hoặc MasterPage hoặc bạn có thể sử dụng HttpModule. HttpModule là preferrable vì bạn sau đó tách riêng việc loại bỏ khoảng trắng từ phần còn lại của logic trang web. Dù bằng cách nào, đó là những bước cần thiết để loại bỏ khoảng trắng:
1. Lấy HTML trước khi gửi nó vào trình duyệt
2. Loại bỏ các khoảng trắng
3. Gửi mới khoảng trắng HTML đến trình duyệt
1. Lấy mã HTML
Như đã nói ở trên, điều này có thể được thực hiện trong hai phương thức Render của Page hoặc MasterPage hoặc nó có thể được thực hiện trong HttpModule. Nếu bạn đang sử dụng ASP.NET MVC bạn không có phương thức Render để ghi đè lên và bạn cần phải loại bỏ các khoảng trắng từ HttpModule.
protected override void Render(HtmlTextWriter writer)
{
using (HtmlTextWriter htmlwriter = new HtmlTextWriter(new System.IO.StringWriter()))
{
base.Render(htmlwriter);
string html = htmlwriter.InnerWriter.ToString();
// Trim the whitespace from the 'html' variable
writer.Write(html);
}
}
HttpModule:
Để lấy mã HTML từ các dòng response, bạn cần phải thêm một bộ lọc để đáp ứng. Nó phức tạp hơn một chút và yêu cầu mã nhiều hơn phương thức Render, nhưng đó là cách đề nghị. Cách tốt nhất để có được một sự hiểu biết về cách làm việc này là bằng cách xem trong RemoveWhitespaceModule và RemoveWhitespaceFilterStream bên dưới.
2. Loại bỏ khoảng trắng
Ở đây chúng ta cần phải sử dụng hai biểu thức thông thường để xác định các khoảng trắng được an toàn để loại bỏ.
private static readonly Regex RegexBetweenTags = new Regex(@">(?! )\s+", RegexOptions.Compiled);
private static readonly Regex RegexLineBreaks = new Regex(@"([\n\s])+?(?<= {2,})<", RegexOptions.Compiled);
Phương thức này sử dụng hai biểu thức thông thường để loại bỏ bất kỳ khoảng trắng từ chuỗi HTML.
public static string RemoveWhitespaceFromHtml(string html)
{
html = RegexBetweenTags.Replace(html, ">");
html = RegexLineBreaks.Replace(html, "<");
return html.Trim();
}
Phương thức này là an toàn để loại bỏ khoảng trắng từ bất kỳ đoạn mã HTML hoặc tài liệu. Nếu chuỗi HTML chứa style nội tuyến hoặc script, chúng sẽ không được đụng được và tước từ khoảng trắng - chỉ HTML. Bài sau sẽ hướng dẫn cách giảm bớt Slyle(CSS) và JavaScript(JS)
3. Gửi khoảng trắng HTML đến trình duyệt
Nếu bạn đã chọn để ghi đè lên phương thức Render, bạn có thể nhìn thấy đoạn mã trên đã được đưa về. Bạn cần làm là vượt qua các biến html vào phương thức RemoveWhitespaceFromHtml. HttpModule, bạn cần phải chuyển đổi lại HTML đến mảng byte và ghi nó vào bộ lọc đầu ra. Một lần nữa, xem đoạn code RemoveWhitespaceFilterStream về cách nó được thực hiện.
Những điều cần chú ý
Bằng cách chặn đầu ra HTML và làm chuỗi các thao tác trên nó, nó sẽ đòi hỏi phải làm việc nhiều hơn cho CPU. Kỹ thuật này, như hầu hết các kỹ thuật khác, là một sự cân bằng giữa băng thông/tốc độ và tải CPU.
Trong trường hợp loại bỏ các khoảng trắng, tải CPU thêm là rất thấp.
Kết luận
Bằng việc sử dụng tối ưu bạn sẽ có được RemoveWhitespaceModule thực hiện việc loại bỏ khoảng trắng tự động cho tất cả các ứng dụng ASP.NET. Tất cả bạn cần làm là thêm
WebOptimizer.dll trong thư mục Bin và đăng ký mô-đun trong web.config như sau:
<add name="RemoveWhitespaceModule" type="WebOptimizer.Modules.RemoveWhitespaceModule, WebOptimizer" />
Nó hoạt động trên cả hai IIS 6 và 7 một trong hai chế độ Classic Mode hoặc Integrated Pipeline.