Khái niệm cơ bản về xử lý hình ảnh của Web Worker

By Technical specialist

Web Worker là một bối cảnh thực thi JavaScript riêng biệt có thể thực hiện các phép tính tốn kém mà không khiến luồng chính của trình soạn thảo thực hiện tất cả công việc. Đối với việc xử lý hình ảnh của trình duyệt, điều đó có nghĩa là việc thiết lập và suy luận mô hình có thể chạy khỏi luồng chịu trách nhiệm về các nút, thông báo tiến trình, đầu vào bằng bút vẽ và cập nhật màn hình.

Kết quả không phải là “xử lý nền miễn phí”. Thiết bị tương tự vẫn thực hiện tính toán và sử dụng bộ nhớ. Lợi ích về mặt kiến trúc là sự tách biệt: một hoạt động mô hình nặng ít có khả năng chặn mọi phản hồi giao diện trong khi nó chạy.

Main thread có nhiệm vụ giao diện người dùng

Một trang trình duyệt thường chạy JavaScript trên một luồng chính. Chủ đề đó cũng điều phối bố cục, vẽ tranh và đầu vào. Nếu một phép tính dài chiếm giữ nó, các nhấp chuột có thể bị chậm, hoạt ảnh có thể dừng và trình duyệt có thể cảnh báo rằng trang không phản hồi.

Trình chỉnh sửa hình ảnh có nhiều trách nhiệm về luồng chính trước khi bắt đầu suy luận:

nhận được lựa chọn, dán hoặc thả tập tin;
giải mã và hiển thị hình ảnh;
cập nhật tiến trình và trạng thái lỗi;
vẽ canvas xem trước;
xử lý chuyển động Thêm và Xóa cọ vẽ;
chuẩn bị hành động tải xuống hoặc clipboard.

Việc đặt công việc số học của mô hình phân đoạn trên cùng một luồng sẽ khiến các nhiệm vụ đó cạnh tranh trực tiếp. Một công nhân tạo ra một ranh giới rõ ràng hơn.

Ranh giới dựa trên tin nhắn

Trình soạn thảo và nhân viên không chia sẻ các biến thông thường. Họ giao tiếp bằng cách gửi tin nhắn. Một luồng đơn giản hóa trông như thế này:

Trình soạn thảo tạo hoặc sử dụng lại một công nhân.
Nó yêu cầu nhân viên khởi tạo mô hình và thời gian chạy suy luận.
Nó chuẩn bị dữ liệu hình ảnh và gửi yêu cầu suy luận.
Công nhân chuyển đổi dữ liệu thành đầu vào dự kiến của mô hình.
Công nhân chạy mô hình và tạo ra các giá trị mặt nạ.
Nó sẽ gửi lại dữ liệu mặt nạ hoặc kết quả.
Trình chỉnh sửa tổng hợp bản xem trước và cho phép sàng lọc hoặc xuất.

Tin nhắn phải bao gồm đủ ngữ cảnh để khớp phản hồi với yêu cầu chính xác. Điều này quan trọng nếu người dùng chọn một hình ảnh khác trước khi công việc trước đó kết thúc. Giao diện phải tránh hiển thị kết quả cũ trên nguồn mới.

Sao chép và truyền dữ liệu hình ảnh

Gửi một tin nhắn văn bản nhỏ là rẻ. Việc gửi hàng triệu giá trị pixel có thể tốn kém nếu trình duyệt phải sao chép toàn bộ bộ đệm. Thay vào đó, API Web có thể chuyển quyền sở hữu một số bộ đệm nhị phân nhất định. Bộ đệm được chuyển sẽ có sẵn cho người nhận mà không giữ lại bản sao có thể sử dụng được ở phía người gửi.

Việc tối ưu hóa đó đi kèm với một hạn chế về thiết kế: sau khi truyền, người gửi không thể tiếp tục sử dụng cùng một bộ đệm như thể họ vẫn sở hữu dữ liệu. Trình soạn thảo có thể giữ lại một biểu diễn hiển thị riêng biệt, tạo bộ đệm suy luận chuyên dụng hoặc xây dựng lại những gì nó cần sau này.

Không phải mọi triển khai đều sử dụng chuyển giao ở những nơi giống hệt nhau. Bài học chung là việc tách luồng không làm cho chuyển động của dữ liệu biến mất. Kích thước hình ảnh, kích thước bộ đệm và số lượng chuyển đổi vẫn ảnh hưởng đến độ trễ và bộ nhớ.

Những gì Easy Background Remover đặt vào công nhân

Easy Background Remover sử dụng Web Worker với thời gian chạy suy luận của trình duyệt để phân đoạn trên thiết bị. Bước cắt tự động nặng nề tạo ra mặt nạ. Sau đó, trình chỉnh sửa sẽ hiển thị kết quả tổng hợp và hỗ trợ tinh chỉnh cọ vẽ CPU-canvas.

Sự tách biệt này mang lại cho những thất bại một ranh giới hữu ích hơn. Nếu nhân viên không thể khởi tạo hoặc gặp sự cố trong quá trình suy luận, giao diện có thể báo cáo lỗi liên quan đến nhân viên thay vì dựa vào tab bị đóng băng vĩnh viễn làm tín hiệu duy nhất.

Nó cũng giúp cho yêu cầu xử lý cục bộ trở nên dễ hiểu. Việc gửi pixel từ một trang tiện ích tới nhân viên của chính nó là hoạt động giao tiếp trong môi trường trình duyệt chứ không phải tải lên API cắt bỏ từ xa. Phiên đầu tiên có thể tải xuống riêng nội dung mô hình có thể sử dụng lại; xem Tại sao lần chạy đầu tiên lại tải xuống một mô hình.

Một công nhân không thực hiện tính toán ngay lập tức

Công nhân cải thiện khả năng phản hồi chứ không phải khả năng của thiết bị thô. Mô hình vẫn tiêu thụ CPU, GPU hoặc các tài nguyên thời gian chạy khác tùy theo những gì trình duyệt có thể cung cấp. Đầu vào lớn vẫn có thể mất nhiều thời gian hơn và cần nhiều bộ nhớ hơn đầu vào nhỏ.

Một số giới hạn vẫn còn:

việc khởi tạo mô hình có chi phí thực tế;
bộ đệm pixel chiếm bộ nhớ trên cả hai mặt nếu được sao chép;
thay đổi kích thước và chuyển đổi định dạng mất thời gian;
thiết bị có bộ nhớ thấp có thể gặp khó khăn với hình ảnh lớn;
nhiều công nhân hơn có thể làm gia tăng sự tranh chấp thay vì giảm bớt nó;
cập nhật xuất và canvas vẫn có thể liên quan đến luồng chính.

Việc bắt đầu năm công nhân suy luận cho năm hình ảnh không tự động nhanh hơn năm lần. Các công nhân dùng chung một máy. Các công việc song song có thể cạnh tranh về băng thông bộ nhớ và tài nguyên thực thi, trong khi mỗi phiên bản mô hình có thể có chi phí bộ nhớ riêng.

Báo cáo tiến độ mang tính hợp tác

Một nhân viên có thể gửi thông báo trạng thái, nhưng nó không tự động biết phần trăm tiến độ nào sẽ chính xác. Tải xuống mô hình, khởi tạo thời gian chạy, chuẩn bị đầu vào, suy luận, chuyển đổi mặt nạ và hiển thị bản xem trước là các giai đoạn riêng biệt với thời gian khác nhau.

Một số giai đoạn có số byte có thể đo được. Một lần thực thi mô hình duy nhất có thể chỉ hiển thị “đã bắt đầu” và “đã kết thúc”. Do đó, một tỷ lệ phần trăm mượt mà tăng lên đồng đều có thể mang tính thẩm mỹ hơn là một phép đo chính xác.

