NHANWEB

3 tuyệt chiêu với .htaccess giúp tối ưu hóa tốc độ website

Thời đại ngày nay cũng đã khác xưa khi tốc độ website quyết định việc người dùng có hoặc không dừng lại tại website của bạn. Một website có tốc độ tải trang quá 10 giây coi như … chết chắc. Bởi vì người dùng thời nay khó tính và không đủ kiên nhẫn ngồi đợi website bạn được tải lên. Đó là chưa nói đến yếu tố tốc độ tải trang cũng có 1 giá trị rất quan trọng nếu bạn muốn làm SEO. Vậy làm thế nào để nâng tốc độ tải trang, khiến website bạn truy cập … vèo vèo !

Giải pháp tăng tốc độ tải trang có rất nhiều, trong đó tôi đặc biệt chú ý đến công cụ YSlow nằm trong bộ Addon của Firefox có hướng dẫn khá đầy đủ về việc làm thế nào để tối ưu hóa website của bạn. Bạn có thể tìm hiểu thêm về YSlow và cách tối ưu hóa website bằng YSlow để biết thêm. Tôi cũng xin lưu ý với các bạn rằng những hướng dẫn của YSlow có thể chỉ dành cho dân developer thôi bởi những tùy chỉnh chuyên sâu của YSlow dân làm blog sẽ mù tịt.

Y-Slow và Firebug có thể là lựa chọn không tồi

Nhưng xin các anh, chị và các bạn blogger đừng hoang mang, trong khuôn khổ bài viết này tôi xin hướng dẫn các bạn 3 giải pháp tương đối đơn giản để tối ưu hóa khối lượng tải xuống của website bằng cách can thiệp vào file .htaccess. Phương pháp này có vẻ đơn giản và dễ thực hiên hơn rất nhiều lần. Bạn nào xài máy chủ Window thì xin phép ngồi nhìn thôi hen !

Chiêu thứ nhất: Disable Etags

Entity tags (ETags) là một cơ chế giúp máy chủ web và trình duyệt dùng xác định xem thành phần trong bộ nhớ cache của trình duyệt có phù hợp với thành phần gốc trong máy chủ hay không.Theo các qui định tối ưu hóa của Yahoo! Việc tắt Etags có thể góp phần giảm tải cho máy chủ và giảm đi một lượng băng thông đáng kể cho website.

Để tắt Etag đi, bạn chỉ cần đặt đoạn code sau vào file .htaccess:

[code] Header unset ETag
FileETag None
[/code]

Chiêu thứ hai: Thêm Expires Headers

Expires Headers (tôi xin phép giữ nguyên thuật ngữ này khi trình bày) – là một dạng khai báo nhằm thông báo với trình duyệt rằng các thành phần được tải xuống (như hình ảnh, file video, file flash…) được lưu trữ trong bộ nhớ cache đến một thời gian nhất định nào đó. Việc này giúp ích cho lần truy cập tiếp theo của người dùng sẽ nhanh hơn do trình duyệt không yêu cầu tải lại các thành phần này mà nó sẽ lấy từ bộ nhớ cache. Miễn sao các thành phần này vẫn còn thời gian hiệu lực.

Để thêm expires header bạn thêm .htaccess đoạn code sau:

[code] Header set Expires "Tue, 16 Jun 2020 20:00:00 GMT"
[/code]

Còn nếu bạn muốn chỉ một số thành phần được lưu trữ lại trong bộ nhớ cache chúng ta có thể thêm điều kiện như sau:

[code] <FilesMatch ".(ico|jpg|jpeg|png|gif|js|css|swf)$">
Header set Expires "Tue, 16 Jun 2020 20:00:00 GMT"
</FilesMatch>
[/code]

Trong ví dụ trên, chỉ những file có đuôi (hay định dạng) .icon,.jpg, .jpeg, .png, .gif, .js, .css, .swf mới được thêm Expire Header. Các thành phần khác vẫn được gọi lại (vì mục đích làm mới trang chẳng hạn).

Ví dụ trên cho phép bạn cấu hình Expires Headers theo một điểm thời gian xác định; bạn cũng có thể cấu hình Expires Headers theo một khoảng thời gian xác định bằng cách sau:

