基于HTML5技术的电力3D监控应用（二） HTML53DWebGL电力机房

我们选用HTML5技术还是顶着很大压力，毕竟HTML5技术性能行不行，浏览器兼容性会不会有问题，这些在项目选型阶段还是充满疑惑，项目做到现在终于快收尾了我们才敢松口气，压力基本顶住了，我个人总结的经验是：HTML5性能肯定不是最高，但对企业应用足够高效，HTML5标准不可能所有浏览器都一致实现，但对于企业应用已经足够工作。选择正确的引擎框架，进行合理的设计才是关键，HTML5真的已经Ready！

 

选择HTML5除了看中JavaScript动态语言的灵活性，能够很好的和其他异构系统融合到页面外，HTML5的跨平台性也是我们看中的重要原因，以前PC桌面应用上采用Flex和Silverlight到是可以跨平台，但如今的系统还不能上移动终端实在就说不过去了，而Flex和SL在跨移动终端方面就卡壳了，虽然有AIR可以导成native app应用，但还是远不如HTML5纯页面来的高效，每次修改任何东西PC上都可以模拟测试，看看Chrome DevTools for Mobile越来越*的Screencast and Emulation功能： 

我现在测试移动终端大部分情况都不需要用真机，当PC上模拟测试得差不多后再进行真机测试基本都能一次性通过，回想以前用Flex的AIR进行转换Native App真是浪费生命，每次测试我都要刷几条微博消磨难熬的等待时间，上一次项目我们团队也分为Android和iOS两个完全采用独立Native开发方式，但也存在版本发布不一致，应用体验不一样，包括很多业务逻辑代码本可以复用的但由于Java和ObjectiveC的差异，搞得我们非得写两套一样逻辑的代码，其中加密的部分还得费劲的用C++实现了一个统一的实现，然后再有Java和OC分别去调用C++的代码，总之系统越搞越复杂，团队需要的人越来越多，当然我们经验不足也是一个原因，但我们毕竟是做企业应用搞项目的，不过可能有资源像BAT那些移动互联网巨头去慢慢融合摸索经验，我们除了这些基础技术外，还有学习很多电力业务，还得和硬件打交道，学习各种电力规约协议，扯淡了这么多你应该明白我们现在成功的使用了HTML5一个js语言就能跨所有平台之爽。

 

项目初期我们团队在选型初期对3D建模进行了一定的研究，传统的3D引擎一般只提供后期三维模型的渲染呈现，并不提供3D建模的解决方案，本以为还需要招聘专业的3DMax或Maya三维建模设计师，因为我们目前的美工设计师只会ps，但HT提供了一套完全基于HTML5的3D设计编辑工具，别说只会ps的美工设计师，其实后续项目的大部分3D场景我们程序员都参与了设计。

 

完全基于HTML5的设计器这点还是挺让我佩服的，虽然大家都在转型到HTML5但还很少有做得彻底的，如Google Web Designer和Adobe Edge Tools这些巨头的产物，包括Sencha Architect折腾了很长时间又走回Qt的路线，我实在不看好这些还不采用HTML5做设计器的路线，这时代HTML5已经足够强大，JS虚拟机的性能如V8也足够高效，数据直接云存储就可以，如果需要本地功能采用Node-Webkit也是很不错的方案。以前我们团队常用Qt或Java Swing来写些小工具，我发现这个项目历练之后Node-Webkit的技术方案成了大家些写工具应用的首选。

以下为几张运行系统抓图，以及这些系统图在编辑器内编辑的过程抓图