Web 上的 3D 遊戲
為了在 Web 上實現豐富的遊戲體驗，首選的工具是 WebGL，它渲染在 HTML 的 <canvas> 元素上。WebGL 本質上是 Web 的 OpenGL ES 2.0——它是一個 JavaScript API，提供構建豐富互動式動畫和當然，也包括遊戲的工具。你可以使用硬體加速的 JavaScript 來生成和渲染動態 3D 圖形。
文件和瀏覽器支援
WebGL 專案的文件和規範由 Khronos Group 維護，而不是像大多數 Web API 那樣由 W3C 維護。現代瀏覽器，包括移動裝置，都提供了非常好的支援，所以你不用太擔心這個問題。主流瀏覽器都支援 WebGL，你只需要專注於在你使用的裝置上最佳化效能。
目前正在努力在不久的將來發布 WebGL 2.0（基於 OpenGL ES 3.0），這將帶來許多改進，並幫助開發者使用當前強大的硬體為現代 Web 構建遊戲。
解釋基礎 3D 理論
3D 理論的基礎圍繞著在 3D 空間中表示的形狀，並使用座標系來計算它們的位置。請參閱我們的 解釋基礎 3D 理論 文章，獲取所有你需要的資訊。
高階概念
你可以用 WebGL 做更多的事情。有一些高階概念你應該深入學習——例如著色器、碰撞檢測，或者當前熱門話題：Web 上的虛擬現實。
著色器
值得一提的是著色器，它們本身就是一個獨立的話題。著色器使用 GLSL，一種特殊的 OpenGL 著色語言，語法類似於 C，直接由圖形管線執行。它們可以分為頂點著色器和片段著色器（或畫素著色器）——前者將形狀位置轉換為真實的 3D 繪製座標，後者計算渲染顏色和其他屬性。你絕對應該檢視 GLSL 著色器 文章，瞭解更多關於它們的資訊。
碰撞檢測
沒有碰撞檢測很難想象遊戲——我們總是需要弄清楚什麼時候一個物體撞上了另一個物體。我們有可供你學習的資訊
WebXR
虛擬現實的概念並不新鮮，但由於硬體的進步，如 Meta Quest，以及（目前仍在實驗中的）WebXR API，用於捕獲 XR 硬體的資訊並使其可用於 JavaScript 應用程式，虛擬現實正在風靡 Web。欲瞭解更多，請閱讀 WebXR — 虛擬與增強現實的 Web。
還有 使用 A-Frame 構建一個基本演示 文章，向你展示使用 A-Frame 框架構建虛擬現實 3D 環境有多麼容易。
庫和框架的興起
編寫原始的 WebGL 程式碼相當複雜，但如果你想長遠來看掌握它，因為你的專案會變得越來越高階（請參閱我們的 WebGL 文件 入門）。對於實際專案，你可能還會使用一個框架來加速開發並幫助你管理正在進行的專案。使用 3D 遊戲框架也有助於最佳化效能，因為很多工作都由你使用的工具處理，這樣你就可以專注於構建遊戲本身。
最流行的 JavaScript 3D 庫是 Three.js，它是一個多功能工具，可以更簡單地實現常見的 3D 技術。還有其他流行的遊戲開發庫和框架值得了解；A-Frame、PlayCanvas 和 Babylon.js 是其中最知名的，它們擁有豐富的文件、線上編輯器和活躍的社群。
使用 A-Frame 構建基本演示
A-Frame 是一個用於構建 3D 和 VR 體驗的 Web 框架。它的底層是 Three.js 框架，並採用了宣告式的實體-元件模式，這意味著我們只需要使用 HTML 就可以構建場景。請參閱 使用 A-Frame 構建一個基本演示 子頁面，瞭解建立演示的分步過程。
使用 Babylon.js 構建基本演示
Babylon.js 是開發者使用的最流行的 3D 遊戲引擎之一。與其他 3D 庫一樣，它提供了內建函式，可以幫助你更快地實現常見的 3D 功能。請參閱 使用 Babylon.js 構建一個基本演示 子頁面，瞭解使用 Babylon.js 的基礎知識，包括設定開發環境、構建必要的 HTML 和編寫 JavaScript 程式碼。
使用 PlayCanvas 構建基本演示
PlayCanvas 是一個流行的 3D WebGL 遊戲引擎，開源在 GitHub 上，並提供線上編輯器和良好的文件。請參閱 使用 PlayCanvas 構建一個基本演示 子頁面，瞭解更高級別的細節，以及其他展示如何使用 PlayCanvas 庫和線上編輯器建立演示的文章。
使用 Three.js 構建基本演示
與其他任何庫一樣，Three.js 給你帶來了巨大的優勢：與其編寫數百行 WebGL 程式碼來構建任何有趣的東西，不如使用內建的輔助函式來更輕鬆、更快速地完成。請參閱 使用 Three.js 構建一個基本演示 子頁面，瞭解建立演示的分步過程。
其他工具
Unity 和 Unreal 都可以使用 asm.js 將你的遊戲匯出到 WebGL，因此你可以自由地使用它們的工具和技術來構建將被匯出到 Web 的遊戲。
下一步
透過這篇文章，我們只是觸及了當前可用技術可能性的表面。你可以使用 WebGL 以及在其基礎上構建的庫和框架，在 Web 上構建沉浸式、精美且快速的 3D 遊戲。