前端架构设计应该包含哪些东西?

发布于:2021-06-19 05:14:10

前端架构设计



后台架构设计概念适用于前端,前端没有数据库设计,所以可以不考虑并发。
vuejs的优点,一样适用于前端项目。高内聚,低耦合,可复用,单元测试。



从项目的生命周期,开发、上线、维护三个阶段考虑


    高内聚低耦合,划分清晰的模块职责范围,确定模块依赖和交互关系。打包优化,自动化部署。高性能、安全可靠、监控,局部更新。可扩展易维护,以数据来驱动视图,合理的模块拆分,层次清晰。统一的编码风格、文档留存,单元测试。

从实际项目来说,我们一般需要这么做:


    每个vue插件一个模块全局通用的工具类一个模块公共和私有的vue组件模板全局常量一个模块service模块,管理接口请求request和translate,组件模板只关心返回值。vuex模块,分模块管理公共状态,确定使用vuex的场景。用户身份、本地持久化数据。全局过滤器模块。国际化字典单独一个模块。静态资源按是否需要打包分开管理代码规范和代码检查自动化部署,webpack相关方案

业务层的设计宗旨我们关注2点:


    可复用异常即时反馈

以上内容整理略显片面,只是希望可以起到抛砖引玉的作用,让大家明白出发点应该是怎么样。



在ji设计模式中说,分辨模式的关键是意图而不是结构。我觉得结构和意图正好是框架设计需要紧紧围绕的两个核心要素。当你在进行设计时,首先要问问自己为什么这么做,如果不这么做会导致什么问题。



js设计模式



整理了常见的js设计模式,希望大家对常见的js设计模式熟悉以后再读下面的几句话,更容易产生共鸣。



    **构造器原型链模式,**是我们比较常见的设计模式,通过原型链继承的方式,将不同实例中的通用部分进行封装,可以通过new关键字创建不同的实例,每个实例都具有相同的原型链。**模块模式,**将代码封装成独立的模块,将逻辑写道内部,返回内容(可以是值、对象)传递给外部变量。利用闭包达到维系私有变量,防止污染全局作用域,隔离与其他开发者引用冲突。**单例模式,**保证一个类仅有一个实例。**观察者模式,**根据数据依赖关系创建观察者,并保存在一个数组中,当依赖数据变化的时候通知当前数据更新。**代理模式,**通过一个中间对象,实现对一个模块的控制。**工厂模式,**用于创建对象的接口。根据传入工厂的类型,可以创建出特定类型的对象。这种模式常见的实现通常是利用类或类的静态方法**责任链模式,**它是一个链式结构,请求在链中的节点之间依次传递,知道有一个对象能处理该请求为止,如果没有能处理的节点就结束执行。**Mixin模式,**多个类或者对象之间共享的功能,可以抽离出来作为Mixin,如果共享的功能是在单层次中,可以使用继承。在原型继承中,如果继承来自原型,那么对原型做出的修改会影响到从原型继承的一切内容。如果不希望出现这种情况,可以使用mixin。**命令模式,**将方法调用 请求 操作封装到单一对象中,从而根据我们不同的请求对客户进行参数化与传递可供执行的方法调用。此外,这种模式将调用操作的对象与知道如何实现该操作的对象解偶,并在交换出具体类方面提供更大的整体灵活性。 通过假设桥梁,降低耦合,一定程度遵从OOP**外观模式,**为更大的代码体提供一个方便的高层次接口,能够隐*涞撞愕恼媸蹈丛佣龋梢岳斫獬煽獾腁PI

相关推荐

最新更新

猜你喜欢