前端架构
文章平均质量分 90
曾经沧海难为水-除却巫山不是云
这个作者很懒,什么都没留下…
展开
-
Methods to improve code quality: domain model, design principles, design patterns
A root cause of poor code1 Embodiment of poor codeWe can enumerate the manifestations of a lot of poor-quality code, such as unintelligible names, super large classes, super large methods, repetitive code, difficult code, difficult code modification...翻译 2021-09-01 00:11:19 · 456 阅读 · 0 评论 -
架构整洁之道
一、架构设计的目标 用最少的人力成本满足构建和维护该系统的需求 衡量指标 工程师团队规模 代码总行数 代码变更行数 二、软件系统的价值 行为价值 按需求文档编写代码 可用性 功能性bug 性能 稳定性 紧急,但是...原创 2020-03-01 02:04:53 · 247 阅读 · 0 评论 -
【前端架构】演进式架构
一、更新 依赖和框架版本升级 当修订号发生变更时,通常只是进行一些Bug的修复,不需要我们做出响应 当次版本号发生变更时,往往可能会发生一些API变更,我们要视向下兼容情况来决定是否跟进 当主版本号变化时,可能有些API已经不存在了,我们需要大量地改动应用 语言版本升级 遗留系统重搭 二、迁移方式 微前端 ...原创 2020-02-10 01:36:03 · 238 阅读 · 0 评论 -
【前端架构】微前端实战
一、遗留系统:路由分发 路由分发式微前端 适用场景 不同技术栈之间差异较大,难以兼容、迁移、改造 项目不想花费大量的时间在这个系统的改造上 现在的系统在未来将会被取代 系统功能已经很完善,基本不会有新需求 基于路由分发的Nginx配置示例 路由分发的测试...原创 2020-02-10 00:14:42 · 699 阅读 · 0 评论 -
【前端架构】微前端架构设计
一、微前端 微前端架构 应用自治 单一职责 技术栈无关 为什么需要微前端 遗留系统迁移 后端解耦,前端聚合 热闹驱动开发 二、微前端的技术拆分方式 路由分发式:通过HTTP服务器的反向代理功能,将请求路由映射到对应的应用上 前端微服务化:在不同的框架之上设计通信和...原创 2020-02-06 00:12:44 · 702 阅读 · 0 评论 -
【前端架构】前后端分离架构设计
一、前后端分离 为什么选择前后端分离 独立部署 分清职责 技术栈独立 方便系统演进 提高效率 前后端分离的开发模式 按业务的展示逻辑,确认出待展示的内容 前后端根据内容,一起细化每个字段名,直至接口确认完毕 遇到对接第三方接口时,需要反复进行上一步 ...原创 2020-02-02 22:20:43 · 1266 阅读 · 0 评论 -
【前端架构】组件化架构设计
一、前端的组件化架构二、基础:风格指南 原则与模式 亲密性,即将相关的项(组件)组织到一起 对齐,每一项都应当与页面上的内容存在某种视觉联系 重复,重复元素以体现一致性 对比,对比产生强调,以强调产生强烈的反差 色彩 主题色,又可以称为品牌色,用于体现产品的特色和宣传时使用 功能...原创 2020-01-31 17:48:00 · 776 阅读 · 0 评论 -
【前端架构】单页面应用设计
一、前端MVC架构 Model模型层:获取、存放所有的对象数据 View表现层:呈现信息给用户 Controller控制层:模型和视图间的纽带 二、MVC架构原理 简单Model层实现 简单Controller层实现 简单View层实现 简单MVC调用逻辑实现 三、设计双向绑定的MVC ...原创 2020-01-29 18:11:20 · 456 阅读 · 0 评论 -
【前端架构】多页面应用设计
一、单页面应用分析 构建成本 本地构建流程处理 持续集成服务器 当框架提供的构建流程不符合需求的时候,需要重写构建脚本 学习成本 前端技术更新快 旧框架维护学习成本 新框架学习成本 后台渲染成本 预渲染,向搜索引擎提供一份可以被索引的HTML代码 ...原创 2020-01-18 00:56:36 · 651 阅读 · 0 评论 -
【前端架构】构建流设计
构建系统是一个Web应用不可缺少的部分,其核心用途是,帮助开发者从源代码开发开始,构建出最后可用的目标软件。开发人员还能通过构建系统中的构建工具添加更多实用的功能,如修改监测代码触发代码编译后自动地刷新浏览器,在构建系统时配置不同的环境参数,在本地运行的时候做反向代理,等等。 下面我们将介绍设计构建流的一些方法。依赖管理工具 AMD方式:通过Bower...原创 2020-01-02 10:00:57 · 222 阅读 · 2 评论 -
【前端架构】工作流设计
基础规范 规范代码组织结构 统一代码风格,即源代码的书写风格 组件、函数等命名规范 开发工具规范 代码组织结构 统一代码风格 使用Lint规范代码 HTMLHint CSSLint ESLint TSLint 规范化命名,提升可读性 命名法:(1)驼峰命名法;(2)下划线命名法;(3)匈牙利命名法 CSS及其预处理器命名规则:如Airbnb CSS...原创 2020-01-02 09:59:43 · 301 阅读 · 1 评论