พื้นฐานการประมวลผลภาพ Web Worker

By Technical specialist

Web Worker เป็นบริบทการดำเนินการ JavaScript แยกต่างหากที่สามารถทำการคำนวณราคาแพงโดยไม่ต้องให้เธรดหลักของตัวแก้ไขทำงานทั้งหมด สำหรับการประมวลผลรูปภาพของเบราว์เซอร์ นั่นหมายถึงการตั้งค่าโมเดลและการอนุมานสามารถหนีจากเธรดที่รับผิดชอบเกี่ยวกับปุ่ม ข้อความความคืบหน้า อินพุตแปรง และการอัปเดตหน้าจอ

ผลลัพธ์ไม่ใช่ “การประมวลผลพื้นหลังแบบอิสระ” อุปกรณ์เดิมยังคงทำการคำนวณและใช้หน่วยความจำ ประโยชน์ทางสถาปัตยกรรมคือการแยกออกจากกัน: การดำเนินการกับโมเดลจำนวนมากมีโอกาสน้อยที่จะบล็อกการตอบสนองของอินเทอร์เฟซทั้งหมดในขณะที่ทำงาน

เธรดหลักมีงานอินเทอร์เฟซผู้ใช้

โดยปกติแล้วหน้าเบราว์เซอร์จะรัน JavaScript บนเธรดหลัก เธรดนั้นยังประสานโครงร่าง การลงสี และการป้อนข้อมูลด้วย หากมีการคำนวณที่ยาวนานเกิดขึ้น การคลิกอาจรู้สึกว่าล่าช้า ภาพเคลื่อนไหวอาจหยุดลง และเบราว์เซอร์อาจเตือนว่าหน้าเว็บไม่ตอบสนอง

โปรแกรมแก้ไขรูปภาพมีหน้าที่รับผิดชอบในเธรดหลักมากมายก่อนที่จะเริ่มการอนุมาน:

• รับการเลือกไฟล์ วาง หรือวาง;
• ถอดรหัสและแสดงภาพ
• อัปเดตความคืบหน้าและสถานะข้อผิดพลาด
• วาดผืนผ้าใบแสดงตัวอย่าง;
• จัดการการเคลื่อนไหวของแปรงเพิ่มและลบ;
• เตรียมการดำเนินการดาวน์โหลดหรือคลิปบอร์ด

การวางงานเชิงตัวเลขของโมเดลการแบ่งส่วนในเธรดเดียวกันจะทำให้งานเหล่านั้นแข่งขันกันโดยตรง คนงานสร้างขอบเขตที่ชัดเจนขึ้น

ขอบเขตตามข้อความ

ผู้แก้ไขและผู้ปฏิบัติงานไม่ได้ใช้ตัวแปรทั่วไปร่วมกัน พวกเขาสื่อสารโดยการส่งข้อความ โฟลว์แบบง่ายมีลักษณะดังนี้:

1. ตัวแก้ไขสร้างหรือนำผู้ปฏิบัติงานกลับมาใช้ใหม่
2. ขอให้ผู้ปฏิบัติงานเริ่มต้นรันไทม์และโมเดลการอนุมาน
3. เตรียมข้อมูลภาพและส่งคำขออนุมาน
4. ผู้ปฏิบัติงานแปลงข้อมูลให้เป็นอินพุตที่คาดหวังของโมเดล
5. ผู้ปฏิบัติงานรันโมเดลและสร้างค่ามาสก์
6. ส่งข้อมูลมาสก์หรือผลลัพธ์กลับมา
7. ตัวแก้ไขจะรวมการแสดงตัวอย่างและเปิดใช้งานการปรับแต่งหรือส่งออก

ข้อความควรมีบริบทเพียงพอที่จะจับคู่การตอบสนองต่อคำขอที่ถูกต้อง สิ่งนี้สำคัญหากผู้ใช้เลือกรูปภาพอื่นก่อนที่งานก่อนหน้าจะเสร็จสิ้น อินเทอร์เฟซจะต้องหลีกเลี่ยงการแสดงผลลัพธ์เก่าเหนือแหล่งใหม่

