WebAssembly: ความหมาย ข้อดี กรณีใช้งาน และอื่นๆ

เผยแพร่แล้ว: 2022-10-12

WebAssembly หรือ Wasm เป็นรูปแบบรหัสไบนารีสำหรับการสร้างโปรแกรมที่สามารถทำงานบนสถาปัตยกรรมคอมพิวเตอร์ใดๆ

ระบบประกอบด้วยเครื่องเสมือนและคอมไพเลอร์ที่แปลรหัสคอมพิวเตอร์จากภาษาการเขียนโปรแกรม เช่น C หรือ C++ เป็นรูปแบบ .wat ที่มนุษย์อ่านได้ และรูปแบบไบนารี .wasm

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

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

สารบัญ

WebAssembly คืออะไร?

WebAssembly เป็นรูปแบบรหัสไบนารีที่ทำงานบนเครื่องเสมือนและสามารถคอมไพล์ภาษาต่างๆ ได้ ได้รับการออกแบบมาให้พกพาสะดวกและสามารถทำงานบนเว็บเบราว์เซอร์หรือเป็นแอปพลิเคชันเซิร์ฟเวอร์

WebAssembly เปิดตัวครั้งแรกในปี 2560 เป็นคำแนะนำของ W3C ตั้งแต่ปี 2019 และได้รับการดูแลโดยผู้มีส่วนร่วมจำนวนมาก รวมถึง Mozilla, Google, Microsoft, Red Hat และอีกมากมาย

เป้าหมายเดิมคือการพัฒนาความเร็วในการดำเนินการที่ใกล้เคียงกับเจ้าของภาษาดังที่คุณจะพบกับแอปพลิเคชัน C/C++ ภายในเบราว์เซอร์ นอกจากนี้ยังเป็นมาตรฐานเว็บที่ปลอดภัย มาตรฐานเปิด ดีบักได้ และไม่มีเวอร์ชันที่เข้ากันได้แบบย้อนหลังและสอดคล้องกับ JavaScript

WebAssembly ทำงานอย่างไร

WebAssembly ได้รับการออกแบบให้เป็นเครื่องมือรันไทม์ เช่น Java หรือ JavaScript ที่สามารถฝังในเบราว์เซอร์หรือสภาพแวดล้อมเซิร์ฟเวอร์เพื่อเรียกใช้โค้ดคอมพิวเตอร์ที่คอมไพล์ในรูปแบบข้อความ .wasm binary หรือ .wat

ในการเขียนโค้ดสำหรับการดำเนินการ WebAssembly นักพัฒนาซอฟต์แวร์จะเขียนโปรแกรมในภาษาที่รองรับมากมาย จากนั้นคอมไพล์โดยใช้คอมไพเลอร์ WebAssembly ทั้ง AOT (Ahead of Time) หรือ JIT (ทันเวลา)

รหัสนี้สามารถทำงานได้ส่วนใหญ่ในสภาพแวดล้อมการดำเนินการ แต่ไม่สามารถเข้าถึงหรือแก้ไขวัตถุ DOM ของเบราว์เซอร์ได้ การโต้ตอบดังกล่าวจะต้องผ่าน JavaScript

วิธีสร้างตัวอย่างแอปพลิเคชัน WebAssembly

การสร้างแอปพลิเคชัน Wasm อย่างง่ายสำหรับเว็บเบราว์เซอร์สามารถทำได้ด้วยขั้นตอนเพียงไม่กี่ขั้นตอนดังที่คุณเห็นด้านล่าง:

  1. ดาวน์โหลดและติดตั้ง Emscripten SDK
  2. เขียนตัวอย่างโค้ด helloworld.c หรือเขียนในภาษา C++/Rust หากต้องการ
  3. รัน emcc helloworld.c -s WASM=1 -s helloworld.html ในเทอร์มินัลเพื่อคอมไพล์โค้ดไปยัง WebAssembly ด้วย Emscripten มันจะสร้างไฟล์ Wasm binary, HTML และ JavaScript ที่คุณต้องการ (โค้ดกาว)
  4. ให้บริการหน้า helloworld.html ผ่านเว็บเบราว์เซอร์ของคุณ

