用拼积木方式做html5产品

《用拼积木方式做html5产品》由会员上传分享，免费在线阅读，更多相关内容在行业资料-天天文库。

1、HTML5性能不输原生app，用拼积木方式做HTML5产品可能你已经发现了，一个好玩有趣的HTML5页面在微信朋友圈里获得的用户关注度会远超过那些普通的独立应用。在移动应用越来越多，推广越来越难做的情况下，你的产品是不是也应该有一个HTML5页面？如果答案是肯定的，那么或许可以试试AmazeUI这套开源的HTML5前端框架，利用它提供的Web组件、JS插件和层叠样式表（CSS），你可以快速的搭建出一款HTML5产品。对于那些经常在移动设备上访问Web页面的用户来说，你可能已经注意到了，一个Web页面基本可以分为菜单、标

2、题栏、图片画廊、内容列表、分割线这几大块。在AmazeUI里面，官方提供了各种各样的Web组件，你甚至可以像拼积木那样来搭建HTML5产品。除了上面提到的那几个主要网页组件之外，像折叠面板、页头、页脚、图片轮播、选项卡、简介、段落这些都是AmazeUI中开发者可以直接使用的Web组件。由于AmazeUI是一款开源产品，所以一些第三方的开发者也在不断向其贡献特色化的组件。比如来说，在涉及到地理位置的时候，用户可能会需要一个地图指引，这时你就可以集成“百度地图”的组件；在文章下面你可能需要评论体系，这时又可以用“多说”的组

3、件；一些服务性的网页又可能需要客服，这时“美洽客服”组件自然也就派上用场了。当然，可能有些开发者会说，这些元素只是Web站点的一部分，当你真正来做一个Web站点时，你可能还需要各种各样的交互效果和文字排班样式。这时AmazeUI的JS组件和CSS组件的用处就显现出来了。通过JS组件，开发者可以获得一系列的UI增强效果，比如，警告框、平滑滚动、加载进度条、弹出框、模态窗口、下拉组件、按钮交互等等。通过CSS组件，开发者既可以直接集成像按钮、表单、表格这样的HTML元素，又可以使用小徽章、面包屑导航、按钮组这样的页面组件。

4、目前，AmazeUI总共有近20个CSS组件、10个JS组件和17款包含近60个主题的Web组件，按照CEO陈本峰的说法，和国外的一些Web前端框架相比，AmazeUI会更多的考虑中文用户的需求。比如在字体排版上，Bootstrap这套前端框架就没有定义中文字体，这样你的网页在不同的系统和浏览器下的展示效果可能都是不一样的，但AmazeUI中由于定义了中文字体而且针对国内市场份额比较高的浏览器做了优化，所以就可以避免出现这样的情况。对于那些正在尝试做HTML5产品的公司来说，你可能还停留在Facebook、Linked

5、In等大公司从HTML5app“叛逃”到原生app的阴影中，因为即使到了今天，一些人在谈到HTML5时还会举上面的例子。不过一位曾经在Chrome团队工作的工程师ShinjiIkari告诉PingWest，Facebook当初之所以会把HTML5app做的那么慢，这更多的是Facebook自身的原因，而不是由于HTML5不行。因为从技术上来说，HTML5的缺陷不是慢，而是不能Scale。当时，Facebook的HTMLapp还在用XML，所以可以说他们的技术是相当落后的。为了证明HTML5app的性能不输给原生应用，G

6、oogle的两位工程师专门做了一个Fastbook的HTML5app来表明Facebook的“叛逃”并不是HTML5的错。按照ShinjiIkari说法，两年前HTML5app的性能就可以赶上原生app了，何况现在！那么你或许会好奇，既然HTML5的性能不输给原生app，那么我们平时看到的优质HTML5app为什么这么少呢？对于这一点陈本峰觉得这更多的还是这一领域开发人员的技术积累不足。ShinjiIkari也表示，对于很多应用来讲，写成原生app几乎是必然的，如果你在写一个3D游戏，而不需要任何的DOM（文档对象模型

7、），那么根本没有任何理由使用HTML。使用JavaScript不仅不会简化你的工作，还会让你的项目推进变得更糟糕。但是，像Facebook的这样手机应用，就是一个列表，没有什么可以超出HTML5的范围的内容，使用HTML5应该会得心应手，所以很多时候大公司对于技术的选择没有太大的借鉴价值。好了，在解释了HTML5并不像人们想象的那么弱之后，也许你会觉得AmazeUI里的这些组件还不足于做出自己想要的产品，这也是AmazeUI选择开源的原因之一—让社区为其贡献更多的内容。如果你现在正在打算做HTML5产品，那么即便不选择

8、AmazeUI框架，也不要让Facebook、LinkedIn这样的案例成为你的绊脚石。图片来自：Shutterstock【编辑推荐】1.Android和iOS在新版本中助力HTML52.HTML5游戏风靡Cocos2d-JS成最强拥趸3.HTML5游戏性能大幅提升白鹭EgretEngine1.5震撼发布4.HTML5来了，7个混