สำรวจเมืองไซเบอรพังก์แบบ ASCII ด้วย Rust WebAssembly ขนาด 283KB ที่ทำงานบน WebGL

Walk‑through ของเมืองไซเบอร์พังก์แบบ ASCII ที่ทำงานบน Rust WebAssembly ขนาดเพียง 283KB พร้อมเรนเดอร์ด้วย WebGL ถูกเปิดให้เล่นในเว็บบราวเซอร์เมื่อสัปดาห์นี้ ทำให้ผู้ใช้สามารถสำรวจมหานครที่สร้างจากตัวอักษรได้โดยไม่ต้องพึ่งเครื่องมือเกมแบบดั้งเดิม เช่น Unity หรือ Unreal ซึ่งเป็นการแสดงศักยภาพของเทคโนโลยีเว็บใหม่ ๆ ต่อการสร้างประสบการณ์ 3‑มิติในรูปแบบที่เบาและเข้าถึงง่าย

Overview

เมือง ASCII นี้ถูกพัฒนาโดยนักพัฒนาคนเดียวจาก Grow Now! Games และเผยแพร่เป็นรุ่นทดลองเล่นบนเว็บพร้อมวิดีโออัปเดต “ASCII City Update: Interiors, Elevation & Skyscrapers” บน YouTube ซึ่งต่อเนื่องจากคลิปแรกที่ได้รับการชมเกินหนึ่งล้านครั้งและคอมเมนต์กว่า 9,000 รายการ การเปิดตัวนี้แสดงให้เห็นว่าการผสาน WebAssembly กับ WebGL สามารถสร้างโลกเสมือนจริงได้แม้ใช้เพียงไฟล์ไบนารีขนาดเล็ก

Technical Details

ไฟล์หลักของโปรเจกต์คือ `ascii-city-engine_bg-DqjAhqbp.wasm` ขนาด 283KB ซึ่งเมื่อเริ่มทำงานจะจองหน่วยความจำเชิงเส้น (linear memory) 1,152KB และรายงานเวอร์ชันเอ็นจิ้นเป็น 0.1.0 หากเรียกใช้ภายนอกเบราว์เซอร์ เอ็กซ์พอร์ตที่สำคัญได้แก่ `initialise_native_game`, `step_native_game` และ `generate_native_local_map`

ส่วนของซอร์สโค้ดที่เหลืออยู่ในไบนารียังมีชื่อไฟล์ Rust ที่บ่งชี้หน้าที่ ได้แก่ `city.rs`, `world.rs`, `population.rs`, `interiors.rs` และ `rendering.rs` ซึ่งช่วยให้ผู้สนใจสามารถตรวจสอบกระบวนการสร้างโลกและเรนเดอร์ได้โดยตรง

• ขนาดไฟล์: 283 KB
• หน่วยความจำเริ่มต้น: 1,152 KB linear memory
• เอ็กซ์พอร์ตหลัก: initialise_native_game, step_native_game, generate_native_local_map

Rendering Pipeline & Performance

การเรนเดอร์ใช้ WebGL โดยสร้างคอนเทกซ์และคอมไพล์เชดเดอร์คู่หนึ่ง (vertex + fragment) ส่วนของ fragment shader มีเพียงการ lookup texture2D หนึ่งครั้ง ตัวอักษรแต่ละตัวถูกวาดบนแคนวาสอาตลาสด้วย `fillText` แล้วเก็บไว้ใน atlas ที่มีขนาดเซลล์ 11 พิกเซลสูงและกว้างเท่ากับความก้าวหน้าของฟอนต์มอโนสเปซบวกสองพิกเซล

