วิธีที่เรานำ Google Earth มาสู่เว็บ

ปรับปรุงการเข้าถึง Google Earth ข้ามเบราว์เซอร์ด้วย WebAssembly

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

ซึ่งเราได้ทําเช่นนั้นกับ Google Earth ที่พร้อมให้ใช้งานในรุ่นเบต้าตัวอย่างบน WebAssembly แล้ววันนี้ โปรดทราบว่าเวอร์ชันนี้ยังเป็น Google Earth รุ่นเบต้าและอาจไม่ราบรื่นเหมือนที่คุณเคยใช้ (ลองใช้ Earth สำหรับเว็บเวอร์ชันปกติ) คุณทดลองใช้เบต้านี้ได้ใน Chrome และเบราว์เซอร์อื่นๆ ที่ใช้ Chromium ซึ่งรวมถึง Edge (เวอร์ชัน Canary), Opera และ Firefox ลองใช้เวอร์ชันเบต้านี้เพื่อหาแรงบันดาลใจหากคุณกำลังมองหาการรองรับข้ามเบราว์เซอร์ที่ดีขึ้นสําหรับแอปพลิเคชันเฉพาะแพลตฟอร์ม

เหตุผลที่เราเลือก WebAssembly สำหรับ Google Earth

เดิมทีเราเขียนโค้ดส่วนใหญ่ของ Google Earth เป็น C++ เนื่องจากเป็นแอปพลิเคชันบนเดสก์ท็อปที่มีไว้สำหรับติดตั้ง จากนั้นเราก็พอร์ตแอปไปยัง Android และ iOS ได้เมื่อสมาร์ทโฟนได้รับความนิยม โดยเก็บโค้ดฐาน C++ ส่วนใหญ่ไว้โดยใช้ NDK และ Objective-C++ ในปี 2017 เมื่อเรานำ Earth มาใช้บนเว็บ เราใช้ Native Client (NaCl) เพื่อคอมไพล์โค้ด C++ และเรียกใช้ในเบราว์เซอร์ Chrome

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

ภาพหน้าจอของ Earth ที่แสดงหอไอเฟล

ชุดข้อความเกี่ยวกับชุดข้อความย่อย

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

WebAssembly แบบหลายเธรดอาศัยฟีเจอร์ของเบราว์เซอร์ที่เรียกว่า SharedArrayBuffer ซึ่งถูกดึงออกจากเบราว์เซอร์หลังจากมีการเปิดเผยช่องโหว่ด้านความปลอดภัย Spectre และ Meltdown ทีมรักษาความปลอดภัยของ Chrome ได้เปิดตัวการแยกเว็บไซต์ใน Chrome สำหรับระบบปฏิบัติการเดสก์ท็อปทั้งหมดเพื่อลดความเสียหายที่อาจเกิดขึ้นจากการโจมตี การแยกเว็บไซต์จะจำกัดกระบวนการแสดงผลแต่ละรายการไว้สำหรับเอกสารจากเว็บไซต์เดียว เมื่อใช้ฟีเจอร์ด้านความปลอดภัยนี้ Chrome จึงเปิดใช้ SharedArrayBuffer อีกครั้งสำหรับเดสก์ท็อป ซึ่งทำให้เราใช้ WebAssembly แบบหลายเธรดกับ Earth for Chrome ได้

เบราว์เซอร์อื่นๆ กำลังดำเนินการแยกเว็บไซต์หรือการลดความเสี่ยงอื่นๆ เพื่อเปิดใช้ SharedArrayBuffer อีกครั้ง ในระหว่างนี้ Earth จะทำงานแบบเธรดเดียวในเบราว์เซอร์เหล่านั้น

วิธีที่ WebAssembly ทำงานร่วมกับเบราว์เซอร์ต่างๆ

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

Edge

