ดูวิธีที่ Adobe จัดการเพื่อให้ผู้ใช้แก้ไขไฟล์ที่ใหญ่ที่สุดในแอป Photoshop อันโด่งดังในเวอร์ชันเว็บได้
เกริ่นนำ
(บทความนี้ยังมีรูปแบบวิดีโออีกด้วย)
ในปี 2021 Adobe และวิศวกร Chrome ได้นำ Photoshop เวอร์ชันหนึ่งมาเผยแพร่บนเว็บ ซอฟต์แวร์นี้ใช้ประโยชน์จาก WebAssembly อย่างสร้างสรรค์ด้วยฟีเจอร์ต่างๆ เช่น SIMD, พื้นที่เก็บข้อมูลประสิทธิภาพสูงในระบบไฟล์ส่วนตัวดั้งเดิม, พื้นที่สี P3 สำหรับ Canvas และคอมโพเนนต์เว็บที่มี Lit ในบทความนี้ เราต้องการเน้นว่าทางวิศวกรรมของ Adobe Photoshop นั้นจัดการกับการทำงานกับไฟล์ที่มีขนาดใหญ่เกินกว่าจะใส่ลงในหน่วยความจำได้อย่างไร และในกรณีของ WebAssembly วิธีที่ Photoshop ทำงานร่วมกับไฟล์ที่มีขนาดใหญ่กว่าพื้นที่ที่อยู่ 32 บิตของ Wasm32
ปัญหา
การเปิดไฟล์เพื่อแก้ไขต้องใช้หน่วยความจำปริมาณมาก ซึ่งมากกว่าการเปิดไฟล์เพื่อดูเป็นอย่างมาก ไฟล์ที่แก้ไขใน Photoshop มักใช้หน่วยความจำมากกว่าที่ผู้ใช้มีในอุปกรณ์ เนื่องจากมีคุณลักษณะมากมายที่ซอฟต์แวร์มีให้ ประเภทของการออกแบบและการแก้ไขแบบดิจิทัลที่ใช้ และความสามารถของอุปกรณ์ของผู้ใช้
รูปแบบไฟล์ Photoshop จะเก็บข้อมูลที่มีการบีบอัดข้อมูลแบบไม่สูญเสียข้อมูล เมื่ออ่านไฟล์หรือเอกสาร ระบบจะคลายการบีบอัดข้อมูลรูปภาพทั้งหมดเพื่อให้การประมวลผลมีประสิทธิภาพมากขึ้น ผลที่ตามมาคือปริมาณหน่วยความจำที่ต้องการอาจมากกว่าปริมาณพื้นที่ที่เอกสารใช้ในดิสก์หรือในพื้นที่เก็บข้อมูลระบบคลาวด์หลายเท่า
Photoshop สนับสนุนประวัติการเลิกทำที่มีขนาดใหญ่มาก การดำเนินการหลายอย่างใน Photoshop เป็นสิ่งที่เราเรียกว่าการดำเนินการแบบทำลายล้าง กล่าวคือ การแก้ไข เช่น การวาดภาพด้วยแปรง จะทำให้ได้ข้อมูลพิกเซลใหม่ซึ่งอาจมีขนาดใหญ่เท่ากับข้อมูลพิกเซลเดิม การแก้ไขเหล่านี้ในเซสชันการแก้ไขที่ใช้เวลานานจะทำให้มีข้อมูลพิกเซลจำนวนมากที่ต้องเก็บไว้เพื่อให้สามารถดำเนินการยกเลิกได้ ดังนั้น ประวัติจึงอาจมีข้อมูลถึงหลายร้อยเมกะไบต์หรือหลายกิกะไบต์
อุปกรณ์และแพลตฟอร์มต่างๆ ไม่ว่าจะเป็นเครื่องเดสก์ท็อป อุปกรณ์เคลื่อนที่ หรือเบราว์เซอร์ ต่างก็จัดการหน่วยความจำ บางคนมีน้ำใจมากกว่ารายอื่นๆ ในแง่ปริมาณหน่วยความจำที่พร้อมใช้งานในแอปพลิเคชัน ปริมาณหน่วยความจำจะแตกต่างกันไปในแต่ละอุปกรณ์ด้วย เนื่องจากคุณทราบเมื่อสั่งซื้อคอมพิวเตอร์หรืออุปกรณ์ใหม่ และระบุจำนวนหน่วยความจำเข้าถึงโดยสุ่ม (RAM) ที่ต้องการ แพลตฟอร์มเหล่านี้จำนวนมากยังรองรับหน่วยความจำเสมือน ซึ่งช่วยให้แอปพลิเคชันใช้หน่วยความจำมากกว่าที่มีอยู่จริงได้ การสนับสนุนนี้จะแตกต่างกันไปตามระบบปฏิบัติการและรันไทม์ เช่นในกรณีของ WebAssembly แอปพลิเคชันอาจเข้าถึงหรือใช้งานไม่ได้ทันที ยิ่งไปกว่านั้น ระบบเสมือนจริงสมัยใหม่ยังมีขีดจำกัดสูงสุดซึ่งเป็นไปตามข้อกำหนดของ Photoshop ได้ง่ายๆ
โดยหลักการแล้ว แอปพลิเคชันจะใช้หน่วยความจำมากเท่าที่ต้องการ ซึ่งโดยทั่วไปจะช่วยให้แคมเปญมอบประสิทธิภาพที่ดีที่สุดให้แก่ผู้ใช้ อย่างไรก็ตาม หากใช้หน่วยความจำมากเกินไป แพลตฟอร์มรันไทม์อาจถูกลงโทษหรือหน่วยความจำไม่พอ ส่งผลให้เกิดความล้มเหลว
ตามข้อมูลที่ผ่านมา ปัญหาเดิมที่ Photoshop ต้องแก้ไขคือการแก้ไขไฟล์ที่มีความละเอียดสำหรับการพิมพ์ใน macOS เวอร์ชันแรกๆ โดยมีขนาดต่ำ 1 MB สําหรับระบบปฏิบัติการและแอปพลิเคชันทั้งหมด รูปภาพแบบเต็มหน้าขนาด 300 dpi ใน CMYK จะมีขนาดประมาณ 32 MB เมื่อไม่ได้บีบอัด
การแก้ปัญหา
Photoshop ได้ใช้ระบบหน่วยความจำเสมือน (VM) เพื่อแก้ปัญหาแอปใช้ RAM เกินปริมาณที่มีอยู่ Photoshop ใช้ VM เพื่อจัดการข้อมูลเอกสาร โดยเฉพาะข้อมูลรูปภาพ ประวัติและสถานะเลิกทำทั้งหมด รวมถึงพื้นที่เก็บข้อมูลที่ใช้งานได้สำหรับคำสั่งปัจจุบัน นอกจากนี้ยังใช้เพื่อแคชข้อมูลขนาดใหญ่ เช่น รายละเอียดแปรง เพื่อให้มีอนุกรมวิธานจากดิสก์เพียงครั้งเดียวเท่านั้น
ตัวอย่างจากแง่มุมหนึ่งที่ VM จัดการ ข้อมูลรูปภาพจะจัดเก็บโดยใช้การนําเสนอ mipmap ซึ่งเป็นชุดชิ้นส่วนแบบพีระมิด ให้ข้อมูลภาพในช่วงความละเอียดต่ำไปสูง วิธีนี้จะช่วยให้ Photoshop สามารถทำงานกับข้อมูลความละเอียดที่เหมาะสมเพื่อการตอบสนองที่รวดเร็วขึ้นเมื่อซูมเข้าหรือดูตัวอย่าง เมื่อเทียบกับการย่อ
ในระหว่างการเริ่มต้นแอปพลิเคชัน Photoshop จะกำหนดจำนวน RAM ที่ใช้ได้ ซึ่งจะจัดสรรข้อมูลไว้ 1 ส่วนใน VM RAM ที่เหลืออยู่จะพร้อมใช้งานสำหรับความต้องการแอปพลิเคชันอื่นๆ ผ่านไลบรารีรันไทม์ C++ มาตรฐาน หน่วยความจำ VM จะแบ่งออกเป็นหน้า ปกติแล้วแต่ละหน้าจะเป็นขนาดเท่าของขนาดหน้าฮาร์ดแวร์ของอุปกรณ์ เมื่อใช้สำหรับข้อมูลรูปภาพ ระบบจะอ้างอิงหน่วยความจำเป็นชิ้นส่วน ชิ้นส่วนเป็นพื้นที่สี่เหลี่ยมจัตุรัสจำนวนพิกเซลของเลเยอร์เดียว ซึ่งรวมถึงขอบเขตเรขาคณิต การ์ดใช้หน้าอย่างน้อย 1 หน้า
Photoshop สร้างไฟล์ขูดอย่างน้อย 1 ไฟล์เพื่อมอบการสำรองข้อมูลแบบใช้ดิสก์สำหรับหน้า VM ไฟล์ขูดเหล่านี้จัดเก็บไว้ในระบบไฟล์ส่วนตัวต้นทาง ภาพหน้าจอแสดงลำดับชั้นของไฟล์ที่เป็นตัวอย่างของไฟล์ขูดดังกล่าว (ไฮไลต์ด้วยสีเหลือง) และไฟล์อื่นๆ ระหว่างเซสชันการแก้ไขรูปภาพ ไฟล์ Scratch แต่ละไฟล์มีหน้า VM ได้หลายหน้า เมื่อ VM ต้องการการสำรองข้อมูลเพิ่มเติม ระบบจะสร้างไฟล์ Scratch เพิ่มเติม เมื่อมีการเพิ่มพื้นที่ว่างแล้ว หน้าเว็บในไฟล์ขูดจะนำกลับมาใช้ซ้ำกับหน้าเว็บใหม่ได้
เมื่อประมวลผลข้อมูลภาพ Photoshop จะดำเนินการซ้ำบนชิ้นส่วนภาพ และดำเนินการคำนวณพิกเซล การคำนวณแต่ละครั้งจะอ้างอิงหลายชิ้นส่วนได้ VM มีหน้าที่ตรวจสอบว่าชิ้นส่วนต้นทางและปลายทางสําหรับการทำซ้ำปัจจุบันอยู่ในหน่วยความจำแล้ว โดยโหลดจากไฟล์ Scratch ตามที่จําเป็น ในขณะเดียวกัน คุณก็สามารถล้างหน้าเป็นไฟล์ Scratch เพื่อเพิ่มพื้นที่ในหน่วยความจำได้
บทสรุป
แม้ว่ารายละเอียดการใช้งาน VM ที่เป็นรูปธรรมจะก้าวไปไกลกว่าขอบเขตของเอกสารนี้ (และเป็นกรรมสิทธิ์ของ Adobe ด้วย) ด้วยคำอธิบายระดับสูงของโซลูชัน เราได้ให้คุณอยู่ในฐานะที่คุณสามารถทำความเข้าใจวิธีที่ Photoshop จัดการกับไฟล์ขนาดใหญ่ได้ ระบบไฟล์ส่วนตัวดั้งเดิมที่มีสิทธิ์อ่านและเขียนไฟล์เป็นองค์ประกอบสำคัญของโซลูชันนี้
กิตติกรรมประกาศ
บล็อกโพสต์นี้ได้รับการตรวจสอบโดย Oliver Unter Ecker และ Rachel Andrew ขอขอบคุณเป็นพิเศษสำหรับ Russell Williams สำหรับเอกสารประกอบที่ยอดเยี่ยมเกี่ยวกับ Photoshop VM