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的应用。

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

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

web前端开发工作描述_2019年前端开发前景如何？前端开发会被淘汰吗？
近十年以来,IT行业发展火热,衍生了很多新职业,例如UI设计师.开发工程师.软件测试工程师等等,在众多备受瞩目的新生职业中,Web前端工程师是其中的一员. Web前端在IT行业真正受到重视大概也就六七 ...
话题：什么是前端工程化？
虽然前端工程化的概念兴起还没几年的时间,但是对于"工程化"这个词并不是一个新鲜词了,在其他软件开发的领域很早就已经有了高度的工程化,例如Web服务端开发.只不过那个时候,前端工程师 ...
【学习日记2023.4.25】之前后端分离_前端工程化_Vue组件库Element_Vue路由_打包部署
文章目录 1. 前后台分离开发 1.1 前后台分离开发介绍 1.2 YAPI 1.2.1 YAPI介绍 1.2.2 接口文档管理 2. 前端工程化 2.1 前端工程化介绍 2.2 前端工程化入门 2. ...
前端工程化 | 工程化技术基础
前端工程化和Node.js 前端工程化工程就是一个项目(一个网站/APP) 一个工程的生命周期工程立项--需求分析--产品原型--开发实施--测试部署--上线运行工程化完成项目过程中,用到的各 ...
【CSDN软件工程师能力认证学习精选】什么是前端工程化？
CSDN软件工程师能力认证(以下简称C系列认证)是由中国软件开发者网CSDN制定并推出的一个能力认证标准.C系列认证历经近一年的实际线下调研.考察.迭代.测试,并梳理出软件工程师开发过程中所需的各项技 ...
开篇：到底什么是前端工程化？
前端工程化是现代前端的必备技能 Web 前端这几年进化速度之快让人咂舌.很多前端工程师都不禁吐槽"学不动了".如今已经不是 HTML.CSS.JS 前端三剑客仗剑走天下的时代了. ...
vue全套笔记，前端工程化+vue指令+脚手架
文章目录一. 前端工程化 webpack 的基本使用 webpack 中的插件 webpack 中的 loader 打包发布 Source Map的使用注意,实际开发不需要自己配置webpack ...
【话题】什么是前端工程化？
虽然前端工程化的概念兴起还没几年的时间,但是对于"工程化"这个词并不是一个新鲜词了,在其他软件开发的领域很早就已经有了高度的工程化,例如Web服务端开发.只不过那个时候,前端工程师 ...
[上海线下活动] Web前端工程化架构实践 -- 沪江技术沙龙
报名链接:www.huodongxing.com/event/53996- Web前端工程化历经了:2011年的Shell&(YUICompress || Google Closure Com ...
用html5做一个介绍自己家乡的页面_（近万字）一篇文章带你了解HTML5和CSS3开发基础与应用-适合前端面试必备...
作者 | Jeskson来源 | 达达前端小酒馆 HTML5和CSS3开发基础与应用,详细说明HTML5的新特性和新增加元素,CSS3的新特性,新增加的选择器,新的布局,盒子模型,文本,边框,渐变,变 ...

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

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

最新文章

热门文章