การเพิ่มประสิทธิภาพ WebAssembly และ WebGPU สำหรับ Web AI ที่เร็วขึ้น ตอนที่ 1

ดูวิธีที่การเพิ่มประสิทธิภาพ WebAssembly และ WebGPU ช่วยปรับปรุงประสิทธิภาพของแมชชีนเลิร์นนิงในเว็บ

Austin Eng
Austin Eng
Deepti Gandluri
Deepti Gandluri
François Beaufort
François Beaufort

การอนุมาน AI บนเว็บ

เราต่างเคยได้ยินเรื่องราวนี้ว่า AI กำลังเปลี่ยนแปลงโลกของเรา เว็บก็เหมือนกัน

ปีนี้ Chrome ได้เพิ่มฟีเจอร์ Generative AI ซึ่งรวมถึงการสร้างธีมที่กำหนดเองและการช่วยคุณเขียนข้อความฉบับร่างแรก แต่ AI เป็นมากกว่านั้น เพราะ AI สามารถยกระดับเว็บแอปพลิเคชันด้วยตนเองได้

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

ปัจจุบันการอนุมานโดย AI บนเว็บพร้อมให้ใช้งานในอุปกรณ์ส่วนใหญ่ และการประมวลผลด้วย AI อาจเกิดขึ้นในหน้าเว็บโดยใช้ประโยชน์จากฮาร์ดแวร์ในอุปกรณ์ของผู้ใช้

กระบวนการนี้มีประสิทธิภาพได้จากหลายสาเหตุ เช่น

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

วิธีการทำงานของภาระงาน AI บนเว็บในปัจจุบัน

ปัจจุบันนักพัฒนาแอปพลิเคชันและนักวิจัยสร้างโมเดลโดยใช้เฟรมเวิร์ก โมเดลจะเรียกใช้ในเบราว์เซอร์โดยใช้รันไทม์ เช่น Tensorflow.js หรือ ONNX Runtime Web และรันไทม์ก็ใช้ประโยชน์จาก Web API สำหรับการดำเนินการ

สุดท้าย รันไทม์เหล่านั้นทั้งหมดจะไปถึงการทำงานบน CPU ผ่าน JavaScript หรือ WebAssembly หรือบน GPU ผ่าน WebGL หรือ WebGPU

แผนภาพแสดงวิธีการทำงานของภาระงาน AI บนเว็บในปัจจุบัน

ภาระงานของแมชชีนเลิร์นนิง

ภาระงานของแมชชีนเลิร์นนิง (ML) จะพุช tensors ผ่านกราฟของโหนดที่คำนวณแล้ว Tensor คืออินพุตและเอาต์พุตของโหนดเหล่านี้ซึ่งทำการคำนวณข้อมูลจำนวนมาก

ซึ่งเป็นสิ่งสำคัญเนื่องจากเหตุผลต่อไปนี้

  • Tensor เป็นโครงสร้างข้อมูลที่ใหญ่มากซึ่งจะคำนวณจากโมเดลที่มีน้ำหนักหลายพันล้าน
  • การปรับขนาดและการอนุมานอาจทําให้เกิดข้อมูลพร้อมกัน ซึ่งหมายความว่าจะมีการดำเนินการแบบเดียวกันกับองค์ประกอบทั้งหมดใน tensors
  • ส่วน ML ไม่จำเป็นต้องใช้ความแม่นยำ คุณอาจต้องใช้เลขทศนิยม 64 บิตเพื่อลงจอดบนดวงจันทร์ แต่เฉพาะทะเลหมายเลข 8 บิตหรือน้อยกว่านั้นเพื่อการจดจำใบหน้า

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

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

WebAssembly

WebAssembly (Wasm) เป็นรูปแบบโค้ดไบต์ขนาดกะทัดรัดและมีประสิทธิภาพซึ่งรันไทม์สามารถทำความเข้าใจและดำเนินการได้ ซอฟต์แวร์นี้ออกแบบมาเพื่อใช้ประโยชน์จากความสามารถของฮาร์ดแวร์พื้นฐาน เพื่อให้ทำงานได้ด้วยความเร็วที่ใกล้เคียงกัน โค้ดจะได้รับการตรวจสอบและดำเนินการในสภาพแวดล้อมแบบแซนด์บ็อกซ์ที่ปลอดภัยหน่วยความจำ

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

ข้อกำหนด WebAssembly เป็นแบบทำซ้ำและเคยทำงานในกลุ่มชุมชน W3C แบบเปิด

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

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

