【前端工程化之学习总结】

前言：

最近在学习前端，之前学习过JavaScript、css、jQuery等等前端知识，由于公司采取前后端分离技术，面对公司的红利，作为后端开发的我开始系统的学习前端知识，之前在听技术分享中，听到了前端工程化，但是当时给我的触动并没有那么大，现在自己深切阅读中，确是别具一番风景中。

核心：

背景：

为满足需求以及提升端开发效率和运行性能，前端工程化应运而生。

what：

工程化：

所谓工程化，就让人们想到一个浩大的工程，前端工程化，我们可以简单认为是将框架的职责拓宽再拓宽，主旨是帮业务团队更好的完成需求，用工程化的思想去开发前端。

前端：

前端是一种GUI软件。

从本质上讲，所有Web应用都是一种运行在网页浏览器中的软件，这些软件的图形用户界面（Graphical User Interface，简称GUI）即为前端。

前端工程化需要考虑以下问题：

重复工作：如通用的流程控制机制，可扩展的UI组件、灵活的工具方法

重复优化：如降低框架层面升级带给业务团队的耗损、帮助业务在无感知情况下做掉大部分优化（比如打包压缩什么的）

开发效率：如帮助业务团队写可维护的代码、让业务团队方便的调试代码（比如Hybrid调试）

前端工程化：总结为一句话为用工程化的思想带领前端的开发，目的为更好的管理前端，提高开发效率。

发展：

第一阶段：库/框架选型

技术选型，是前端工程化建设的第一项任务。

第二阶段：简单构建优化

工具选型，是前端工程第二阶段的任务，通过选择构建工具，对代码进行压缩，校验，资源合并。

第三阶段：JS/CSS模块化开发

模块化开发，是分而治之的思想，是目前前端最流行的分治手段。

第四阶段：组件化开发与资源管理

前端相比其他软件开发，在基础架构上更加迫切的需要组件化开发和资源管理

作用：

• 生产力提高

合理的开发流程及开发规范，包括代码规范、模块化、组件化规范等，运用分治的思想提高生产效率

• 系统可靠性提高

在前端工程化过程中会有相应的自动化代码质量检测方案，保证代码规范

• 系统的伸缩性和灵活性

在前端工程化中会有相应的自动化及高度适应性的项目 发布／部署 方案

• 用户体验度

极致的性能优化，包括减少冗余的接口请求及资源请求、提高缓存命中率等，简言之就是站点的打开及运行速度

总结：

接下来我会继续学习前端，下一篇博客会总结angular，感谢读者的阅读！