正如网页版《刺客信条：海盗传奇（assassin’screedpirates）》游戏的广告语“whatthewebcanbe”所描述的那样，微软ie团队与知名游戏开发厂商育碧（ubisoft）通过该游戏再次诠释了网页的力量。作为所有用户与互联网连接的入口，网页已经不再只是作为浏览资讯的载体，将3d技术与网页游戏相结合，用户可以直接从网页上获得前所未有的浏览体验。
《刺客信条：海盗传奇》背后：ie11与前沿技术的完美结合
原先作为手持平台独占的游戏《刺客信条：海盗传奇》，现在已经成为一款免费网页游戏面向广大玩家。在页游版游戏中，玩家可以跟随游戏故事主角alonzobatilla船长遨游在加勒比海寻宝和挑战海盗，并能和其他玩家进行实时海战。游戏中的背景会根据时间和地点的不同而发生改变，玩家可以体验实时的海盗生涯。页游版游戏中采用了全3d画面，令所有船只与环境看上去更加真实，即便是船只开动时细微的海浪波动也能得到完美的呈现，给玩家带来像在真正海面上航行的真实体验。玩家在ie11中运行游戏时，游戏会自动检测玩家的设备种类及输入方式，自动调整游戏来适应屏幕，以达到最佳的显示效果。
为了实现上面的效果，微软ie团队与育碧使用了开源的3d引擎babylon.js来搭建游戏。babylon.js是一个基于webgl、javascript和typescript技术的开源3d引擎，配合babylon.js，开发者可以更好的利用webgl技术，更方便快捷地完成光线、轮船纹理、海浪等的3d建模，从而带来最佳的呈现效果。正是因为webgl所拥有的gpu加速特性，玩家们可以用最短的时间在浏览器上加载完复杂的3d页面。
webgl引领未来网页游戏开发趋势
网页游戏可以算是现在行业内接触3d页面最早的载体，在现在盛行的3d页游中，所有游戏厂商都在积极研发webgl游戏引擎，为3d页游潮流的到来提前进行技术储备。过去flash+非标插件的3d页游模式，正在逐渐演变成由webgl当家，html5技术提供支撑的新3d页游模式，现在webgl为页游带来的3d体验甚至可以媲美传统的pc桌面游戏。
众所周知，3d形象在早前的游戏开发中并不能在网页上直接展示，开发者必须使用非标准的特殊网页语言语法或者通过安装额外的浏览器插件来实现页面的3d特效。随着网络技术的不断发展，webgl提供了一种全新的技术解决方案，3d物体形象可以直接在网页上呈现出来，网页开发人员可以直接借助系统显卡在浏览器里更流畅地展示3d场景和模型，还能创建复杂的导航和数据视觉化。webgl技术标准免去了开发网页专用渲染插件的麻烦，将开发流程进一步简化的同时，又能为用户带来更炫酷的3d效果体验。
伴随pc硬件水平的提高和用户体验需求的提升，用户逐渐不满足于过去的3d体验效果。现如今，不只是顶级开发团队在储备浏览器webgl3d技术，浏览器开发商们也在积极的研究如何利用webgl技术在浏览器上呈现更好的3d互动体验。包括chrome、opera、firefox和使用了canvas的safari在内，主流浏览器厂商都在大力推动webgl技术标准的普及和发展。对于开发者来说，利用webgl技术开发全3d网页已经成为当下的技术趋势。
ie11上的webgl应用
作为目前全球市场占有率最高的浏览器，ie浏览器为webgl技术的运用提供了大量的开发实例。“月熊志”是公益组织亚洲动物基金会与微软ie11共同开发的一个网站，借助ie11提供的更多技术和工具为读者呈现了可爱的月熊和他们丰富多彩的故事。得益于ie11的硬件加速以及webgl的高效，“月熊志”开发团队可以在浏览器上运行场景丰富、动画流畅的3d画面。开发团队先是通过3d建模软件blender构建出月熊形象及他周围自然亲近的场景的3d模型，然后利用three.js，将它们导出为json格式的数据，使得这些模型和动画得以在浏览器中呈现。借着ie11上webgl的高效处理特性，网站的浏览者能够更直观地了解月熊并体验到流畅的3d互动。
以下是与webgl相关的代码示例：
loader.load(models/mesh.js,function(geometry,materials){
//创建模型对象
varmesh=newthree.morphanimmesh(geometry,newthree.meshfacematerial(materials));
//设置动画区间
mesh.mirroredloop=true;
mesh.setframerange(0,290);
mesh.duration=290*24/1000;
//设置位置和大小
mesh.position.z=2000;
mesh.position.y=-1500;
mesh.scale.x=mesh.scale.y=mesh.scale.z=500;
//设置阴影
mesh.castshadow=true;
mesh.receiveshadow=true;
//添加到场景
scene.add(mesh);
//平行光
vardirectionallight=newthree.directionallight(0xffffff,.6);
directionallight.position.set(6000,10000,7000);
directionallight.castshadow=true;
directionallight.shadowcameranear=500;
directionallight.shadowcamerafar=30000;
directionallight.shadowcameraleft=-10000;
directionallight.shadowcameraright=10000;
directionallight.shadowcameratop=10000;
directionallight.shadowcamerabottom=-10000;
directionallight.shadowdarkness=.2;
directionallight.shadowmapwidth=2048;
directionallight.shadowmapheight=2048;
scene.add(directionallight);
//半球光
varhemilight=newthree.hemispherelight(0xffffff,0xffffff,.7);
scene.add(hemilight);
});
从上面的代码范例可以看出，利用webgl技术，开发者可以通过数量更少且更为简单的代码来实现过去需要借助非标插件才能完成的工作，同时，结合ie11对gpu加速的特性，这段代码在运行之后可以让用户在最短的时间内获得流畅的3d体验。
除此之外，ie还曾与glacierworks合作开发制作http://explore.glacierworks.org/en网站，希望向全世界展示珠穆朗玛峰这一神秘而又美丽的区域。网站采用webgl技术开发，依托ie11的强大性能和对webgl的支持，用完美逼真的3d效果向用户呈现珠峰前所未见的影像，为用户带来最真实的交互体验。
ie一直致力于为广大开发者提供最好的技术开发平台，无论是对webgl技术的支持，还是对于触控的优化，ie11正在为开发者们创造更好的机会，激发更多的开发者去创造丰富多彩和炫酷的网页体验。