ข้อดีของ WebAssembly

มีเหตุผลหลายประการในการนำ WebAssembly และเทคโนโลยีที่เกี่ยวข้องมาใช้ ได้แก่:

  • Near-Native Performance – WebAssembly มีการออกแบบระดับต่ำซึ่งให้การแสดงที่คล้ายกับภาษาระดับต่ำเช่น C และ C ++
  • ความปลอดภัย – ระบบได้รับการออกแบบมาให้ปลอดภัยโดยแยกระบบออกจากสภาพแวดล้อมเสมือนที่มีการเข้าถึงระบบอย่างจำกัด
  • มาตรฐานแบบเปิด – องค์กรและบุคคลจำนวนมากมีส่วนร่วมใน WebAssembly และเป็นคำแนะนำอย่างเป็นทางการของ W3C
  • น้ำหนักเบา - WebAssembly คอมไพล์เป็นรหัสไบนารีเพื่อดำเนินการในเครื่องเสมือน รหัสนี้เป็นแบบพกพาและไม่ต้องการหรือมาพร้อมกับไฟล์ระบบ
  • รองรับหลายภาษา – มากกว่า 50 ภาษาสามารถคอมไพล์ลงใน WebAssembly
  • แพลตฟอร์มอิสระ – เครื่องเสมือน WebAssembly ได้รับการออกแบบสำหรับแต่ละสถาปัตยกรรมเพื่อนำเสนอสภาพแวดล้อมรันไทม์เดียวกัน นักพัฒนาทั้งหมดต้องทำคือเขียนโค้ดสำหรับ WebAssembly

ข้อจำกัดของ WebAssembly

  • อยู่ระหว่างดำเนิน การ – มาตรฐานยังอยู่ในระหว่างการพัฒนา ดังนั้นคุณสมบัติและการปรับปรุงมากมายยังมาไม่ถึง
  • ไม่มีการรวบรวมขยะ – WebAssembly ยังคงขาดการรวบรวมขยะ แม้ว่ามันอาจจะถูกนำไปใช้ในไม่ช้า
  • ไม่มีการเข้าถึง DOM – คุณไม่สามารถเข้าถึง DOM ของเว็บเบราว์เซอร์ได้โดยตรงจาก WebAssembly คุณจะต้องใช้ JavaScript

WebAssembly กับ Java

Java เป็นการนำ WebAssembly ไปใช้งานที่เร็วที่สุด มันถูกออกแบบให้เป็นภาษาเขียนครั้งเดียว เรียกใช้ได้ทุกที่ แต่ได้พัฒนาปัญหามากมายไปพร้อมกัน

เช่นเดียวกับ Java WebAssembly ใช้ RE (Runtime Environment) เพื่อรันโค้ด แต่แตกต่างจาก Java คุณสามารถเขียน WebAssembly ในภาษาที่คุณเลือกได้

WebAssembly Vs JavaScript

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

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

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

WebAssembly Vs Docker Vs Kubernetes

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

ในทางกลับกัน Kubernetes เป็นระบบโอเพ่นซอร์สเพื่อจัดการและปรับใช้แอปพลิเคชันที่มีคอนเทนเนอร์ เช่น Docker, CRI-O, containerd และการนำ Kubernetes CRI (Container Runtime Interface) ไปใช้ Kubernetes ยังช่วยให้ปรับขนาดการใช้งานระบบคลาวด์ในเซิร์ฟเวอร์หลายเครื่องหรือเครื่องเสมือนได้อย่างง่ายดาย

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

นอกเหนือจากเบราว์เซอร์

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

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

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

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

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

