TĂNG TỐC WEBSITE VỚI LỆNH NÉN HTTP

Dean Hume sẽ giải thích cho chúng ta vì sao nén lệnh có thể cải thiện tốc độ tải của website bạn từ một trích đoạn trong cuốn sách của ông, Fast ASP.NET Websites.

Trong chương này chúng ta sẽ tìm hiểu tầm quan trọng của việc nén trang và ảnh hưởng của nó đối với website. Cuốn sách này dựa vào 2 khái niệm chính xuyên suốt và chương này chúng ta sẽ xem làm thế nào mà nó có thể giúp chúng ta có một website có năng suất làm việc đạt loại A:

• Giảm thiểu các yêu cầu từ các trang đến HTTP

• Giảm thiểu kích thước của các yêu cầu từ các trang.

Bằng cách sử dụng việc nén trang, bạn sẽ giảm thiểu được dung lượng của từng yêu cầu từ các trang tới HTTP và bằng cách giảm thiểu dung lượng của từng yêu cầu như vậy sẽ làm giảm dung lượng của toàn website. Đến cuối chương này, bạn sẽ có thể tự nén trang web của mình bằng việc sử dụng một số các kỹ thuật được đính kèm trong sách.

Nén là gì?

Nén, hiểu một cách đơn giản đó là thuật toán (Algorithm) cho phép loại bỏ những phần dư và không cần thiết trong thư mục để có một thư mục mới với dung lượng nhỏ hơn thư mục gốc. Nếu cả server và trình duyệt web (browser) hiểu được lệnh toán này, nó thể sử dụng trên cả các lệnh yêu cầu và phản hồi.

Trình duyệt web hỗ trợ việc nén trang ở phần tiêu đề được gởi từ server trong yêu cầu gởi đến HTTP. Server web sau đó nhận thấy tiêu đề ở trong các lệnh yêu cầu và nếu có thể, nó sẽ thử nén các lệnh phản hồi mà nó gởi lại

lenh nen http
Một yêu cầu HTTP diển hình và đáp ứng cho website Bing.com. 
Chú ý phần Accept-Encoding và Content-Encoding 

Nếu bạn nhìn kỹ lệnh yêu cầu HTTP ở trên, bạn sẽ để ý thấy trình duyệt gửi một tiêu đề gọi là Accept-Encoding. Tiêu đề này nhắc cho server rằng lệnh này hỗ trợ việc nén trang. Thực chất, bạn có thể để ý có nhiều lọai nén trang khác nhau - những tiêu đề đang thông báo rằng nó hỗ trợ Gzip, Deflate và SDCH.

Tùy thuộc vào loại nén trang mà trình duyệt của bạn hỗ trợ, server sẽ nén những thành phần lại và sau đó trả lại dòng tiêu đề trong lệnh phản hồi HTTP. Tiêu đề này được gọi là Content-Encoding và trong trường hợp ví dụ ở trên, server đã thông báo trả lại lệnh phản hồi rằng đã nén các dữ liệu theo định dạng Gzip.

Tại sao cần phải nén ?

Nhằm mục đích kiểm tra hiệu quả nén và lưu trữ với các định dạng khác nhau, tôi đã lấy một vài tập tin thông thường để so sánh nó sau khi nén thành định dạng Gzip.

Gzip
Công dụng của Gzip lên các files

Bảng ở trên đã làm nổi bật sự khác nhau giữa dụng lượng 2 file trước và sau khi nén. Ở một số files, có một sự thay đổi kinh ngạc với việc thay đổi dung lượng đến 75%. Nén bằng Gzip hoạt đông dựa trên nguyên lý tìm những chuỗi tương đồng trong tập tin văn bản và loại bỏ nó trong một thời gian nhất định làm cho dung lượng của toàn tập tin nhỏ hơn.

Những chuỗi lặp

Kiểu nén này rất thích hợp với một website vì các tập tin Algorithm và CSS thường chứa các chuỗi lệnh lặp đi lặp lại, ví dụ là các khoảng trống (space), tag, và định nghĩa các loại lệnh. Nếu chúng ta nhìn lại bảng thống kê ở trên, bạn sẽ để ý thấy file được nén nhiều nhất là các file văn bản điều này ngược lại đối với các tập tin ảnh - bởi vì những dữ liệu ảnh đã được nén và nếu chúng ta sử dụng lệnh nén thêm nữa thì vẫn không mang lại kết quả thay đổi gì nhiều.

Có một liên kết trực tiếp giữa dung lượng của tập tin và số dung lượng được nén, theo quy luật thì nếu dung lượng file càng lớn thì dung lượng nén càng nhiều. Điều này xảy ra vì các tập tin lớn thuờng chứa nhiều các khoảng trống (Space) và các kí tự lặp.

Các nhà phát triển trình duyệt Chorme có tạo ra một bộ công cụ cho phép chúng ta nhìn và so sánh sự khác nhau giữa tập tin trước và sau khi nén. Bảng thống kê ở dưới đây so sánh sự khác nhau.

Gzip
Sự khác nhau giữa file trước và sau Gzip

Twitter Bootstrap là một Framework phổ biến với định dạng CSS giúp chúng ta phát triển CSS một cách nhanh chóng, gia tăng tốc độ hoàn thành dự án. Nó được phát triển bởi đội ngũ ở Twitter và còn đính kèm một số hỗ trợ CSS rất tiện ích.

Các tệp tin CSS cần một lượng lớn các không gian trắng (White space) là và nhiều kiểu dáng, điều này là hoàn hảo cho việc nén. Trên một tệp tin bootstrap.css chính được nén lại còn 21.12 kb và tiết kiệm cho chúng ta gần 76% dung lượng! Đây là một ví dụ hoàn hảo để bạn có thể so sánh giữa CSS và Javascript.

Trong bài viết này, chúng ta đã nhìn qua được 1 kỹ thuật trong cuốn sách FAST ASP.NET Websites mang lại sẽ giúp ta rút ngắn thời gian tải trang. FAST ASP.NET Websites cho chúng ta hướng dẫn từng bước một với các ví dụ cụ thể giúp tiếp cận nhanh chóng với các mẹo vặt tối ưu hóa website, các kỹ thuật đặt biệt áp dụng cho ASP.NET, và cách tận dụng các tính năng mới của HTML 5. Nếu bạn đang tìm giải pháp cải thiện hiệu suất làm việc của các ứng dụng ASP.NET, cũng như học một vài mánh khóe trong việc gia tăng hiệu suất hoạt động của website, thì đây là cuốn sách mà bạn nên tìm kiếm. Ngay cả khi bạn nghĩ website của bạn đã đủ nhanh, thì tôi chắc chắn rằng bạn có thể làm nó nhanh hơn.


Chúc các bạn thành công !

Tags: