Web Worker 影像處理基礎知識
Web Worker 是一個獨立的 JavaScript 執行上下文,它可以執行昂貴的計算,而不需要讓編輯器的主執行緒完成所有工作。對於瀏覽器影像處理,這意味著模型設定和推理可以脫離負責按鈕、進度訊息、畫筆輸入和螢幕更新的執行緒。
結果不是“免費後台處理”。同一設備仍然執行計算並使用記憶體。架構的好處是分離:繁重的模型操作不太可能在運行時阻止每個介面回應。
主執行緒有一個使用者介面作業
瀏覽器頁面通常在主執行緒上執行 JavaScript。該線程還協調佈局、繪製和輸入。如果長時間的計算佔用了它,點擊可能會感覺延遲,動畫可能會停止,並且瀏覽器可能會警告頁面沒有回應。
在推理開始之前,圖像編輯器就具有大量主執行緒職責:
- 接收檔案選擇、貼上或刪除;
- 解碼並顯示圖像;
- 更新進度和錯誤狀態;
- 繪製預覽畫布;
- 處理新增和擦除畫筆移動;
- 準備下載或剪貼簿操作。
將分割模型的數值工作放在同一執行緒上將使這些任務直接競爭。工人創造了更清晰的界線。
基於訊息的邊界
編輯器和工作器不共用普通變數。他們透過發送訊息進行交流。簡化的流程如下:
- 編輯器建立或重複使用worker。 2.它要求worker初始化推理運行時和模型。
- 準備圖像資料並發送推理請求。
- Worker 將資料轉換為模型的預期輸入。
- 工作人員運行模型並產生遮罩值。
- 發回掩碼或結果資料。
- 編輯器合成預覽並啟用細化或匯出。
訊息應包含足夠的上下文以符合對正確請求的回應。如果使用者在上一個作業完成之前選擇另一個圖像,這一點很重要。介面必須避免在新來源上顯示舊結果。
複製和傳輸影像數據
發送小簡訊很便宜。如果瀏覽器必須複製整個緩衝區,則發送數百萬像素值的成本可能會很高。 Web API 可以轉移某些二進位緩衝區的所有權。傳輸的緩衝區可供接收方使用,而無需在傳送方保留可用的副本。
這種最佳化有設計限制:傳輸後,發送方無法繼續使用相同的緩衝區,就好像它仍然擁有資料一樣。編輯器可以保留單獨的顯示表示,建立專用的推理緩衝區,或重建稍後需要的內容。
並非每個實作都在完全相同的位置使用傳輸。一般的教訓是線程分離不會使資料移動消失。影像尺寸、緩衝區大小和轉換次數仍然會影響延遲和記憶體。
Easy Background Remover 在工人中放入了什麼
Easy Background Remover 使用帶有瀏覽器推理運行時的 Web Worker 進行設備上分段。重型自動剪切步驟產生遮罩。然後編輯器顯示合成結果並支援CPU畫布畫筆細化。
這種分離為故障提供了更有用的邊界。如果工作器無法初始化或在推理過程中崩潰,則介面可以報告與工作器相關的錯誤,而不是依賴永久凍結的選項卡作為唯一訊號。
它還使本地處理聲明易於理解。將像素從擴充頁面傳送到自己的工作人員是瀏覽器環境內的通信,而不是上傳到遠端剪切 API。第一會話可以單獨下載可重複使用的模型資源;請參閱為什麼首次運行會下載模型。
Worker 不會立即進行計算
工作人員提高反應能力,而不是原始設備能力。此模型仍根據瀏覽器可以提供的資源消耗 CPU、GPU 或其他執行時間資源。較大的輸入仍然比較小的輸入花費更長的時間並且需要更多的記憶體。
仍然存在一些限制:
- 模型初始化有實際成本;
- 如果複製,像素緩衝區會佔用兩側的記憶體;
- 調整大小和格式轉換需要時間;
- 低記憶體設備可能難以處理大圖像;
- 更多的工人可以增加爭用而不是減少爭用;
- 匯出和畫布更新仍然可以涉及主執行緒。
為五個影像啟動五個推理工作器不會自動加快五倍。工人們共用同一台機器。平行作業可以競爭記憶體頻寬和執行資源,而每個模型實例可能會承擔自己的記憶體成本。
進度報告是合作的
工作人員可以發送狀態訊息,但它不會自動知道什麼進度百分比會感覺準確。模型下載、運行時初始化、輸入準備、推理、掩模轉換和預覽渲染是具有不同時序的獨立階段。
某些階段具有可測量的位元組數。單一模型執行可能隻公開「開始」和「完成」。因此,均勻增長的平滑百分比可能只是裝飾性的,而不是精確的測量。
有用的進度 UI 會盡可能命名階段:準備模型、處理映像或建立結果。它還可以處理失敗和取消,而不是讓旋轉器沒有任何解釋。
取消不只是隱藏微調器
如果用戶關閉圖像或重新開始,介面可以忽略過時請求的最終回應。立即停止底層運算可能需要執行時間的額外支援或終止並重新建立工作執行緒。
終止一個工作進程是決定性的,但它會丟棄其初始化狀態。下一個作業可能需要再次載入並初始化模型。對於短期操作,將結果標記為陳舊可能比拆除所有內容更便宜。
正確的選擇取決於記憶體壓力、操作持續時間和運行時能力。從使用者的角度來看,重要的規則是過時的工作不得覆蓋當前的編輯。
錯誤也需要跨越邊界
工作執行緒內部的異常不會成為正常的主執行緒異常。工作人員必須報告可用的錯誤,編輯器應該偵聽工作人員等級的故障。
良好的錯誤處理至少可以區分:
- 模型資源不可用;
- 模型初始化失敗;
- 影像解碼或輸入準備失敗;
- 推理失敗;
- 工人意外停下來;
- 結果不再屬於目前請求。
這比一般的「出了問題」更具可操作性,特別是當首次運行設定和正常影像處理有不同的補救措施時。
Worker 輸出仍然只是第一個掩碼
執行緒架構本身並不能改善模糊邊緣。工作人員可以退回技術上有效的面具,但仍缺少毛皮、透明材料、窄帶或所需的陰影。這些是細分和意圖問題。
推理後,編輯器的工作繼續進行:將蒙版縮放到工作坐標系中,合成預覽,讓使用者對其進行細化,然後導出當前狀態。 蒙版解析度與預覽尺寸 解釋了為什麼不應混淆這些座標系。
簡潔的心智模型
將工作人員視為訊息視窗後面的本地專家:
- 編輯擁有互動;
- 工人承擔繁重的推理任務;
- 二值影像資料跨越定義的邊界;
- 工人回傳一個掩模,而不是對每個邊緣的最終判斷;
- 編輯仍然負責當前狀態、審查、完善和導出。
對於模型對像素本身的視圖,請繼續裝置上剪下模型所看到的內容。有關端到端的實用概述,請參閱本機背景刪除的工作原理。