สำหรับข้อมูลเพิ่มเติม โปรเจ็กต์อย่าง WasmCloud และ WasmEdge กำลังพัฒนา WebAssembly ให้เป็นแพลตฟอร์มการประมวลผลที่ทำงานได้

Wasm ใช้กรณี

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

ประเภทของเบราว์เซอร์ในเบราว์เซอร์สามารถอธิบายตนเองได้ และส่วนภายนอกเบราว์เซอร์อ้างอิงถึงเซิร์ฟเวอร์ IoT และการปรับใช้คลาวด์เป็นส่วนใหญ่ ในขณะที่ไฮบริดหมายถึงการผสมผสานระหว่างสองสิ่งนี้

ต่อไปนี้เป็นตัวอย่างกรณีการใช้งานที่ Wasm สามารถเก่งได้:

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

ต่อไปนี้คือการดูแอปพลิเคชันและสถานการณ์เฉพาะที่ Wasm สามารถทำได้:

  • การตัดต่อวิดีโอและรูปภาพ
  • การออกแบบเกม
  • แอปพลิเคชั่น AI
  • แอปพลิเคชั่นเสมือนจริง & เติมความเป็นจริง
  • แอปพลิเคชั่นเพลง
  • แอปพลิเคชัน P2P
  • แอปพลิเคชันฝั่งเซิร์ฟเวอร์
  • การคำนวณแบบคลาวด์/คลัสเตอร์
  • การออกแบบโดยใช้คอมพิวเตอร์ช่วย
  • การจำลองแพลตฟอร์มระบบปฏิบัติการ
  • การเข้ารหัส
  • เว็บเซิร์ฟเวอร์ในพื้นที่
  • แอปพลิเคชั่นเดสก์ท็อประยะไกล
  • การสร้างภาพทางวิทยาศาสตร์
  • แอพไฮบริดเนทีฟบนสมาร์ทโฟน
  • บนอุปกรณ์ IoT

รายการภาษาและกรอบงานที่รองรับ

มากกว่า 50 ภาษาที่คอมไพล์เป็น WebAssembly และนี่คือบางส่วนที่ได้รับความนิยมมากที่สุด:

  • C++
  • R
  • ทับทิม
  • Swift
  • ไป
  • Kotlin
  • สนิม
  • PHP
  • Blazor – เฟรมเวิร์กสำหรับนักพัฒนา .NET
  • JwebAssembly – คอมไพเลอร์สำหรับ Java bytecode และภาษาที่เกี่ยวข้องเช่น JRuby, Jython, Groovy, Scala และ Kotlin
  • Yew – เฟรมเวิร์ก Rust สำหรับสร้างเว็บแอปแบบมัลติเธรดโดยใช้ WebAssembly
  • AssemblyScript – ภาษาที่ออกแบบมาเพื่อสร้างโค้ด WebAssembly โดยเฉพาะ
  • Grain – ภาษาที่ใช้งานได้ดี
  • Motoko

คุณสามารถหาภาษาเพิ่มเติมได้ที่นี่

รายการรันไทม์และเครื่องมือของ WebAssembly

  • เบราว์เซอร์หลักทั้งหมดรองรับ Wasm
  • Pyodide – รันไทม์ของ Python บนเบราว์เซอร์ที่มีสแต็คทางวิทยาศาสตร์ของ Python รวมถึง Pandas, NumPy, SciPy
  • อบอุ่น
  • wagi – สำหรับไมโครเซอร์วิสและเว็บแอป
  • Wasi – ส่วนต่อประสานระบบโมดูลาร์
  • WasmTime – รันไทม์ WebAssembly ที่รวดเร็วและปลอดภัย
  • Wasmer
  • Lucet
  • wasmCloud – สภาพแวดล้อมคลาวด์
  • Krustlet – Kubernetes kublete สำหรับการเรียกใช้ Wasm เขียนด้วยภาษา Rust
  • WasmEdge – สภาพแวดล้อมรันไทม์บนคลาวด์และขอบ

บทสรุป

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

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