การคัดลอกและถ่ายโอนข้อมูลภาพ

การส่งข้อความขนาดเล็กมีราคาถูก การส่งค่าพิกเซลนับล้านอาจมีราคาแพงหากเบราว์เซอร์ต้องคัดลอกบัฟเฟอร์ทั้งหมด Web API สามารถโอนความเป็นเจ้าของบัฟเฟอร์ไบนารีบางตัวแทนได้ บัฟเฟอร์ที่ถ่ายโอนจะพร้อมใช้งานสำหรับผู้รับโดยไม่ต้องเก็บสำเนาที่ใช้งานได้ไว้ทางฝั่งผู้ส่ง

การปรับให้เหมาะสมนั้นมาพร้อมกับข้อจำกัดในการออกแบบ: หลังจากถ่ายโอนแล้ว ผู้ส่งจะไม่สามารถใช้บัฟเฟอร์เดิมต่อไปได้ราวกับว่ายังคงเป็นเจ้าของข้อมูลอยู่ ผู้แก้ไขอาจเก็บการแสดงแยกต่างหาก สร้างบัฟเฟอร์การอนุมานเฉพาะ หรือสร้างสิ่งที่ต้องการใหม่ในภายหลัง

ไม่ใช่ว่าการใช้งานทุกครั้งจะใช้การถ่ายโอนในตำแหน่งเดียวกันทุกประการ บทเรียนทั่วไปก็คือการแยกเธรดไม่ได้ทำให้การเคลื่อนย้ายข้อมูลหายไป ขนาดรูปภาพ ขนาดบัฟเฟอร์ และจำนวนการแปลงยังคงส่งผลต่อเวลาแฝงและหน่วยความจำ

สิ่งที่ Easy Background Remover ใส่ไว้ในผู้ปฏิบัติงาน

Easy Background Remover ใช้ Web Worker พร้อมรันไทม์การอนุมานของเบราว์เซอร์สำหรับการแบ่งส่วนบนอุปกรณ์ ขั้นตอนการตัดอัตโนมัติอย่างหนักจะสร้างหน้ากาก จากนั้นตัวแก้ไขจะแสดงผลลัพธ์แบบคอมโพสิตและรองรับการปรับแต่งแปรงของ CPU-canvas

การแยกนี้จะทำให้ความล้มเหลวมีขอบเขตที่เป็นประโยชน์มากขึ้น หากผู้ปฏิบัติงานไม่สามารถเริ่มต้นหรือหยุดทำงานในระหว่างการอนุมาน อินเทอร์เฟซสามารถรายงานข้อผิดพลาดที่เกี่ยวข้องกับผู้ปฏิบัติงาน แทนที่จะอาศัยแท็บที่ตรึงไว้อย่างถาวรเป็นสัญญาณเดียว

นอกจากนี้ยังทำให้การอ้างสิทธิ์ในการประมวลผลในพื้นที่สามารถเข้าใจได้ การส่งพิกเซลจากหน้าส่วนขยายไปยังผู้ปฏิบัติงานของตนเองถือเป็นการสื่อสารภายในสภาพแวดล้อมของเบราว์เซอร์ ไม่ใช่การอัปโหลดไปยัง API คัตเอาท์ระยะไกล เซสชันแรกอาจดาวน์โหลดเนื้อหาโมเดลที่ใช้ซ้ำได้แยกกัน ดู เหตุใดการรันครั้งแรกจึงดาวน์โหลดโมเดล

คนทำงานไม่ได้ทำการคำนวณแบบทันที