ขั้นตอนต่อไปอัปโหลดแอตลาสทั้งหมดเข้าสู่ GPU ด้วยคำสั่ง `texImage2D` เพียงครั้งเดียว จากนั้นแต่ละตัวอักษรจะถูกวาดเป็น textured quad ที่มีหกจุดยอด (vertices) ทุก ๆ คอลัมน์‑แถวที่มองเห็นได้ถูกรวมไว้ในบัฟเฟอร์เดียวและส่งออกด้วย `drawArrays` หนึ่งครั้งต่อเฟรม

สำหรับอุปกรณ์ที่ไม่รองรับ WebGL มี fallback เป็นการวาดภาพผ่าน Canvas 2D (`drawImage`) และอีกหนึ่งโหมดพิเศษ (`?direct`) ที่ใช้ `fillText` แต่ละเซลล์โดยตรง ซึ่งช่วยให้ผู้ใช้งานบนเบราว์เซอร์เก่าหรืออุปกรณ์จำกัดทรัพยากรยังคงเห็นผลลัพธ์ได้

บนเดสก์ท็อประบบจะแสดง 180 คอลัมน์ × 80 แถว (รวม 14,400 ช่อง) ด้วยฟอนต์ Consolas ขนาด 10 px ที่มีระยะห่าง 9 px ต่อบรรทัด ส่วนบนอุปกรณ์สัมผัสจะลดเหลือ 48 แถว และคอลัมน์ตั้งแต่ 96‑168 คอลัมน์ พร้อมโปรไฟล์ Rust 160 × 112 สำหรับการจัดสรรบัฟเฟอร์เวอร์เท็กซ์เริ่มต้นที่ 2.76 MB ซึ่งจะเพิ่มเป็นสองเท่าเมื่อเฟรมใด‑เฟรมหนึ่งใช้พื้นที่เกินขนาดนี้

Development Context & Comparisons

Grow Now! Games ย้ำว่าโปรเจกต์นี้ไม่มีการพึ่งพาเครื่องมือสร้างเกมแบบเดิม เช่น Unity หรือ Unreal ซึ่งมักต้องมีโมเดล 3‑D, เท็กซ์เจอร์และเชดเดอร์หลายชุด การใช้เพียง Rust, WebAssembly และ WebGL ทำให้ไฟล์เอ็นจิ้นมีขนาดเล็กมากและสามารถทำงานบนเบราว์เซอร์ทันทีโดยไม่ต้องติดตั้งปลั๊กอินใด ๆ

ในแง่ของเทคโนโลยีที่คล้ายคลึงกัน มีตัวอย่างอื่น ๆ ที่ใช้วิธีการ “raycasting” หรือการเรนเดอร์แบบข้อความเช่น เกม Backrooms บน Sega 32X (1994) ซึ่งเขียนด้วย C และ Assembly สำหรับ SH‑2, โครงการ Doom แบบหลายผู้เล่นที่ทำ raycasting ผ่าน SQL views เพื่อให้ได้ FPS ประมาณ 30 บนความละเอียด 128×64, รวมถึงเกม Thunder Lizard ที่เปลี่ยนกริด ASCII ให้เป็นภาพเคลื่อนไหวด้วยโมเดล AI ได้ประมาณ 10 FPS ทั้งหมดนี้แสดงให้เห็นว่าการใช้ข้อความเป็นหน่วยการเรนเดอร์ยังคงเป็นแนวคิดที่สร้างสรรค์และสามารถต่อยอดได้หลายรูปแบบ

Potential Impact

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

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

Summary

Grow Now! Games เปิดให้เล่นเมืองไซเบอร์พังก์แบบ ASCII บนเว็บโดยใช้ Rust WebAssembly ขนาด 283 KB ร่วมกับ WebGL ทำให้สามารถเรนเดอร์ 180×80 ตัวอักษรในเวลาเรียลไทม์ได้อย่างมีประสิทธิภาพ การทดลองนี้ชี้ให้เห็นศักยภาพของเทคโนโลยีเว็บใหม่ในการสร้างสรรค์กราฟิกสาม‑มิติที่เบาและเข้าถึงง่าย.