HTML5移动应用开发为什么需要引入前端工程化

 

       使用HTML5和Javascript开发的移动应用,和典型的现代Web前端项目一样,有着大量的Javascript,HTML和CSS代码,因此前端工程化在HTML5移动应用开发中同样有着重要意义,可以避免大量重复性的工作,提供效率和质量,优化产品的性能。

     

       目前前端工程化比较通用的框架主要有国外的grunt,gulp,百度的F.I.S等,这些框架基本上都是基于Node.js实现的(百度的F.I.S最早是基于PHP开发的,后来切换到Node.js)。Node.js对前端工程师有着非常强的亲和力,有各种基于Node.js的压缩、优化、校验工具,有着极高的运行性能,有强大的npm包管理工具,这些特点让Node.js成为前端自动化和辅助开发工具的首选平台。前面我们介绍的Cordova,Ionic框架的命令行脚本程序都是基于Node.js开发的。


     对于移动Web项目来说,前端网页性能的优化(主要是指各种文件的压缩处理,CDN缓存,图片质量优化)非常重要,因为现在移动上网的流量费还是很昂贵,移动带宽普遍还是达不到PC带宽的水平,4G网络还没有普及,还有很多用户会通过3G,GPRS或不稳定的WiFi网络访问我们的移动网站。如果移动网站优化的不好,用户会花很长的时间(15秒以上)才能打开网站,同时浪费大量的流量,结果就是造成用户的大量流失。

      对于移动Web产品,CSS和Javascript文件的压缩和合并,静态文件的CDN缓存,文件缓存问题和文件Hash版本处理,HTML5离线缓存等工作,都是需要优化的方向。这些优化工作我们每次更新产品时都需要做,如果手工操作必然会浪费大量的人力成本,并且容易出现疏漏导致的错误,因此我们引入了一系列工具来自动化这些工作,这就是前端工程化。

      对于HybridApp开发来说,我们同样需要压缩合并CSS和Javascript文件,删除不必要的文件,以便减小App安装包的文件大小,为用户节省下载的流量;另外还需要对js进行混淆,提高安全性;针对不同的平台修改相关的代码,更好的支持跨平台。这些工作都可以通过前端自动化工具完成,提供研发效率和质量。

     HTML5移动应用开发和传统的Web前端开发一样,都是使用Javascript作为主要的开发语言,因此在开发javascript程序时使用的自动化脚本工具都可以使用,目前这些工具都是基于Node.js平台实现的,借助Node.js的异步非阻塞特性,与传统的shell脚本相比,这些工具非常方便。这些前端自动化工具包括Grunt,Gulp,FIS等,后面会重点介绍Gulp的应用。

     更多的理由,欢迎大家讨论补充。

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。