Tối ưu hiệu suất asp.net website

1.    Giới thiệu

Chắc không cần nói thêm về website nữa, nó đã dần trở nên quen thuộc với chúng ta, tuy nhiên, xét về khía cạnh chúng ta là người xây dựng ứng dụng web, thì làm sao cho website xử lý được thật nhiều thông tin mà vẫn phản hồi lại cho client trong thời gian nhanh nhất là ưu tư của hầu hết mọi người.

Trong bài viết này, mình xin giới thiệu những phương cách mà mình thấy là hiệu quả khi áp dụng cho các website đã thiết kế. Các phương cách này khi được vận dụng kết hợp với nhau sẽ làm giảm đáng kể, không những tốc độ phản hồi (response) mà ngay cả tốc độ xử lý trên server.

2.    Các phương pháp

a.    HTTP Compression

Tác dụng của phương pháp này là nén mã HTML khi server trả về cho client, hay ngược lại client gửi cho server, mục tiêu là giảm băng thông (bandwidth). Chúng ta biết rằng, tất cả mọi công nghệ web, dù làm gì đi chăng nữa, thì kết quả cuối cùng trả về cho client vẫn là mã HTML. Việc chuyển lên chuyển xuống HTML thông qua giao thức HTTP giữa client và server là hoạt động chính sử dụng bandwidth. Vậy thì để giảm tối đa việc sử dụng bandwidth, ta làm sao nén dữ liệu các gói tin HTTP trao đổi là được.

May mắn thay, việc này đã được thực hiện tự động ở IIS7 (hoặc Windows Server 2008) trở về sau. Ở đây, mình chỉ trình bày kỹ thuật cho những ai vẫn sử dụng IIS6 hay Windows Server 2003.

Mở cửa sổ Internet Information Services (IIS) Manager.

Click chuột phải vào thư mục Websites, chọn Properties.

Chọn tab Service.

Trong khung HTTP Compression, chọn Compress static files.

Nếu muốn, bạn có thể chọn thư mục để lưu file tạm (temporary folder).

Chọn Limited hay Unlimited là tùy bạn (có giới hạn size cho thư mục tạm hay không).

b.    Tắt ViewState ở những chỗ không cần thiết

ViewState là dữ liệu tạm, asp.net sử dụng để “bảo lưu” các giá trị trên form sau khi postback. Như chúng ta đã biết, website là kiểu stateless, nghĩa là sau khi trả (response) kết quả cho client, server không còn “ký ức” gì về những kết quả nó đã trả, không còn nhớ chúng ta yêu cầu gì, nhận gì, nói chung là mọi trạng thái của client không được server “nhớ”. Vậy thì, khi chúng ta thao tác trên form, form đăng ký chẳng hạn, sau khi chúng ta điền dữ liệu xong, gửi lên cho server, server xử lý xong trả về, các dữ liệu trong các textbox sẽ không còn tồn tại. Giả sử rằng khi xử lý server báo là “không đăng ký được do lỗi abc gì đó”, thì chúng ta phải điền form đăng ký lại từ đầu. Để giải quyết vấn đề này, asp.net sử dụng một cách đó là ViewState, ViewState thực sự ra là một hiddenfield, chứa toàn bộ nội dung các control trên form đã được mã hóa. Sau khi server xử lý xong và trả về, asp.net sử dụng thông tin trong ViewState để “phục hồi” dữ liệu ở các control trên form. Đây là một cách rất hay của asp.net giải quyết vấn đề stateless giữa server và client.

Tuy nhiên, không phải mọi control trên form đều cần điều này, cho nên việc tắt ViewState trên những control này, vừa tăng tốc xử lý, vừa làm “nhẹ” mã HTML.

Trên đây là ví dụ về ViewState trong website, website càng nhiều control, mỗi control chứa nhiều thông tin, ViewState càng “bự”.

Vậy, chuyện tắt ViewState rõ ràng là có lợi rồi đó, tuy nhiên tắt làm sao cho “lợi bất cập hại” lại là chuyện “khó nghĩ”. Một tiêu chí để các bạn có thể căn cứ vào mà quyết định 1 control nên tắt ViewState hay không đó là: dữ liệu trong control này, sau khi postback ta có cần “bảo lưu” hay không. Ví dụ, toàn bộ dữ liệu trong GridView, sau khi postback ta vẫn binding dữ liệu cho nó, vì thế không cần bảo lưu dữ liệu cũ làm gì, thế thì không cần ViewState.