Giao diện người dùng tiến trình hữu ích đặt tên cho giai đoạn khi có thể: chuẩn bị mô hình, xử lý hình ảnh hoặc xây dựng kết quả. Nó cũng xử lý lỗi và hủy thay vì để lại một vòng quay mà không có lời giải thích.

Việc hủy bỏ không chỉ là việc ẩn một vòng quay

Nếu người dùng đóng hình ảnh hoặc bắt đầu lại, giao diện có thể bỏ qua phản hồi cuối cùng từ yêu cầu lỗi thời. Việc dừng tính toán cơ bản ngay lập tức có thể yêu cầu hỗ trợ bổ sung từ thời gian chạy hoặc chấm dứt và tạo lại trình chạy.

Việc chấm dứt một công nhân là quyết định nhưng nó sẽ loại bỏ trạng thái khởi tạo của nó. Công việc tiếp theo có thể cần tải và khởi tạo lại mô hình. Đối với một hoạt động ngắn, việc đánh dấu kết quả cũ có thể rẻ hơn việc phá bỏ mọi thứ.

Lựa chọn chính xác phụ thuộc vào áp lực bộ nhớ, thời lượng hoạt động và khả năng chạy. Từ quan điểm của người dùng, quy tắc quan trọng là tác phẩm cũ không được ghi đè lên bản chỉnh sửa hiện tại.

Lỗi cũng cần vượt qua ranh giới

Một ngoại lệ bên trong một công nhân không trở thành một ngoại lệ bình thường của luồng chính. Công nhân phải báo cáo các lỗi có thể sử dụng được và người chỉnh sửa phải lắng nghe các lỗi ở cấp độ công nhân.

Xử lý lỗi tốt ít nhất phân biệt được:

nội dung mô hình không có sẵn;
khởi tạo mô hình không thành công;
giải mã hình ảnh hoặc chuẩn bị đầu vào không thành công;
suy luận thất bại;
công nhân dừng đột ngột;
kết quả không còn thuộc về yêu cầu hiện tại.

Điều này dễ thực hiện hơn là thông báo chung chung “đã xảy ra sự cố”, đặc biệt khi quá trình thiết lập lần đầu và quá trình xử lý hình ảnh thông thường có các biện pháp khắc phục khác nhau.

##Đầu ra của công nhân vẫn chỉ là chiếc khẩu trang đầu tiên

Kiến trúc luồng tự nó không cải thiện một cạnh không rõ ràng. Người lao động có thể trả lại một chiếc khẩu trang hợp lệ về mặt kỹ thuật nhưng vẫn thiếu lông, chất liệu trong suốt, dây đeo hẹp hoặc độ bóng mong muốn. Đó là những câu hỏi về phân khúc và ý định.

Công việc của người chỉnh sửa sẽ tiếp tục sau khi suy luận: chia tỷ lệ mặt nạ thành hệ tọa độ làm việc, tổng hợp bản xem trước, cho phép người dùng tinh chỉnh nó và xuất trạng thái hiện tại. Độ phân giải mặt nạ so với kích thước xem trước giải thích lý do không nên nhầm lẫn các hệ tọa độ đó.

Một mô hình tinh thần ngắn gọn

Hãy coi nhân viên này như một chuyên gia địa phương đằng sau cửa sổ tin nhắn:

người biên tập sở hữu sự tương tác;
công nhân sở hữu nhiệm vụ suy luận nặng nề;
dữ liệu ảnh nhị phân vượt qua một ranh giới xác định;
người công nhân trả lại một chiếc mặt nạ, không phải là một bản án hoàn chỉnh về mọi khía cạnh;
người biên tập vẫn chịu trách nhiệm về trạng thái hiện tại, đánh giá, sàng lọc và xuất.

Để biết chế độ xem pixel của chính mô hình, hãy tiếp tục với Mô hình cắt bỏ trên thiết bị nhìn thấy gì. Để biết thông tin tổng quan thực tế toàn diện, hãy xem Cách hoạt động của tính năng xóa nền cục bộ.