Tối ưu hóa website theo chuẩn Yslow
Yslow là một công cụ được implement theo chuẩn của các dev Yahoo cho việc tối ưu hóa website nhìn từ client site . Trong quá trình tối ưu website http://vccorp.vn mình có tích lũy được một số kinh nghiệm chia sẻ cho mọi người .
Trước tiên bạn cần có firefox , cài addons firebug . Firebug là một công cụ cực mạnh khi cần debug client site script , css , html , kiểm tra header …
Sau đó cài tiếp addons Yslow ( chú ý là phải cài firebug trước . ) .
Dưới thanh status của firebug lúc này hiển thị ra cả 2 công cụ yslow và firebug .
Bạn click vào biểu tương yslow để kích hoạt nó trên trang web đang duyệt . Chúng ta sẽ test trực tiếp trên http://vccorp.vn bằng cách click tiếp vào nút Grade
Như chúng ta thấy tổng điểm performed là 76 với Grade hiện tại là C .
Những điểm chưa tối ưu được Yslow chỉ ra phía bên dưới .
1. Make fewer http request .
Giảm thiểu số lượng request tới server . Hiện tại chúng ta tốn tới 39 request :
Để giảm thiểu số lượng request này có một số các giải pháp
a.Minify, Merge, remove white space, và compress các file css , javascript, doc .
Giải pháp này khá đơn giản ,ví dụ ta đang có 3 file css thì trình duyệt phải request cả thảy 3 lần để có đủ css tham gia render trang . Nếu bây giờ nhập vào làm một request thì chỉ tốn 1 request thôi . Tất nhiên các trình duyệt hiện tại có thể làm việc đa luồng giúp load song song một số thành phần cho web , nhưng số lượng luồng đối với 1 tab lại giới hạn . Chính vì vậy tự mình xử lý bằng cách gộp các file css , js, doc lại là rất cần thiết .
Việc này có thể làm bằng một cách đơn giản là bạn đi copy , paste các file css và js gộp vào một file . Nhưng cách này khá khó bảo trì . Chúng ta có thể lập trình tự gộp các file này .
Cách xử lý : ( Chú ý : để đảm bảo tính bảo mật , các code share ở bài viết này không hoàn toàn là code sử dụng trong dự án vccorp.vn hay dự án tối ưu vccorp.vn )
-Đối với file css : StyleHandler.ashx.cs
-Đối với file js : ScriptsHandler.ashx.cs.
Note : các bạn nhớ phải thêm đoạn code sau vào web.config nhét 
Các bạn cũng nhớ config để nó hiểu được các đuôi file mà bạn gộp, nén nhé
- Đối với doc, cách xử lý tốt nhất là trên file Global.asax và Main.Master.cs
+Trước tiên là bỏ khoảng trắng nhé. Các bạn sửa nội dung trong file Main.master, overide lại method render :
protected override void Render(HtmlTextWriter writer)
{
using (HtmlTextWriter htmlwriter = new HtmlTextWriter(new System.IO.StringWriter()))
{
base.Render(htmlwriter);
string html = htmlwriter.InnerWriter.ToString();
if ((ConfigurationManager.AppSettings.Get("RemoveWhitespace") + string.Empty).Equals("true", StringComparison.OrdinalIgnoreCase))
{
html = Regex.Replace(html, @"(?<=[^])\t{2,}|(?<=[>])\s{2,}(?=[<])|(?<=[>])\s{2,11}(?=[<])|(?=[\n])\s{2,}", string.Empty);
html = Regex.Replace(html, @"[ \f\r\t\v]?([\n\xFE\xFF/{}[\];,<>*%&|^!~?:=])[\f\r\t\v]?", "$1");
html = html.Replace(";\n", ";");
}
writer.Write(html.Trim());
}
}
Thêm đoạn sau vào file web.config nhé
+Giờ là nén doc này. Các bạnsửa paste đoạn code sau trong Global.asax :
<%@ Application Codebehind="Global.asax.cs" Inherits="bogay.Global" Language="C#" %> <%@ Import Namespace="System.IO" %> <%@ Import Namespace="System.IO.Compression" %>
2.Use a Content Delivery Network (CDN)
Đây là giải pháp phân phối các tài nguyên sao cho client được lợi về đường đi .
Có thể tưởng tượng đây là bài toán phân phôi gà rán KFC . Nếu bạn muốn ăn thị gà KFC bạn chỉ cần gọi đến số 3848999 , yêu cầu món gà rán và đọc địa chỉ nhà , KFC sẽ chọn cửa hàng gần nhà bạn nhất để rao hàng . Tuy nhiên dự án Vccorp.vn chỉ là một website giới thiệu về gia đình vc với lượng truy cập thấp , giới hạn trong lãnh thổ việt nam . Nên không cần thiết cần có một CDN . Vì vậy bỏ qua phần này , nếu bạn vẫn muốn có rank A mà không thật sự có một CDN thì đó là chuyện khác ( hacking way ) mình sẽ nói đến nếu có thời gian .
3. Add Exprites header
Đưa Exprites và tất cả các header của các tài nguyên , đặc biệt là static content , Bạn chỉ cần config IIS để xử lý gọn vấn đề này :
Thanm khảo link . Thật lòng mà nói thì IIS 7 đã có bước tiến dài so với IIS 6 về xử lý static content . Nhưng so với các webserver như apahce , lightd , Nginx hay mới đây là Cherokee thì IIS thuộc hàng siêu cùi mía . Chính vì vậy mình vẫn muốn chuyển hẳn static content sang một server chuyện dụng ( recomend Cherokee + squid hoặc Varnish ) .
Đón đọc tiếp phần 2 ..
(i-php.net)
