Základy spracovania obrazu cez Web Worker

By Technical specialist

Web Worker je samostatný JavaScriptový kontext, ktorý môže robiť náročné výpočty bez toho, aby hlavné vlákno editora robilo všetku prácu. Pri spracovaní obrazu v prehliadači to znamená, že príprava modelu a inferencia môžu bežať mimo vlákna zodpovedného za tlačidlá, správy o priebehu, štetec a obnovu obrazovky.

Výsledok nie je „spracovanie pozadia zadarmo“. To isté zariadenie stále počíta a spotrebúva pamäť. Architektonický prínos je oddelenie: ťažká operácia modelu menej pravdepodobne zablokuje každú odozvu rozhrania, kým beží.

Hlavné vlákno má úlohu používateľského rozhrania

Stránka prehliadača zvyčajne spúšťa JavaScript v hlavnom vlákne. Toto vlákno tiež koordinuje rozloženie, maľovanie a vstup. Ak ho zaberie jeden dlhý výpočet, kliknutia môžu byť oneskorené, animácia sa môže zastaviť a prehliadač môže varovať, že stránka nereaguje.

Editor obrázkov má veľa povinností týkajúcich sa hlavného vlákna ešte predtým, ako sa začne odvodzovanie:

• prijímať výber súboru, vložiť alebo pustiť;
• dekódovať a zobraziť obrázok;
• aktualizovať priebeh a chybové stavy;
• nakreslite náhľadové plátno;
• rukoväte pohybu štetca Pridať a vymazať;
• pripravte akcie sťahovania alebo schránky.

Ak by sa numerická práca segmentačného modelu dostala do rovnakého vlákna, tieto úlohy by si priamo konkurovali. Pracovník vytvára jasnejšiu hranicu.

Hranica založená na správe

Editor a pracovník nezdieľajú bežné premenné. Komunikujú posielaním správ. Zjednodušený postup vyzerá takto:

1. Editor vytvorí alebo opätovne použije pracovníka.
2. Požiada pracovníka, aby inicializoval inferenčný runtime a model.
3. Pripraví obrazové dáta a odošle požiadavku na odvodenie.
4. Pracovník prevedie údaje na očakávaný vstup modelu.
5. Pracovník spustí model a vytvorí hodnoty masky.
6. Pošle späť masku alebo údaje o výsledku.
7. Editor zloží náhľad a umožní spresnenie alebo export.

Správy by mali obsahovať dostatok kontextu, aby sa odpoveď zhodovala so správnou žiadosťou. Toto je dôležité, ak si používateľ vyberie iný obrázok pred dokončením predchádzajúcej úlohy. Rozhranie sa musí vyhýbať zobrazovaniu starého výsledku na novom zdroji.

Kopírovanie a prenos obrazových údajov

Odoslanie malej textovej správy je lacné. Odosielanie miliónov hodnôt pixelov môže byť drahé, ak prehliadač musí skopírovať celú vyrovnávaciu pamäť. Webové rozhrania API môžu namiesto toho preniesť vlastníctvo určitých binárnych vyrovnávacích pamätí. Prenesená vyrovnávacia pamäť sa sprístupní príjemcovi bez toho, aby si na strane odosielateľa ponechal použiteľný duplikát.

Táto optimalizácia prichádza s návrhovým obmedzením: po prenose nemôže odosielateľ naďalej používať rovnakú vyrovnávaciu pamäť, ako keby stále vlastnil údaje. Editor si môže ponechať samostatnú reprezentáciu zobrazenia, vytvoriť vyhradenú vyrovnávaciu pamäť alebo neskôr rekonštruovať, čo potrebuje.

Nie každá implementácia využíva prenos presne na rovnaké miesta. Všeobecným poučením je, že oddelením vlákien nezmizne pohyb údajov. Rozmery obrázka, veľkosť vyrovnávacej pamäte a počet konverzií stále ovplyvňujú latenciu a pamäť.

Čo Easy Background Remover vkladá do pracovníka

Easy Background Remover používa Web Worker s inferenciou prehliadača na segmentáciu na zariadení. Ťažký automatický vystrihovací krok vytvára masku. Editor potom zobrazí zložený výsledok a podporuje spresnenie štetca CPU-canvas.

Toto oddelenie dáva zlyhaniam užitočnejšiu hranicu. Ak sa pracovník nemôže inicializovať alebo zlyhá počas odvodzovania, rozhranie môže nahlásiť chybu súvisiacu s pracovníkom namiesto toho, aby sa spoliehalo na trvalo zamrznutú kartu ako jediný signál.

Tiež udržiava nárok na lokálne spracovanie zrozumiteľný. Odosielanie pixelov zo stránky rozšírenia jej vlastnému pracovníkovi je komunikácia v prostredí prehliadača, nie nahrávanie do API vzdialeného výrezu. Prvá relácia môže samostatne stiahnuť opakovane použiteľný model majetku; pozrite si Prečo prvé spustenie stiahne model.

Pracovník nerobí výpočty okamžite

