BLOG

#3 HƯỚNG DẪN CÁCH TÍNH TỔNG THỜI GIAN TẢI TRANG BẰNG JAVASCRIPT



Với mục đích tò mò xem trang website mình viết và host tải trong bao lâu, tôi tìm kiếm một giải pháp cho mình. Các bạn có nhìn thấy bên phải trang là dòng hiển thị “Thời gian tải trang x.xx giây”. Đó là kết quả của đoạn code Javascript.


Hướng dẫn cách tính thời gian tải trang bằng JavaScript

Sau đây là cách tính toán thời gian tứ lúc bắt đầu tải cho đến khi kết thúc.

window.onload = function () {
var loadTime = window.performance.timing.domContentLoadedEventEnd-window.performance.timing.navigationStart;
var loadTimeString = "Thời gian tải trang: "+(loadTime/1000).toFixed(2)+" giây";
}

Lưu ý: thời gian được tính bằng giây với 2 con số lẻ. Các bạn có thể cấu hình, sửa đổi theo mong muốn riêng.

Thời gian load lệ thuộc vào server, đường truyền, tốc độ internet của user. Do đó cách tính thời gian load trang bằng Javascript là phản ánh đúng nhất trải nghiệm của người dùng.

Lợi ích lớn nhất có lẽ là cho bản thân chúng ta khi biết được trang web của mình load như nào trong môi trường thực tế. Từ đó có hướng cải thiện.


Tại sao thời gian tải trang lại siêu quan trọng?

Có nhiều yếu tố ảnh hưởng đến chất lượng website. Trong đó tốc độ tải là một tiêu chuẩn quan trọng. Không cần biết các yếu tố khác như thế nào, nhưng nếu trang của bạn mất quá 3 giây thì khách hàng sẽ ức chế. Còn quá 6 giây thường khách truy cập sẽ chuyển sang trang khác. Họ không có thời gian cho những thứ quá chậm. 10 giây thì có lẽ đến 99% người sử dụng khó mà quay lại trang.


Giải pháp đơn giản nhất để tăng tốc độ tải trang?

Như bài trước tôi đã giới thiệu, các bạn có thể dùng CloudFlare. Bản thân nó có chức năng CDN để giúp tăng tốc website. Thực tế, website này đã tăng được tốc độ đến 30% từ 1 giây thành 0.7 giây chỉ với cách đơn giản là thêm CloudFlare đứng trước trang. Hơn nữa nó khá đơn giản và miễn phí. Tôi cực kỳ khuyến nghị các bạn dùng cách này. Chi tiết cách làm tại đây.

Cắt các thành phần dư thừa của trang web. Nguyên tắc, càng nhẹ càng nhanh.

Phân tích lỗi trang bằng thẻ Mạng (Network) của trình duyệt. Ví dụ bạn dùng Firefox thì bấm F12, sau đó chuyển tìm thẻ Mạng (Network).

Thay thế nhà cung cấp hosting.

Nâng cấp website, hoặc thay thế website mới với thiết kế tốt hơn

Cuối cùng, trang của bạn nên có tốc đô tải trung bình dưới 2 giây là ổn. Nhanh hơn thì càng tốt. Thế giới internet là cạnh tranh hoàn hảo. Khách hàng sẽ ngay lập tức rời bỏ bạn nếu có trang khác cùng tính năng nhanh hơn. Nên tiêu chuẩn về tốc độ tải trang sẽ ảnh hưởng tới sức cạnh tranh của bạn. Bạn nên cố gắng đạt chuẩn dưới 2 giây cho vấn đề tải trang.

Thực tế tôi đang dùng cách này để đo tốc độ tải trang web. Các bạn có thể xem ở cuối trang tốc độ tải trang này. Hi vọng mang lại lợi ích cho các bạn.