Edge กำลังจะกลายเป็นประสบการณ์การพัฒนา 2 แบบที่แตกต่างกันตามทางเลือกของ Microsoft ที่จะย้ายจากโปรแกรมแสดงผล EdgeHTML ไปใช้โปรแกรมแสดงผลที่ทำงานบน Chromium ขณะนี้ Google Earth เวอร์ชันเบต้าใน WebAssembly จะไม่ทำงานใน Edge เวอร์ชันสาธารณะปัจจุบันเนื่องจากไม่รองรับ WebGL2 ปัญหานี้จะได้รับการแก้ไขเมื่อ Edge เวอร์ชันใหม่ที่ใช้ Chromium เปิดตัวในอนาคตอันใกล้ ในระหว่างนี้ คุณสามารถดาวน์โหลด Edge เวอร์ชัน Canary และพบว่า Earth ใช้งานได้ค่อนข้างดี

Chrome

Chrome รองรับ WebAssembly อย่างเต็มรูปแบบ รวมถึงการแยกหลายชุดข้อความบนเดสก์ท็อป คุณจึงมั่นใจได้ว่า Earth จะทำงานได้ราบรื่นยิ่งขึ้น อย่างไรก็ตาม เราหวังว่า Chrome จะเพิ่มการรองรับการจัดสรรหน่วยความจำแบบไดนามิกด้วยชุดข้อความแบบหลายรายการใน WebAssembly ในระหว่างนี้ Earth อาจเริ่มไม่สำเร็จในอุปกรณ์ที่มีหน่วยความจำจํากัด (เช่น เครื่อง 32 บิต)

Firefox

Firefox รองรับ WebAssembly ได้ดี แต่ปิดใช้การรองรับชุดข้อความแบบหลายรายการ คุณจึงอาจพบว่าการใช้งาน Earth ช้าลง เราหวังว่า Mozilla จะกลับมารองรับชุดข้อความแบบหลายรายการในเวอร์ชันในอนาคต แต่ข้อดีคือ Firefox รองรับการจัดสรรหน่วยความจำแบบไดนามิก

โอเปร่า

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

Safari

Safari มีการใช้งาน WebAssembly ที่มีประสิทธิภาพ แต่ยังไม่รองรับ WebGL2 อย่างเต็มรูปแบบ ดังนั้น Earth ที่ใช้ WebAssembly จึงไม่สามารถทำงานใน Safari กล่าวโดยละเอียดคือ Shader บางรายการต้องใช้ GLSL 1.2 เราหวังว่า Earth จะพร้อมใช้งานใน Safari ด้วยเมื่อมีการรองรับ WebGL2 ที่ดียิ่งขึ้น

เราหวังว่าจะมีการใช้ฟีเจอร์ WebAssembly มากขึ้น

เราทํางานมาอย่างยาวนานเพื่อทำให้ Earth พร้อมใช้งานบนเว็บ เมื่อประมาณ 6 ปีก่อน เราเริ่มต้นด้วยเดโมภายในที่ใช้ asm.js เวอร์ชันแรก ซึ่งได้รับการดูแลรักษาและขยายการให้บริการตลอดหลายปีที่ผ่านมา จากนั้นจึงแปลงเป็นรุ่น WebAssembly ของ Earth เนื่องจาก WebAssembly กลายเป็นมาตรฐานที่ W3C ยอมรับ

เรายังต้องพัฒนา WebAssembly และ Earth ไปอีกมาก กล่าวโดยละเอียดคือ เราต้องการเปลี่ยนไปใช้แบ็กเอนด์ LLVM โดยใช้ Emscripten (เครื่องมือทางเทคนิคในการสร้าง WebAssembly จากโค้ด C++) การเปลี่ยนแปลงนี้จะช่วยให้รองรับ SIMD ในอนาคต รวมถึงเครื่องมือแก้ไขข้อบกพร่องที่มีประสิทธิภาพมากขึ้น เช่น แผนที่ซอร์สโค้ดสําหรับโค้ดภาษาต้นฉบับ สิ่งที่เราหวังว่าจะเห็นคือการนํา OffscreenCanvas มาใช้และการรองรับการจัดสรรหน่วยความจําแบบไดนามิกใน WebAssembly อย่างเต็มรูปแบบ แต่เรารู้ว่าเรากำลังเดินไปในทิศทางที่ถูกต้อง WebAssembly คืออนาคตระยะยาวของ Google Earth บนเว็บ

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