พนักงานปรับปรุงการตอบสนอง ไม่ใช่ความสามารถของอุปกรณ์ดิบ โมเดลยังคงใช้ CPU, GPU หรือทรัพยากรรันไทม์อื่นๆ ตามสิ่งที่เบราว์เซอร์สามารถให้ได้ การป้อนข้อมูลขนาดใหญ่อาจใช้เวลานานกว่าและต้องการหน่วยความจำมากกว่าการป้อนข้อมูลขนาดเล็ก

ยังมีข้อจำกัดหลายประการ:

• การเริ่มต้นโมเดลมีค่าใช้จ่ายจริง
• บัฟเฟอร์พิกเซลใช้หน่วยความจำทั้งสองด้านหากคัดลอก
• การปรับขนาดและการแปลงรูปแบบต้องใช้เวลา
• อุปกรณ์ที่มีหน่วยความจำเหลือน้อยอาจประสบปัญหากับภาพขนาดใหญ่
• คนงานจำนวนมากขึ้นสามารถเพิ่มความขัดแย้งแทนที่จะลดน้อยลง
• การอัปเดตการส่งออกและ Canvas ยังคงเกี่ยวข้องกับเธรดหลัก

การเริ่มต้นผู้ปฏิบัติงานอนุมานห้าคนสำหรับห้าภาพไม่ได้เร็วขึ้นห้าเท่าโดยอัตโนมัติ คนงานใช้เครื่องจักรเดียวกัน งานคู่ขนานสามารถแย่งชิงแบนด์วิธหน่วยความจำและทรัพยากรการดำเนินการได้ ในขณะที่อินสแตนซ์แต่ละรุ่นอาจมีต้นทุนหน่วยความจำของตัวเอง

การรายงานความคืบหน้าเป็นความร่วมมือ

พนักงานสามารถส่งข้อความสถานะได้ แต่จะไม่ทราบโดยอัตโนมัติว่าเปอร์เซ็นต์ความคืบหน้าจะรู้สึกถูกต้องหรือไม่ การดาวน์โหลดโมเดล การเริ่มต้นรันไทม์ การเตรียมอินพุต การอนุมาน การแปลงมาสก์ และการแสดงตัวอย่างเป็นเฟสที่แยกจากกันโดยมีช่วงเวลาต่างกัน

บางเฟสมีจำนวนไบต์ที่วัดได้ การดำเนินการแบบจำลองเดียวอาจเปิดเผยเฉพาะ “เริ่มต้น” และ “เสร็จสิ้น” เท่านั้น เปอร์เซ็นต์ที่ราบรื่นซึ่งก้าวหน้าอย่างสม่ำเสมอจึงอาจดูสวยงามมากกว่าการวัดที่แม่นยำ

UI ความคืบหน้าที่เป็นประโยชน์จะตั้งชื่อเฟสเมื่อเป็นไปได้: การเตรียมโมเดล การประมวลผลภาพ หรือผลลัพธ์การสร้าง นอกจากนี้ยังจัดการกับความล้มเหลวและการยกเลิก แทนที่จะปล่อยให้เครื่องปั่นด้ายโดยไม่มีคำอธิบาย

การยกเลิกเป็นมากกว่าการซ่อนสปินเนอร์

หากผู้ใช้ปิดรูปภาพหรือเริ่มต้นใหม่ อินเทอร์เฟซสามารถเพิกเฉยต่อการตอบสนองในท้ายที่สุดจากคำขอที่ล้าสมัย การหยุดการคำนวณพื้นฐานทันทีอาจต้องได้รับการสนับสนุนเพิ่มเติมจากรันไทม์หรือการยกเลิกและสร้างผู้ปฏิบัติงานขึ้นใหม่

การเลิกจ้างผู้ปฏิบัติงานถือเป็นการตัดสินใจเด็ดขาด แต่จะละทิ้งสถานะเริ่มต้นของผู้ปฏิบัติงาน งานถัดไปอาจต้องโหลดและเริ่มต้นโมเดลอีกครั้ง สำหรับการดำเนินการระยะสั้น การทำเครื่องหมายผลลัพธ์ที่เก่าอาจมีราคาถูกกว่าการทำลายทุกอย่าง