ภาพประกอบแล็ปท็อป แท็บเล็ต และโทรศัพท์

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

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

WebAssembly คือ CPU แบบพกพาของ CPU ดังนั้นการอนุมาน Wasm ทั้งหมดจะทำงานบน CPU แม้ว่าจะไม่ใช่ตัวเลือกที่มีประสิทธิภาพที่สุด แต่ CPU ก็มีให้ใช้งานอย่างกว้างขวางและทำงานได้กับภาระงานส่วนใหญ่ในอุปกรณ์ส่วนใหญ่

GPU จะมีราคาสูงสำหรับภาระงานขนาดเล็ก เช่น ภาระงานข้อความหรือเสียง มีตัวอย่างล่าสุดจำนวนหนึ่งที่ Wasm เป็นตัวเลือกที่เหมาะสม:

คุณยังค้นพบได้มากยิ่งขึ้นในการสาธิตโอเพนซอร์ส เช่น whisper-tiny, llama.cpp และ Gemma2B ที่กำลังทำงานในเบราว์เซอร์

ใช้แนวทางที่เปิดกว้างต่อแอปพลิเคชันของคุณ

คุณควรเลือกตัวเลือกพื้นฐานตามโมเดล ML, โครงสร้างพื้นฐานของแอปพลิเคชัน และประสบการณ์การใช้งานโดยรวมที่ต้องการสำหรับผู้ใช้

ตัวอย่างเช่น ในการตรวจจับจุดสังเกตสำหรับใบหน้าของ MediaPipe การอนุมาน CPU และการอนุมาน GPU นั้นเปรียบเทียบกันได้ (ทำงานในอุปกรณ์ Apple M1) แต่ก็มีบางรุ่นที่ค่าความแปรปรวนสูงกว่าอย่างมีนัยสำคัญ

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

  • แสดงส่วนขยาย CPU ที่สำคัญต่อประสิทธิภาพ
  • เปิดใช้การเรียกใช้โมเดลที่มีขนาดใหญ่ขึ้น
  • เปิดใช้การทำงานร่วมกันอย่างราบรื่นกับ API อื่นๆ ของเว็บ

ประมวลผลเร็วขึ้น

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

โปรดทราบว่าโมเดล ML ไม่จำเป็นต้องใช้ความแม่นยำสูงเสมอไป SIMD แบบผ่อนคลาย เป็นข้อเสนอที่ลดข้อกำหนดที่เข้มงวดบางอย่างที่ไม่ใช่การกำหนด และทำให้โค้ด Gen ที่เร็วขึ้นสำหรับการดำเนินการเวกเตอร์บางอย่างที่เป็นจุดแข็งสำหรับประสิทธิภาพ นอกจากนี้ SIMD แบบผ่อนคลายยังได้แนะนําผลิตภัณฑ์จุดแบบใหม่และวิธีการ FMA ที่ช่วยเพิ่มความเร็วของภาระงานที่มีอยู่จาก 1.5-3 เท่า โดยจัดส่งใน Chrome 114

รูปแบบจุดลอยตัวแบบครึ่งความแม่นยำใช้ 16 บิตสำหรับ IEEE FP16 แทน 32 บิตที่ใช้สำหรับค่าความแม่นยำเดี่ยว เมื่อเทียบกับค่าความแม่นยําแบบเดี่ยวแล้ว มีข้อดีหลายอย่างในการใช้ค่าความแม่นยําแบบครึ่งเดียว ลดความต้องการหน่วยความจำ ทำให้สามารถฝึกและใช้งานโครงข่ายประสาทขนาดใหญ่ แบนด์วิดท์หน่วยความจำลดลง ความแม่นยำลดลงช่วยให้การโอนข้อมูลและการคำนวณทางคณิตศาสตร์ได้เร็วขึ้น

โมเดลขนาดใหญ่

ตัวชี้ไปยังหน่วยความจำเชิงเส้น Wasm จะแสดงเป็นจำนวนเต็ม 32 บิต ซึ่งมีผลกระทบ 2 ประการ ได้แก่ ขนาดฮีปจะถูกจำกัดไว้ที่ 4 GB (เมื่อคอมพิวเตอร์มี RAM จริงมากกว่านั้น) และโค้ดแอปพลิเคชันที่กำหนดเป้าหมาย Wasm จะต้องเข้ากันได้กับตัวชี้ขนาด 32 บิต (ซึ่ง)

