Web前端最近都在跨界！！现在又伸手到游戏领域了。但是真的那么好跨界吗？请让我一一道来。
Canvas和WebGL的出现其实让Web游戏有了实现的可能，但是让我们用ctx一个个画，效率还是低了点，所以需要游戏引擎。它帮助我们去动态渲染游戏每一帧的元素。
业界比较著名的几个H5游戏引擎，有Egret(白鹭)，Layabox，Three.js，coco2d-js等等，详情可以看知乎的回答。
因为我们团队不是一开始做游戏的，我们是传统意义上的前端团队，从web发家的，起初做的是电商类的业务——拍拍。所以这里我们综合几家游戏引擎，选择了Layabox。
有如下有点吧：
LayaAir是一个优秀的适用于多端的游戏引擎，配备有丰富的组件，有自己的IDE可以快速构建布局等，不需要写类似CSS的代码
支持html的页面渲染，就是说你可以让游戏引擎跟web页面，混用（这在一些类似文本的页面非常有用）
支持2D、3D甚至VR方面的开发。性能也足够优秀
对Web前端普遍的上手难度也较其他引擎框架简单很多
不需要写重构（CSS）代码
其实我们团队之前也是做得H5竞猜小游戏，不过是基于DOM的，用CSS3做动画。但是发现CSS3操作复杂动画，有很多缺点：
复杂动画支持度非常差
页面元素太多，渲染性能差
很多复杂的需求做起来很耗时
玩家手机容易发烫（页面元素多，动画复杂）
因此，我们经过预研和讨论，果断走出传统Web的开发模式，拥抱传统的游戏开发！！当然这里肯定不是一帆风顺的，从Web前端转向游戏开发，还是有非常多的坑点的。
首先需要摆脱HTML和CSS，你不是在做页面，你是在做一个游戏！！游戏的逻辑占据了一个游戏80%的工作量，所以你很多时候是在写JavaScript代码，这不是问题，其次，你需要拥有面向对象编程的思想。这可能是很多老前端欠缺的，因为JavaScirpt说到底是一门面向函数、面向过程的语言。大家知道模块化，但是却还是习惯写function而不是ES6的class。
这里因为平台也在转型向ES6靠近，所以大胆采用了ES6+Babel+Webpack的模式，甚至于在做Weex、小程序、Web三端融合。即一份代码，可以在三个平台跑。扯的有点远哈，下面开始正文，我们不说用法，具体是说一些坑点，和优缺点对比。
游戏引擎不适用的地方游戏引擎这东西在动画一块是真心好用，可以高度还原设计师的动画，可是其没有网页的排版布局，更多的布局应该是通过x、y、更改pivot、anchor属性来实现。
CSS可以很快速的通过代码进行相关布局（flex、float、position等属性），网页那种自上而下的内容排版可以自动适应内容，对文字处理十分便捷。
针对各自的优缺点，从实现的便捷性来说，游戏主场景（动画极多）的情况下，为了提高用户的体验，应该用游戏引擎来写。
而对一些活动浮层、投注记录、游戏规则等有大量图片文本的页面，应该用传统的Web网页来编写，这样才是物尽其用的做法。
在这个背景下，游戏开发的前端需要掌握多好几种技能——简单的游戏开发的技能、重构部分的构建技能（团队大前端的趋势下，去除重构岗位，重构工作由前端接管），可以说工作量翻了一倍。但是在业务侧来考虑，因为减少了相关的中间环节，需求迭代可以更快速的落地。
Laya的IDE使用要注意的地方LayaIDE提供一个组件库，如list列表，tab按钮切换等等简单的Web组件，可以直接拖拽使用而不用自己用代码再实现一次。
但是IDE自带的很多组件有坑点，如list组件的selectHandler触发并不灵敏，数据源重新绑定后会出现点击无法响应的问题，这个时候要绑定mouseHanlder来代替点击事件等。
IDE的使用对于不熟悉的人来说上手并不简单，熟练后可以提高效率。具体可以看官网的介绍。
这个属性是IDE的一个配置属性，在引用的时候并不会起作用。可以理解为是一个IDE的背景色，可以让你在用IDE编辑的时候看的更清楚。
如果你需要更换背景色，应该通过绘制一个底部的矩形来实现。