Bạn cần hiểu rõ trải nghiệm của người dùng khi sử dụng ứng dụng hoặc trang web khi kết nối kém hoặc không đáng tin cậy, đồng thời xây dựng cho phù hợp. Hàng loạt công cụ có thể giúp bạn.
Thử nghiệm với băng thông thấp và độ trễ cao
Tỷ lệ người dùng trải nghiệm web trên thiết bị di động ngày càng tăng. Ngay cả ở nhà, nhiều người bỏ ngang băng thông rộng cố định để chuyển sang dùng thiết bị di động.
Trong ngữ cảnh này, bạn cần hiểu được cảm giác sử dụng ứng dụng hoặc trang web khi kết nối kém hoặc không đáng tin cậy. Có nhiều công cụ phần mềm có thể giúp bạn mô phỏng và mô phỏng băng thông thấp và độ trễ cao.
Mô phỏng điều tiết mạng
Khi xây dựng hoặc cập nhật một trang web, bạn phải đảm bảo đủ hiệu suất trong nhiều điều kiện kết nối. Một số công cụ có thể giúp bạn.
Công cụ trình duyệt
Công cụ của Chrome cho nhà phát triển cho phép bạn kiểm thử trang web của mình với nhiều tốc độ tải lên/tải xuống và thời gian trọn vòng, sử dụng các giá trị đặt trước hoặc chế độ cài đặt tuỳ chỉnh trên Bảng điều khiển mạng. Hãy xem bài viết Bắt đầu phân tích hiệu suất mạng để tìm hiểu các kiến thức cơ bản.
Công cụ hệ thống
Network Link Conditioner là bảng điều khiển tuỳ chọn có sẵn trên máy Mac nếu bạn cài đặt Hardware IO Tools (Công cụ IO phần cứng) cho Xcode:
Mô phỏng thiết bị
Trình mô phỏng Android cho phép bạn mô phỏng nhiều điều kiện mạng trong khi chạy các ứng dụng (bao gồm cả trình duyệt web và ứng dụng web kết hợp) trên Android:
Đối với iPhone, bạn có thể dùng Network Link Conditioner để mô phỏng các điều kiện mạng yếu (xem ở trên).
Thử nghiệm từ các vị trí và mạng khác nhau
Hiệu suất kết nối phụ thuộc vào vị trí máy chủ cũng như loại mạng.
WebPagetest là một dịch vụ trực tuyến cho phép chạy một tập hợp các kiểm thử hiệu suất cho trang web của bạn bằng cách sử dụng nhiều mạng và vị trí máy chủ lưu trữ. Ví dụ: bạn có thể thử trang web của mình từ một máy chủ ở Ấn Độ trên mạng 2G hoặc qua cáp từ một thành phố ở Hoa Kỳ.
Chọn một vị trí và trong phần cài đặt nâng cao, hãy chọn loại kết nối. Thậm chí, bạn có thể tự động kiểm thử bằng cách sử dụng tập lệnh (ví dụ: để đăng nhập vào một trang web) hoặc sử dụng API RESTful của trang web. Điều này giúp bạn đưa hoạt động kiểm thử khả năng kết nối vào các quy trình xây dựng hoặc ghi nhật ký hiệu suất.
Cloud hỗ trợ proxy toàn cầu thông qua GeoEdge và các quy tắc tuỳ chỉnh của nó có thể được dùng để mô phỏng tốc độ modem:
Kiểm thử trên mạng yếu
Proxy phần mềm và phần cứng cho phép bạn mô phỏng các điều kiện về mạng di động có vấn đề, chẳng hạn như điều tiết băng thông, độ trễ gói và tình trạng mất gói ngẫu nhiên. Proxy dùng chung hoặc mạng yếu có thể cho phép một nhóm nhà phát triển tích hợp việc kiểm thử mạng thực tế vào quy trình làm việc của họ.
Hệ thống kiểm soát lưu lượng tăng cường (ATC) của Facebook là một tập hợp các ứng dụng được cấp phép BSD có thể dùng để định hình lưu lượng truy cập và mô phỏng các điều kiện mạng yếu:
Facebook thậm chí đã tổ chức Ngày thứ Ba 2G để hiểu cách mọi người dùng 2G sử dụng sản phẩm của họ. Vào thứ Ba, nhân viên sẽ nhận được cửa sổ bật lên cho phép họ mô phỏng kết nối 2G.
Bạn có thể sử dụng proxy HTTP/HTTPS của Charles để điều chỉnh băng thông và độ trễ. Charles là phần mềm thương mại nhưng có bản dùng thử miễn phí.
Thông tin thêm về Charles có tại codewithchris.com.
Xử lý kết nối không đáng tin cậy và "lie-fi"
lie-fi là gì?
Thuật ngữ lie-fi có từ ít nhất là năm 2008 (khi điện thoại trông giống như thế này) và đề cập đến khả năng kết nối không phải như những gì thường thấy. Trình duyệt của bạn sẽ hoạt động như thể có kết nối khi vì bất kỳ lý do gì.
Kết nối bị hiểu sai có thể dẫn đến trải nghiệm kém vì trình duyệt (hoặc JavaScript) vẫn liên tục cố gắng truy xuất tài nguyên thay vì từ bỏ và chọn một phương án dự phòng hợp lý. Lie-fi thực sự có thể tệ hơn ngoại tuyến; ít nhất nếu thiết bị chắc chắn đang ngoại tuyến, JavaScript của bạn có thể thực hiện hành động né tránh thích hợp.
Lie-fi có thể sẽ trở thành một vấn đề lớn hơn khi ngày càng nhiều người chuyển sang thiết bị di động và tránh xa băng thông rộng cố định. Dữ liệu điều tra dân số gần đây của Hoa Kỳ cho thấy người dùng không sử dụng băng thông rộng cố định. Biểu đồ dưới đây cho thấy mức sử dụng Internet di động tại nhà năm 2015 so với năm 2013:
Sử dụng thời gian chờ để xử lý kết nối gián đoạn
Trước đây, các phương thức tấn công sử dụng XHR đã được sử dụng để kiểm tra khả năng kết nối gián đoạn, nhưng trình chạy dịch vụ cho phép các phương pháp đáng tin cậy hơn để đặt thời gian chờ mạng. Bạn có thể thực hiện điều này bằng cách sử dụng WorkManager chỉ với một vài dòng mã:
workboxSW.router.registerRoute(
'/path/to/image',
workboxSW.strategies.networkFirst({networkTimeoutSeconds: 3}),
);
Bạn có thể tìm hiểu thêm về Workbox trong buổi trò chuyện tại Hội nghị Nhà phát triển Chrome dành cho nhà phát triển Chrome của Jeff Posnick, Hộp công việc: Thư viện PWA linh hoạt.
Chức năng thời gian chờ cũng đang được phát triển cho API Tìm nạp và API luồng sẽ giúp ích bằng cách tối ưu hoá việc phân phối nội dung và tránh các yêu cầu nguyên khối. Jake Archibald cung cấp thêm thông tin chi tiết về cách giải quyết vấn đề lie-fi trong phần Tăng tốc tải trang.