10 mẹo để cải thiện tốc độ trang web

Theo bạn, tốc độ của website có thật sự quan trọng không?

Sẽ như thế nào nếu 1 trang web bị delay 1 giây?
Theo thống kê:

• Giảm 11% lượng người xem so với thông thường
• Giảm 16% sự hài lòng của người sử dụng
• Mất mát 7% trong sự chuyển đổi (conversion) (nguồn: Aberdeen Group)

Amazon đã cho điều đó là đúng, báo cáo doanh thu của Amazon tăng 1% khi cải thiện được tốc độ 100 mili giây của tốc độ tải trang web.(nguồn: Amazon)

Chưa hết, theo nghiên cứu của Akamai cho thấy:

• 47% người sử dụng muốn tải xong 1 trang web trong vòng 2 giây trở xuống
• 40% sẽ không quay lại nếu trang web đó load lâu hơn 3 giây
• 52% người mua sắm điện tử sẽ trung thành với những trang web có tốc độ load cao

Theo Radware, trung bình tốc độ web đã tăng 22% trong năm nay
Rõ ràng mà nói, tăng tốc cho website rất quan trọng, nó góp phần tạo thiện cảm cho người sử dụng và tăng doanh số cho công ty. Dưới đây là 10 cách tăng tốc trang web mà tôi sưu tầm được

1. Giảm thiểu HTTP Request

Theo Yahoo, 80% thời gian load các trang web là dành cho các thành phần (component): hình ảnh, stylesheet, script, Flash v…v… Mỗi HTTP Request được tạo cho mỗi một component trên, vậy cho nên càng nhiều component đó trên một trang, thì thời gian càng tăng lên.

Trong trường hợp này, tốc độ của website phụ thuộc vào sự thiết kế của bạn, vậy nên:

• Số lượng các component của website
• Hãy sử dụng CSS thay vì ảnh trong khả năng có thể
• Phối hợp nhiều stylesheet thành một
• Giảm script và đặt nó ở cuối trang

Tip: Hãy thực hiện giảm thiểu component trên mỗi trang. Bằng cách này bạn sẽ giảm được lượng HTTP Request cần thiết trên mỗi trang và bạn sẽ giảm thiểu được lượng lớn thời gian load trang.

2. Giảm Server Response Time

Nếu bạn muốn giảm 200 mili giây, hãy làm theo cách dưới đây bạn sẽ đạt được điều đó

Google khuyến cáo nên sử dụng các trang web ứng dụng để theo dõi và kiểm tra các nút cổ chai (bottleneck) trong hiệu suất (performance)

Tip: Theo báo cáo của Singlehop, để giữ cho hiệu suất website tốt, hãy học các điều sau:
Yslow - để đánh giá tốc độ trang web của bạn và nhận các mẹo về cách cải thiện hiệu suất.
Các công cụ PageSpeed của Google - để tìm hiểu thêm về performance tốt nhất và tự động hoá quy trình.

3. Kích hoạt compression

Với các trang web từ 100kb trở lên, nó khá gồ ghề và chậm khi load trang. Cách tốt nhất để tăng thời gian load là nén - kỹ thuật này gọi là compression.

Compression giúp giảm băng thông của trang, do đó làm giảm HTTP response. Hãy thực hiện cách này bằng công cụ Gzip

Hầu hết các server web có thể nén ở dạng Gzip trước khi gửi chúng để tải load trang bằng cách sử dụng bên thứ ba (third-party) hoặc sử dụng các routine được tích hợp sẵn. Theo Yahoo, điều này có thể làm giảm thời gian tải xuống khoảng 70%.

90% lưu lượng Internet ngày nay đi qua các trình duyệt hỗ trợ Gzip, đây là một lựa chọn tuyệt vời để tăng tốc độ trang web của bạn.

Tip: Tham khảo Gzip compression

4. Kích hoạt browser caching

Khi bạn truy cập trang web, các component trên trang mà bạn truy cập được lưu trữ trên ổ cứng của bạn trong bộ nhớ cache hoặc bộ nhớ tạm thời, vì vậy lần sau bạn truy cập vào trang web, trình duyệt của bạn có thể tải trang mà không cần phải gửi HTTP Request khác tới máy chủ.

Lần đầu tiên ai đó đến trang web của bạn, họ phải tải xuống tài liệu HTML, Document, stylesheet, javascript và hình ảnh trước khi có thể sử dụng trang của bạn. Có thể mất lên đến 2,4 giây để load 30 component.

