在本文中，将探讨如何在快速的Android模拟器上测试WebGL体验。首先，需要下载Visual Studio2015 RTM（例如免费的社区版），或者直接安装Android模拟器而不通过Visual Studio。然后，阅读《介绍Visual Studio的Android模拟器》这篇文章，它解释了这个酷炫的模拟器是如何工作的以及它支持的特性。
注意：最近发表了一篇文章，描述了如何在Windows Phone上远程调试和分析HTML5网站和应用的性能。现在，可以使用相同的方法来调试Windows Mobile 10和Mobile Edge，随着Windows 10 SDK Tools的发布。
安装完成后，可以启动工具，并选择感兴趣的镜像。让选择“5英寸Lollipop（5.0）XXHDPI手机——类似于三星Galaxy S4”，然后按播放。如果这是第一次启动模拟器，它将为配置Hyper-V网络设置。
一旦启动，启动默认安装的浏览器，并尝试，例如，导航到，这是迄今为止最好的WebGL框架。如果尝试启动一个场景，会看到一个错误：
确实，这个Lollipop镜像中默认的浏览器不支持WebGL。需要在它上面安装Chrome。搜索一个x86版本的Chrome APK，例如这个：Chrome 43.0.2357.93 (x86)，然后将APK直接拖放到模拟器中。它应该会安装它：
但是，如果再次用Chrome导航到同一个URL，仍然会看到相同的错误。这次，这是因为Chrome没有在模拟器中启用WebGL——它不在它的白名单中。要强制启用，导航到“about:flags”并启用这个选项：“覆盖软件渲染列表”。
现在应该能够启动一个场景，比如著名的Espilit场景： 在第一代联想X1上，使用简单的HD4000 GPU在Windows 10上达到25fps！对于一个模拟器来说，这并不坏！显然，仍然需要一个真正的设备来基准测试WebGL代码的性能。
更好的是，由于模拟器完美支持触摸，还可以测试和调试WebGL体验中的多点触控。例如，将相机切换到“虚拟摇杆相机”：
现在可以用两个手指在3D场景中移动，如果简单地触摸电脑屏幕：
注意：为此，使用了Pointer Events和HandJS polyfill将这些事件传播到Touch Events，因为Chrome还不支持Pointer Events。
在Windows Phone/Mobile上，WebGL默认在IE11和Edge中启用。所以只需启动Windows Phone模拟器并导航到WebGL内容。
注意：甚至Web Audio也支持Chrome在Visual Studio模拟器中！例如，这个演示在其中工作：
最初制作Vorlon.js是为了简化移动Web开发者的生活。如果还没有听说过，欢迎查看网站上的视频：，并查看这篇文章：为什么制作了vorlon.js以及如何使用它来远程调试JavaScript。
让首先回顾一下如何在Android和Windows Phone模拟器上调试层。例如，目前正在利用业余时间玩Flexbox，以改进Babylon.js网站。多亏了Modernizr插件，可以看到Flexbox被模拟器支持，甚至可以通过DOM Explorer查看布局大小：
例如，可以看到在Android模拟器（左边）中，“Mansion” flexbox项目被突出显示，它目前的尺寸是“172px x 112px”。
让回顾一下在Windows Phone模拟器（右边）上的同一个网站：
当然，Flexbox也支持IE11 Mobile，这次，同一个flexbox项目目前的尺寸是“140px x 91px”。
另一个有趣的特性是交互式控制台。有时，使用WebGL，很难知道代码为什么在移动设备上失败了。这通常是因为移动设备的GPU不支持特定功能，或者因为一个着色器没有编译。例如，“景深/结束”演示。着色器对Windows Phone来说太复杂了，可以简单地用工具验证它：
有很多其他的插件可以帮助，目前正在努力添加新的插件，以便进一步发展。谁知道呢，可能在不久的将来会有一个针对babylon.js的插件。
这篇文章是微软技术传道者关于实用JavaScript学习、开源项目和互操作性最佳实践的Web开发系列文章的一部分，包括Microsoft Edge浏览器和新的EdgeHTML渲染引擎。
鼓励在包括Microsoft Edge在内的浏览器和设备上进行测试——Windows 10的默认浏览器——在dev.modern.IE上有免费的工具：
// 示例代码
function testWebGL() {
if (!!window.WebGLRenderingContext) {
var canvas = document.createElement("canvas");
var gl = canvas.getContext("webgl");
if (!gl) {
gl = canvas.getContext("experimental-webgl");
}
gl.viewportWidth = canvas.width;
gl.viewportHeight = canvas.height;
// ... 其他 WebGL 代码 ...
}
}
扫描网站以查找过时的库、布局问题和可访问性问题
使用Mac、Linux和Windows的虚拟机
远程测试自己设备上的Microsoft Edge
GitHub上的编码实验室：跨浏览器测试和最佳实践
来自工程师和传道者的深入技术学习，关于Microsoft Edge和Web平台：
Microsoft Edge Web峰会2015（新浏览器的预期，新支持的Web平台标准，以及来自JavaScript社区的嘉宾演讲）
哇，可以在Mac和Linux上测试Edge和IE！（来自Rey Bango）
在不破坏Web的情况下推进JavaScript（来自Christian Heilmann）
使Web正常工作的Edge渲染引擎（来自Jacob Rossi）
释放3D渲染能力与WebGL（来自David Catuhe，包括vorlon.JS和babylonJS项目）
托管Web应用和Web平台创新（来自Kevin Hill和Kiril Seksenov，包括manifold.JS项目）
Visual StudioCode适用于Linux、MacOS和Windows