Cú pháp để tắt ViewState cho từng control là, trong mỗi control ta khai báo thêm thuộc tính EnableViewState=”false”.

c.    Chỉnh sửa Web.config

Việc chỉnh sửa file web.config cũng tiết kiệm cho ta nhiều xử lý trên server khi bỏ bớt những phần không cần thiết.

                                          i.    Bỏ bớt một số HTTP Modules không sử dụng

Mặc định, khi render một webpage, dữ liệu được cho đi qua nhiều HTTP Modules, tuy nhiên, trong đa số trường hơp, việc này là không cần thiết. Ta có thể tắt bớt vài HTTP Modules sau:

                                         ii.    Tắt trình truy vết (trace)

Trình truy vết là công cụ hữu hiệu trong việc đánh giá hoạt động, cũng như debug lỗi. Tuy nhiên khi website đã hoạt động ổn định, thì ta có thể tắt tính năng này đi.

                                        iii.    Tắt luôn debug

d.    Sử dụng cache.

Cache là một tính năng hữu dụng để tối ưu hiệu suất của website, tuy nhiên, chúng tôi muốn tách riêng phần này ra một bài viết độc lập, để chúng ta có thể thảo luận với nhau thoải mái hơn.

e.    Tối ưu CSS

Tuy rằng công việc tối ưu CSS chả làm cho server ít đi việc nào, nhưng nó làm cho trình duyệt hiển thị trang web của chúng ta nhanh hơn, nên nó cũng đáng để chúng ta lưu ý. Công việc tối ưu CSS khá đơn giản, ta cần lướt qua nội dung các file CSS và bỏ đi những class không dùng đến, và nếu có thể, sử dụng càng ít file CSS càng tốt. Trong trang mà chúng tôi tham khảo có dẫn đến 1 trang web giúp chúng ta tối ưu css tự động đó làhttp://www.cssdrive.com/index.php/main/csscompressor.

f.     Tối ưu mã javascript

Khá đơn giản, bạn có thể dùng trang web này để tối ưu javascripthttp://www.xtreeme.com/javascript-optimizer/

g.    Vị trí khai báo CSS và JS trong code.

Cố gắng đặt tất cả CSS có thể, vào vị trí đầu của masterpage, và JS vào phần cuối của masterpage.

h.    Sử dụng server.transfer()

Nên sử dụng cấu trúc server.transfer thay vì response.redirect()

i.      Sử dụng validation bằng javascript.

Dĩ nhiên rồi, việc validation ở server, vừa bắt server làm việc nhiều, vừa khiến người dùng khó chịu khi cứ phải chờ đợi, cho nên validation thực hiện bằng javascript là hay nhất. May mắn cho chúng ta là JQuery khá phổ biến, và có đầy đủ “đồ chơi” cho chúng ta. Tham khảo thêmhttp://jqueryvalidation.org/

3.    Kết luận

Nội dung bài viết chủ yếu chúng tôi tham khảo từ bài viết nàyhttp://www.codeproject.com/Articles/36749/ASP-NET-Web-Site-Performance-Improvement, tuy nhiên không hẳn chỉ là dịch lại cho các bạn đọc, mà xen lẫn trong lúc dịch, chúng tôi có sử dụng những kinh nghiệm đã tối ưu website thực tế vào bài viết, để có cái nhìn rõ hơn, và có thể trình bày lại theo “ngôn ngữ” của riêng chúng tôi.

Đã từ lâu, chúng tôi ấp ủ muốn viết bài này, nhưng chưa tổng hợp được các phương pháp, may sao khi duyệt web, thấy bài viết trên, chúng tôi quyết định dựa vào cấu trúc bài viết đó mà viết lại. Riêng phần tối ưu web.config thì chúng tôi tham khảo hoàn toàn, vì chưa bao giờ nghĩ đến điều này.

Mọi ý kiến đóng góp vui lòng gửi mail cho chúng tôi. Chúc các bạn thành công và vui vẻ.

Hẹn gặp lại trong các bài viết thú vị sau.