10 cách cải thiện hiệu suất website tập trung vào front-end performance (P2)
Có hàng triệu cách giúp tăng hiệu suất website có thể áp dụng cho doanh nghiệp. Các phương pháp khác nhau này chủ yếu nằm trong ba lĩnh vực chính: Phần cứng (web server), tối ưu hóa server-side scripting (PHP, Python, Java) và hiệu suất front-end.
Qua bài viết này Bizfly Cloud chủ yếu nói tập trung vào front-end performance vì nó dễ thực hiện nhất và cung cấp nhiều lợi ích nhất.
Tại sao lại tập trung vào front-end performance?
Front-end (HTML, CSS, JavaScript và hình ảnh) là phần dễ truy cập nhất trên website. Nếu sử dụng gói shared web hosting, người dùng không có quyền truy cập root vào server, do đó không có khả năng điều chỉnh các cài đặt server. Và ngay cả khi có quyền đi chăng nữa, web server và database engineering yêu cầu khá nhiều kiến thức chuyên môn để có thể thực hiện các thủ thuật tùy chỉnh cho website.
Thao tác tập trung vào Front-end không hề tốn kém. Hầu hết các tối ưu hóa front-end không gây tốn thêm bất kỳ loại chi phí phát sinh nào khác ngoài thời gian. Không những "free", mà front-end còn giúp "tiết kiệm" thời gian và tiền bạc cho doanh nghiệp bằng cách tăng tốc độ tải trang, từ đó tạo điều kiện tối đa cho tăng trải nghiệm khách hàng, giữ chân người dùng, tăng tỷ lệ chuyển đổi dẫn tới tăng doanh thu.
Sau đây là một vài cách đơn giản để cải thiện tốc độ tải trang (Phần 2)
6. Sử dụng server-side compression để giảm kích thước tệp
Điều này khá khó khăn nếu doanh nghiệp sử dụng shared web host không hỗ trợ server-side compression, nhưng để tối ưu hóa hoàn toàn việc phục vụ các thành phần trang, chúng nên được nén lại. Nén các đối tượng trang tương tự như nén một tệp lớn được gửi qua email: Bạn (web server) nén một nhóm hình ảnh lớn (thành phần trang) và gửi email cho bạn bè (trình duyệt). Người nhận sẽ lần lượt giải nén tập tin để xem từng hình ảnh bên trong. Các phương pháp nén phổ biến là Deflate và gzip. Nén hình ảnh giúp cải thiện thời gian tải trang đáng kể. Hình ảnh nặng sẽ làm tổn thương website kinh doanh trực tuyến, đặc biệt là website TMĐT có rất nhiều hình ảnh, chẳng hạn như một nhà bán lẻ phụ tùng ô tô hoặc shop bán quần áo.
Nếu sử dụng dedicated server hoặc sở hữu riêng một VPS mà không có tính năng nén, bạn có thể dễ dàng cài đặt một ứng dụng để xử lý việc này, ví dụ cài mod_gzip trên Apache.
7. Tránh CSS và JavaScript inline
Theo mặc định, các tệp CSS và JavaScript bên ngoài được lưu trữ bởi trình duyệt của người dùng. Khi người dùng ra khỏi trang, họ đã sở hữu các stylesheet và JavaScript file, điều này giúp giảm thiểu nhu cầu tải xuống các style và script một lần nữa. Nếu bạn sử dụng nhiều CSS và JavaScript trong HTML document, bạn sẽ được lợi bởi tính năng caching của web browser.
8. Giảm tải tài nguyên và tính năng trang web
Đưa một số tài nguyên và tính năng của website sang các dịch vụ web của bên thứ ba giúp giảm tải đáng kể cho web server. Nguyên tắc giảm tải tài nguyên và tính năng của trang là chia sẻ gánh nặng phục vụ các thành phần trang với một server khác.
Bạn có thể sử dụng Feedburner để xử lý các RSS feeds, Flickr để phục vụ hình ảnh của mình (lưu ý đến việc giảm tải hình ảnh), và Google AJAX Libraries API để phục vụ các JavaScript frameworks/libraries phổ biến như MooTools, jQuery và Dojo.
Ví dụ: Sử dụng Bizfly Simple Storage xử lý các hình ảnh website, cũng như Feedburner xử lý các RSS feed. Điều này cho phép server chỉ xử lý việc phục vụ HTML, CSS, và CSS image background. Những giải pháp này không chỉ hiệu quả về chi phí mà còn giảm đáng kể thời gian phản hồi của các trang web.
9. Sử dụng Cuzillion để cấu trúc trang web tối ưu
Cuzillion là một ứng dụng dựa trên web được tạo bởi Steve Souder (front-end engineer của Google sau khi giữ vị trí Chief of Performance tại Yahoo) giúp bạn thử nghiệm các cấu hình khác nhau của cấu trúc trang web, từ đó rút ra được đâu là cấu trúc tối ưu. Nếu đã có web page design, bạn có thể sử dụng Cuzillion để mô phỏng cấu trúc trang web và sau đó điều chỉnh để cải thiện hiệu suất bằng cách di chuyển các thành phần xung quanh.
10. Theo dõi web server performance và tạo benchmark thường xuyên
Web server là bộ não của mọi hoạt động, có trách nhiệm nhận/gửi các HTTP request/response đến đúng người và phục vụ tất cả các thành phần trang web. Nếu web server không hoạt động tốt, bạn sẽ không thể tối đa hóa các lợi ích của việc tối ưu các thành phần riêng lẻ đem lại.
Điều quan trọng là bạn phải liên tục kiểm tra web server để nhận biết sớm các vấn đề về hiệu suất. Nếu có quyền truy cập root và có thể cài đặt công cụ trên máy chủ, hãy cân nhắc sử dụng ab - một công cụ đo điểm chuẩn của Apache web server hoặc Httperf từ IBM.
Nếu không có quyền truy cập vào web server (hoặc không hiểu biết nhiều về kỹ thuật), bạn có thể sử dụng một công cụ từ xa như Fiddler hoặc HTTPWatch để phân tích và giám sát lưu lượng HTTP. Cả hai sẽ chỉ ra những nguồn có nguy cơ gây rắc rối cho hệ thống.
Chấm điểm trước và sau khi thực hiện các thay đổi sẽ cung cấp cho bạn cái nhìn sâu sắc về tác động của những thay đổi. Nếu web server không thể xử lý lưu lượng truy cập mà trang web tạo ra, thì đây là lúc bạn cần nâng cấp hoặc di chuyển máy chủ.
Theo Bizfly Cloud chia sẻ
>> Có thể bạn quan tâm: CDN trong phát triển ứng dụng và phát triển web: Làm thế nào bạn có thể sử dụng CDN trong thương mại điện tử? (P1)
