在2019年倫敦Fullstack大會上，自由軟件工程師Doug Sillars通過演示如何構建一個虛擬藝術畫廊討論了使用JavaScript實現虛擬和增強現實的現狀。
無論是虛擬現實（讓用戶沉浸在完全3D生成的世界中）還是增強現實（在現實世界和數字對象之間提供深度集成），它們都是相對較新的技術，目前正在通過WebXR API集成到Web中。WebXR中的X是指未來可能出現的任何類型的沉浸式技術。
WebXR API仍在開發當中，只提供有限的瀏覽器支持和文檔。WebXR GitHub代碼庫包含了WebXR核心概念介紹，方便入門WebXR。
即使沒有WebXR API，仍然可以與AR/VR設備交互，並創建簡單的跨平臺應用程序。像A-Frame這樣的庫爲應用程序開發提供了一個簡化的接口，網上可以找到很多有趣的例子和實現。
A-Frame庫基於three.js，three.js是一個流行的JavaScript 3D渲染庫。A-Frame提供了一個簡單的類似HTML的語法，易於掌握，開發人員可以用最少的JavaScript知識創建VR和AR應用程序。
在使用A-Frame時，開發人員可以使用類似HTML的標記來描述場景，然後A-Frame將這些標記轉換爲WebGL視圖。爲了將3D對象放置在真實空間（AR）中，開發人員目前需要使用特殊物理標籤，這些標籤可以在A-Frame網站上生成。有了這些標籤，A-Frame就會知道應該在哪裏以及放置哪些3D對象。
要創建一個簡單的VR場景只需要一些標籤：
<a-scene>
<a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
<a-sphere position="0 1.25 -5" radius="1.25"></a-sphere>
</a-scene>
另一個值得一提的庫是React-360，它允許開發人員使用與React類似的語法創建AR/VR用戶界面。
最初，AR/VR應用程序需要使用昂貴的專用設備，這限制了它的應用範圍。如今，開發者可以使用智能手機來實現類似的體驗。雖然在智能手機上使用AR/VR應用程序是可能的，但仍然需要使用一些特殊的眼鏡，讓用戶有更強烈的浸入式體驗。谷歌首先推出這樣的眼鏡，叫Cardboard，不過現在有許多可供選擇的解決方案。
Doug Sillars的完整演講視頻“在瀏覽器中構建藝術畫廊”可以在FullStack網站上找到（需要免費註冊）。
A-Frame是基於MIT許可發佈的，它的源代碼可以通過A-Frame Github代碼庫獲得。
原文鏈接：