โดยเฉพาะอย่างยิ่งกับโมเดลขนาดใหญ่อย่างที่เรามีในปัจจุบัน การโหลดโมเดลเหล่านี้ลงใน WebAssembly อาจมีการจำกัด ข้อเสนอ Memory64 จะนำข้อจำกัดเหล่านี้ออกเพราะหน่วยความจำเชิงเส้นให้มีขนาดใหญ่กว่า 4 GB และตรงกับพื้นที่ที่อยู่ของแพลตฟอร์มเนทีฟ

เรากำลังติดตั้งใช้งานอย่างเต็มรูปแบบใน Chrome และคาดว่าจะพร้อมให้บริการภายในปีนี้ สำหรับตอนนี้ คุณสามารถทำการทดสอบด้วย Flag chrome://flags/#enable-experimental-webassembly-features และส่งความคิดเห็นให้เราได้

การทำงานร่วมกันบนเว็บที่ดียิ่งขึ้น

WebAssembly สามารถเป็นจุดแรกเข้าสำหรับการประมวลผลวัตถุประสงค์พิเศษบนเว็บ

คุณสามารถใช้ WebAssembly เพื่อนำแอปพลิเคชัน GPU มาสู่เว็บ ซึ่งหมายความว่าแอปพลิเคชัน C++ เดียวกันที่สามารถทำงานในอุปกรณ์สามารถทำงานบนเว็บได้ โดยไม่ต้องปรับเปลี่ยนบางอย่าง

Emscripten ซึ่งเป็น Toolchain ของคอมไพเลอร์ Wasm มีการเชื่อมโยงสำหรับ WebGPU แล้ว เนื่องจากเป็นจุดแรกเข้าสำหรับการอนุมาน AI ในเว็บ ดังนั้น Wasm จึงต้องทำงานร่วมกับแพลตฟอร์มเว็บอื่นๆ ได้อย่างราบรื่น เรากำลังปรับปรุงข้อเสนอที่แตกต่างกัน 2-3 รายการในส่วนนี้

การผสานรวมสัญญาเกี่ยวกับ JavaScript (JSPI)

แอปพลิเคชัน C และ C++ ทั่วไป (และภาษาอื่นๆ อีกมากมาย) มักเขียนโดยใช้ API แบบซิงโครนัส ซึ่งหมายความว่าแอปพลิเคชันจะหยุดการดำเนินการจนกว่าการดำเนินการจะเสร็จสมบูรณ์ แอปพลิเคชันการบล็อกดังกล่าวมักจะเขียนง่ายกว่าแอปพลิเคชันแบบ Async-Aware

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

ตัวอย่างต่อไปนี้คือการคำนวณฟีโบนักชี โดยใช้คำสัญญา JavaScript สำหรับการเพิ่ม

long promiseFib(long x) {
 if (x == 0)
   return 0;
 if (x == 1)
   return 1;
 return promiseAdd(promiseFib(x - 1), promiseFib(x - 2));
}
// promise an addition
EM_ASYNC_JS(long, promiseAdd, (long x, long y), {
  return Promise.resolve(x+y);
});
emcc -O3 fib.c -o b.html -s ASYNCIFY=2

ในตัวอย่างนี้ โปรดคำนึงถึงสิ่งต่อไปนี้

  • มาโคร EM_ASYNC_JS จะสร้าง Glue Code ที่จำเป็นทั้งหมดเพื่อให้เราใช้ JSPI ในการเข้าถึงผลลัพธ์ของสัญญาได้ เช่นเดียวกับที่ทำในฟังก์ชันปกติ
  • ตัวเลือกบรรทัดคำสั่งพิเศษ -s ASYNCIFY=2 การดำเนินการนี้จะเรียกใช้ตัวเลือกในการสร้างโค้ดที่ใช้ JSPI เพื่ออินเทอร์เฟซกับการนำเข้า JavaScript ซึ่งส่งกลับคำสัญญา

ดูข้อมูลเพิ่มเติมเกี่ยวกับ JSPI วิธีใช้งาน และประโยชน์ของเครื่องมือนี้ได้ที่ขอแนะนำ WebAssembly JavaScript Promise Integration API ที่ v8.dev ดูข้อมูลเกี่ยวกับช่วงทดลองใช้จากต้นทางปัจจุบัน

การควบคุมหน่วยความจำ

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

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

เลือกแบ็กเอนด์ที่เหมาะกับคุณ

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

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

อ่านส่วนที่ 2 ต่อ