[code] ExpiresActive On
ExpiresDefault "access plus 10 years"
[/code]

Ví dụ trên cho bạn cấu hình thời gian quá hạn của cache trong vòng 10 năm dựa trên thời gian truy cập. Nếu bạn muốn cấu hình thời gian theo thời điểm hiện tại, bạn có thể sử dụng code sau:

[code] ExpiresActive On
ExpiresDefault "now plus 10 years"
[/code]

Thật đơn giản phải không các bạn đọc NhanWeb ?

Ngoài ra, bạn có thể cấu hình riêng cho từng định dạng file bằng cách sau:

[code] ExpiresActive On
ExpiresByType text/html "access plus 1 day"
ExpiresByType image/gif "access plus 10 years"
ExpiresByType image/jpeg "access plus 10 years"
ExpiresByType image/png "access plus 10 years"
ExpiresByType text/css "access plus 10 years"
ExpiresByType text/javascript "access plus 10 years"
ExpiresByType application/x-javascript "access plus 10 years"
[/code]

Và đây là kiểu kết hợp cả phương thức theo khoảng thời gian và theo định dạng file nếu bạn nào quan tâm:

[code] ExpiresActive On
ExpiresDefault "access plus 10 years"
ExpiresByType text/html "access plus 1 day"
[/code]

Đoạn code trên sẽ cấu hình thời gian quá hạn của tất cả các file được tải xuống trong vòng 10 năm. Riêng file HTML sẽ quá hạn trong vòng 1 ngày. Điều này khá tốt cho các website, blog vì việc cập nhật thông tin là hàng ngày nhưng hình ảnh thì rất ít khi thay đổi.

Với cách này bạn có thể tiết kiệm một lượng băng thông kha khá được tiêu tốn bởi bạn đọc trung thành của bạn đấy ! NhanWeb.com cũng đang sử dụng cách này và lượng tài nguyên tiêu thụ đã giảm, tốc độ tải trang thì tăng lên rõ rệt.

Lưu ý là chiêu này đòi hỏi bạn phải mở mod mod_expires lên nhé !

Tuyệt chiêu thứ 3: Nén file

Nén file có thể bạn đã nghe nhiều; nhưng kĩ thuật nén file có lẽ là ít người biết bởi nó liên quan đến ngôn ngữ lập trình bạn sử dụng. Bằng cách sử dụng.htaccess, chúng ta cũng có thể nén file lại trước khi chuyển nó đến tay khách truy cập. Việc này chẳng những tăng tốc độ tải trang mà nó còn khiến cho băng thông của bạn thoải mái hơn.

Cách làm như sau:

[code] SetOutputFilter DEFLATE
[/code]

Tương tự như trên, bạn có thể kết hợp với điều kiện nén:

[code] <FilesMatch ".(js|css|html|htm|php|xml)$">
SetOutputFilter DEFLATE
</FilesMatch>
[/code]

Tương tự như chiêu thứ 2, chiêu này đòi hỏi mod mod_deflate phải được cài đặt trên server của bạn. Thông thường mod này không được cài đặt sẵn nên bạn phải yêu cầu cài đặt và config nó mới có thể sử dụng. Bạn có thể kiểm tra bằng cách tạo file phpinfo.php và yêu cầu người quản trị hệ thống cài đặt cho bạn nếu cần.

Kiểm tra như thế nào ?

Một Addon của Firefox có thể giúp bạn kiểm tra những đoạn mã tôi đã cung cấp cho bạn ở trên có hoạt động hay không đó là Firebug.Bạn chỉ cần mở tab NET trên Firebug và kiểm tra các thông số có liên quan như hình sau:

Hoặc bạn có thể cài thêm ứng dụng YSlow để thêm điểm số (score) của YSlow cung cấp cho bạn sẽ biết hiệu quả.

Cache sẽ hết hạn sau … 10 năm nữa

Bạn sử dụng và gặp khó khăn ? Bạn muốn góp ý cho bài viết ? HÃY BÌNH LUẬN cùng tôi !

Nguồn bài: http://www.deluxeblogtips.com/2010/06/htaccess-rules-website-performace.html

Exit mobile version