Khi trang đã được tải và các thành phần khác nhau được lưu trữ trong bộ nhớ cache của người dùng, chỉ cần tải xuống một vài thành phần cho lần truy cập tiếp theo.
Trong thử nghiệm của Theurer, chỉ là ba thành phần và 0,9 giây, tiết kiệm gần 2 giây trong thời gian tải.

Theurer cho rằng 40-60% khách truy cập hàng ngày vào trang web của bạn đi kèm với một bộ nhớ cache trống, vì vậy điều quan trọng là bạn làm cho trang của bạn nhanh chóng cho những khách truy cập lần đầu tiên. Nhưng bạn cũng cần phải cho phép bộ nhớ đệm để giảm thời gian các lần truy cập tiếp theo.

5. Giảm thiểu tài nguyên

WYSIWYG (What You See Is What You Get) giúp bạn xây dựng một trang Web dễ dàng, nhưng đôi khi chúng tạo ra code khá lộn xộn và làm chậm trang của bạn.

Các dòng lệnh không cần thiết nếu thêm vào sẽ làm tăng kích thước trang của bạn, vậy nên hãy chú ý loại bỏ space, ngắt dòng và thụt lề trong code của bạn để các trang web của bạn càng gọn gàng càng tốt.

Một số đề xuất của Google:

• Tiện ích mở rộng PageSpeed Insights Chrome Extension
• Để giảm thiểu CSS, bạn có thể thử YUI Compressor và cssmin.js
• Để giảm thiểu JavaScript, hãy thử Closure Compiler, JSMin hoặc YUI Compressor

6. Tối ưu hóa hình ảnh

Với hình ảnh, cần tập trung vào: size, định dạng và nguồn cấp

Size
Hãy sử dụng những hình ảnh có chất lượng phù hợp và kích thước phù hợp để tăng tốc quá trình load ảnh

• Xóa image comment
• Chỉnh lại màu ở mức thấp nhất nhưng vẫn chấp nhận được
• Crop ảnh

Định dạng

• Tốt nhất là JPEG
• PNG cũng khá tốt, nhưng 1 số trình duyệt cũ không hỗ trợ
• Chỉ sử dụng GIF với cái hình nhỏ
• Không sử dụng BMPs và TIFFs

Nguồn cấp ảnh

Phải chắc chắn rằng nguồn của ảnh đó có kích thước phù hợp, và tồn tại
Ngay cả khi src bằng rỗng <img src=""> thì trình duyệt vẫn trỏ đến theo yêu cầu, việc này làm mất thời gian trong khi tải trang đấy.

7. Tối ưu hóa CSS

CSS giữ các yêu cầu về style cho trang của bạn. Nói chung, trang web của bạn truy cập vào thông tin này bằng một trong hai cách: trong một tệp tin bên ngoài (external), tệp này tải trước khi hiển thị trang của bạn và inline, được chèn vào chính tài liệu HTML.
Thông thường, nên sử dụng kiểu external để giảm thiểu code bị trùng

8. Ưu tiên thứ tự tải trang

Bạn có thể cải thiện trải nghiệm của người dùng bằng cách tải ở đầu màn hình (trên cùng của trang) tải nhanh hơn - ngay cả khi phần còn lại của trang mất vài giây để tải. Nhằm mục đích tạo ra thông tin mồi cho người đọc hơn là để người sử dụng chờ tất cả xuất hiện 1 lần.

9. Giảm thiểu số lượng Plugin

Quá nhiều plugin làm chậm trang web của bạn, tạo ra vấn đề bảo mật, và thường gây ra sự cố và các khó khăn kỹ thuật khác.

Vì vậy càng ít càng tốt nhé.

10. Giảm thiểu redirects

Chuyển hướng tạo HTTP request bổ sung và tăng thời gian tải.

Tóm lại

Một trong những lời khuyên trên rất dễ thực hiện, nhưng một số ít là những yêu cầu kĩ thuật tiên tiến có thể làm trở ngại nếu bạn không nghiêng về mặt kỹ thuật.
Bạn đã từng làm cách nào trên 10 cách trên để tăng tốc website của bạn chưa. Hãy chia sẻ bài viết để nhiều người cùng biết nhé.

Tham khảo:
15 Tips to Speed Up Your Website
10 Ways to Speed Up Your Website – and Improve Conversion by 7%