Pracovníci zlepšujú odozvu, nie surovú schopnosť zariadenia. Model stále spotrebúva CPU, GPU alebo iné runtime zdroje podľa toho, čo môže prehliadač poskytnúť. Veľký vstup môže stále trvať dlhšie a vyžaduje viac pamäte ako malý.

Zostáva niekoľko limitov:

• inicializácia modelu má skutočné náklady;
• pixelové vyrovnávacie pamäte pri kopírovaní zaberajú pamäť na oboch stranách;
• zmena veľkosti a konverzia formátu si vyžaduje čas;
• zariadenia s nízkou pamäťou môžu zápasiť s veľkými obrázkami;
• viac pracovníkov môže zvýšiť spor namiesto toho, aby ho znížilo;
• export a aktualizácie plátna môžu stále zahŕňať hlavné vlákno.

Spustenie piatich odvodňovacích pracovníkov pre päť obrázkov nie je automaticky päťkrát rýchlejšie. Pracovníci zdieľajú rovnaký stroj. Paralelné úlohy môžu súťažiť o šírku pásma pamäte a prostriedky na vykonávanie, pričom každá inštancia modelu môže niesť svoje vlastné náklady na pamäť.

Hlásenie pokroku je kooperatívne

Pracovník môže odosielať stavové správy, ale automaticky nevie, aké percento pokroku bude považovať za presné. Stiahnutie modelu, inicializácia za behu, príprava vstupu, odvodenie, konverzia masky a vykreslenie náhľadu sú samostatné fázy s rôznym načasovaním.

Niektoré fázy majú merateľné počty bajtov. Spustenie jedného modelu môže odhaliť iba „začaté“ a „dokončené“. Hladké percento, ktoré postupuje rovnomerne, môže byť preto skôr kozmetické ako presné meranie.

Užitočné používateľské rozhranie postupu pomenúva fázu, ak je to možné: príprava modelu, spracovanie obrazu alebo výsledok zostavenia. Tiež rieši zlyhanie a zrušenie namiesto toho, aby nechal spinner bez vysvetlenia.

Zrušenie je viac ako skrytie spinneru

Ak používateľ zatvorí obrázok alebo začne odznova, rozhranie môže ignorovať prípadnú odpoveď zo zastaranej požiadavky. Okamžité zastavenie základného výpočtu môže vyžadovať dodatočnú podporu z prostredia runtime alebo ukončenie a opätovné vytvorenie pracovníka.

Ukončenie pracovníka je rozhodujúce, ale zahodí jeho inicializovaný stav. Pri ďalšej úlohe môže byť potrebné znova načítať a inicializovať model. Pri krátkej operácii môže byť označenie výsledku zastarané lacnejšie ako zbúranie všetkého.

Správna voľba závisí od tlaku pamäte, trvania operácie a možností spustenia. Z pohľadu používateľa je dôležité pravidlo, že zastaraná práca nesmie prepísať aktuálnu úpravu.

Aj chyby musia prekročiť hranicu

Výnimka v rámci pracovníka sa nestane bežnou výnimkou hlavného vlákna. Pracovník musí hlásiť použiteľné chyby a editor by mal počúvať zlyhania na úrovni pracovníka.

Dobré spracovanie chýb rozlišuje aspoň:

• modelové aktívum nie je k dispozícii;
• inicializácia modelu zlyhala;
• dekódovanie obrazu alebo príprava vstupu zlyhala;
• dedukcia zlyhala;
• pracovník sa neočakávane zastavil;
• výsledok už nepatrí do aktuálnej požiadavky.

Je to akčnejšie ako všeobecné „niečo sa pokazilo“, najmä keď nastavenie prvého spustenia a bežné spracovanie obrazu majú rôzne riešenia.

Výstup pracovníkov je stále len prvou maskou

Architektúra vlákna sama o sebe nezlepšuje nejednoznačnú hranu. Pracovník môže vrátiť technicky platnú masku, ktorej ešte chýba kožušina, priehľadný materiál, úzke ramienka alebo požadovaný tieň. To sú otázky týkajúce sa segmentácie a zámeru.

Úloha editora sa po odvodení obnoví: prispôsobte masku do pracovného súradnicového systému, vytvorte ukážku, nechajte používateľa upraviť ju a exportujte aktuálny stav. Rozlíšenie masky vs. veľkosť ukážky vysvetľuje, prečo by sa tieto súradnicové systémy nemali zamieňať.

Stručný mentálny model

Predstavte si pracovníka ako miestneho špecialistu za oknom so správou:

• editor vlastní interakciu;
• pracovník vlastní ťažkú ​​inferenčnú úlohu;
• binárne obrazové dáta prekračujú definovanú hranicu;
• pracovník vracia masku, nie hotový úsudok o každej hrane;
• editor zostáva zodpovedný za aktuálny stav, kontrolu, spresnenie a export.

Ak chcete zobraziť samotné pixely modelu, pokračujte v časti Čo vidí model s výrezom na zariadení. Kompletný praktický prehľad nájdete v časti Ako funguje miestne odstránenie na pozadí.