ตัวเลือกที่ถูกต้องขึ้นอยู่กับแรงกดดันของหน่วยความจำ ระยะเวลาการทำงาน และความสามารถของรันไทม์ จากมุมมองของผู้ใช้ กฎสำคัญคืองานเก่าต้องไม่เขียนทับการแก้ไขปัจจุบัน

ผิดพลาดก็ต้องข้ามเขตด้วย

ข้อยกเว้นภายในผู้ปฏิบัติงานไม่กลายเป็นข้อยกเว้นของเธรดหลักปกติ ผู้ปฏิบัติงานต้องรายงานข้อผิดพลาดที่ใช้งานได้ และผู้แก้ไขควรรับฟังความล้มเหลวในระดับผู้ปฏิบัติงาน

การจัดการข้อผิดพลาดที่ดีต้องแยกแยะอย่างน้อย:

• สินทรัพย์โมเดลไม่พร้อมใช้งาน
• การเริ่มต้นโมเดลล้มเหลว
• การถอดรหัสรูปภาพหรือการเตรียมอินพุตล้มเหลว
• การอนุมานล้มเหลว
• คนงานหยุดทำงานกะทันหัน
• ผลลัพธ์ไม่ได้เป็นของคำขอปัจจุบันอีกต่อไป

สิ่งนี้สามารถดำเนินการได้ดีกว่า “มีบางอย่างผิดพลาด” ทั่วไป โดยเฉพาะอย่างยิ่งเมื่อการตั้งค่าการเรียกใช้ครั้งแรกและการประมวลผลภาพปกติมีวิธีแก้ไขที่แตกต่างกัน

ผลลัพธ์ของผู้ปฏิบัติงานยังคงเป็นเพียงมาสก์แรกเท่านั้น

สถาปัตยกรรมเธรดไม่ได้ปรับปรุงขอบที่คลุมเครือด้วยตัวเอง พนักงานสามารถคืนหน้ากากที่มีความถูกต้องทางเทคนิคแต่ยังขาดขน วัสดุโปร่งใส สายแคบ หรือเงาที่ต้องการ นั่นคือคำถามเกี่ยวกับการแบ่งส่วนและเจตนา

งานของบรรณาธิการจะดำเนินการต่อหลังจากการอนุมาน: ปรับขนาดมาสก์ลงในระบบพิกัดการทำงาน ประกอบการแสดงตัวอย่าง ให้ผู้ใช้ปรับแต่ง และส่งออกสถานะปัจจุบัน ความละเอียดมาสก์เทียบกับขนาดตัวอย่าง อธิบายว่าทำไมระบบพิกัดเหล่านั้นจึงไม่ควรสับสน

แบบจำลองจิตที่กระชับ

ให้คิดว่าพนักงานเป็นผู้เชี่ยวชาญในท้องถิ่นที่อยู่ด้านหลังหน้าต่างข้อความ:

• บรรณาธิการเป็นเจ้าของการโต้ตอบ
• คนงานเป็นเจ้าของงานอนุมานที่หนักหน่วง
• ข้อมูลภาพไบนารีข้ามขอบเขตที่กำหนด
• พนักงานส่งคืนหน้ากาก ไม่ใช่การตัดสินที่เสร็จสิ้นเกี่ยวกับขอบทุกด้าน
• ผู้แก้ไขยังคงรับผิดชอบสถานะปัจจุบัน การตรวจสอบ การปรับแต่ง และการส่งออก

หากต้องการดูพิกเซลของโมเดล ให้ดำเนินการต่อใน สิ่งที่โมเดลคัตเอาท์บนอุปกรณ์เห็น สำหรับภาพรวมในทางปฏิบัติตั้งแต่ต้นจนจบ โปรดดู วิธีการทำงานของการลบพื้นหลังในเครื่อง