前端的时代意义业务逻辑与交互逻辑表现层(InterfaceLayer)性能控制层(InterfaceControlLayer)业务逻辑层(BusinessLogicLayer)数据访问层(DataAccessLayer)数据存储层(DataStorageLayer)分层架构是实现关注点分离的必要途径。业务逻辑是真实业务规则的编码实现,决定了数据创建、存储和修改的规则。交互逻辑是指数据呈现给用户的方式。前端边界分层架构最典型的优点之一就是负责每一层的开发人员可以实现并行开发。目前,前端仍然围绕交互逻辑构建。架构与工程代码和过程是软件工程的核心关注点。从代码的角度来看,工程化的目标是保证软件的高可用、可扩展性、扩展性、性能和安全性。这些元素共同构成了软件的技术架构。除了架构,工程从更宏观的角度提升开发和维护过程的管控,强调项目迭代的规范、有序、可控和高效,并根据架构的特点提供额外的辅助功能。建筑学是工程学的一个子集。架构之外的前端工程部分称为前端工程服务体系。前端工程=前端技术架构+前端工程服务体系分散的前端架构前端架构包括链接:源代码组织规范组件化/模块化数据管理性能优化前端分离和模糊前端工程边界前端和测试单元测试、集成测试、端到端测试、验收测试。单元测试和集成测试通常由开发人员在交付应用程序进行测试之前执行。端到端测试通常由测试工程师完成,测试范围包括功能、性能、健壮性、稳定性等。验收测试是指从用户的角度评估应用是否满足要求,是负责需求方(通常是产品经理)。前端架构师的职责是根据业务特点设计合理的前端技术架构。根据架构特点,构建高效的前端工程服务系统技术架构。熵增加(正熵)意味着系统趋于无序,熵减小(负熵)意味着系统趋于有序。在软件架构中,熵增的极端结果是激进的重构。架构师的职责是通过及时有效的干预,使软件架构产生负熵,从而维护系统的秩序。软件架构的两个基本要素:分而治之和聚合。通过合理解耦各组件/层级的功能,提高系统的效率和灵活性。所有组件/层次在完成各自功能的同时,组合成一个完整的软件系统。编程语言前端架构师在编程语言方面的工作重点不是语言本身,而是在充分理解语言特性的前提下制定适合业务类型的开发规范和技术栈。技术规范包括编码规范、项目源码组织结构、依赖管理、第三方技术选型等。唯一的原则是一致性。CodeReview的目的:发现代码逻辑的缺陷和算法对性能的不利影响;纠正开发者不规范的编码方式。组件化融入了面向对象的概念,需要考虑封装性、可扩展性、可组合性、可重用性。根据与产品逻辑的耦合程度,可以分为基础组件和业务组件。前后端分离的目的是将前端开发与后端开发解耦,实现开发、维护、部署和发布的相对独立。解决方案分为两类:SPA架构和Node.js渲染层。Performance加载性能,主要目标是尽快将网站呈现给用户执行性能,主要目标是快速响应用户操作一种适用于前端并契合Web整体架构的性能优化策略。工程服务系统前端工程最基本的原则是在保证产品功能的前提下,尽可能降低迭代成本。成本分为:人工成本和通讯成本。前端工程服务体系的目标:降低开发本身的人力成本,降低跨团队协作开发消耗的沟通成本,减少重复性体力劳动,建立标准化的代码版本管理规范,辅助跨团队并行开发.Buildprogramminglanguage:构建特定于编程语言的相关函数,可以理解为编译,即把源代码转换为客户端可执行文件的过程。CSS预编译,特定开发框架编译性能优化:压缩混淆,自动生成CSSSprite,动态模块按需加载部署策略:静态资源URL添加hash指纹和CDN路径开发效率:文档生成,动态构建审核评估:规范审核、性能评估、部署部署的核心不是对不同类型资源的处理,而是对流程的控制。持续工程的第一步是合理使用工具,提高各个环节的独立工作效率;第二步,构建流程自动化,提高跨团队协同开发的效率,整体降低迭代的时间成本;最终目标是可持续性。监控统计监控前端的稳定性一方面是针对前端本身的交互逻辑,但更多的是针对数据接口,即服务端的稳定性。当前端调用接口没有返回预期结果时,会立即反馈给监控平台并上报错误信息,以便在第一时间定位到问题的症结所在。本文节选自《前端技术架构与工程》
