ZuulServletZuulServlet交给ZuulRunner去执行。由于ZuulServlet是单例,因此ZuulRunner也仅有一个实例。ZuulRunner直接将执行逻辑交由FilterProcessor处理,FilterProcessor也是单例,其功能就是依据filterType执行filter的处理逻辑
FilterProcessor对filter的处理逻辑:1.首先根据Type获取所有输入该Type的filter:List<ZuulFilter> list 2.遍历该list,执行每个filter的处理逻辑:processZuulFilter(ZuulFilter filter) 3.RequestContext对每个filter的执行状况进行记录,应该留意,此处的执行状态主要包括其执行时间、以及执行成功或者失败,如果执行失败则对异常封装后抛出 4.到目前为止,Zuul框架对每个filter的执行结果都没有太多的处理,它没有把上一filter的执行结果交由下一个将要执行的filter,仅仅是记录执行状态,如果执行失败抛出异常并终止执行
ContextLifeCycleFilter - RequestContext 的生命周期管理:
ContextLifecycleFilter的核心功能是为了清除RequestContext;请求上下文RequestContext通过ThreadLocal存储,需要在请求完成后删除该对象RequestContext提供了执行filter Pipeline所需要的Context,因为Servlet是单例多线程,这就要求RequestContext即要线程安全又要Request安全。context使用ThreadLocal保存,这样每个worker线程都有一个与其绑定的RequestContext,因为worker仅能同时处理一个Request,这就保证了Request Context 即是线程安全的由是Request安全的。
GuiceFilter - GOOLE-IOC(Guice是Google开发的一个轻量级,基于Java5(主要运用泛型与注释特性)的依赖注入框架(IOC).Guice非常小而且快.)
StartServer - 初始化 zuul 各个组件(ioc,插件,filters,数据库等)
FilterScriptManagerServlet - uploading/downloading/managing scripts, 实现热部署
Filter源码文件放在zuul 服务特定的目录, zuul server会定期扫描目录下的文件的变化,动态的读取\编译\运行这些filter,如果有Filter文件更新,源文件会被动态的读取,编译加载进入服务,接下来的Request处理就由这些新加入的filter处理
React前端框架是Facebook开源的一个js库,用于动态构建用户界面.
React解决的问题:
数据绑定的时候,大量操作真实dom,性能成本太高
网站的数据流向太混乱,不好控制
React 把用户界面抽象成一个个组件.如按钮组件 Button,对话框组件 Dialog,日期组件 Calendar.开发者通过组合这些组件,最终得到功能丰富,可交互的页面.通过引入 JSX 语法,复用组件变得非常容易,同时也能保证组件结构清晰.有了组件这层抽象,React 把代码和真实渲染目标隔离开来,除了可以在浏览器端渲染到 DOM 来开发网页外,还能用于开发原生移动应用
React核心虚拟DOM是React的基石,React的核心是组件,React的精髓是函数式编程 ,在React中是单向响应的数据流
组件的设计目的是提高代码复用率,降低测试难度和代码复杂度: 提高代码复用率:组件将数据和逻辑封装,类似面向对象中的类 降低测试难度:组件高内聚低耦合,很容易对单个组件进行测试 降低代码复杂度:直观的语法可以极大提高可读性 React特点JSX: JSX 是 JavaScript 语法的扩展
组件: 通过 React 构建组件,使得代码更加容易得到复用,能够很好的应用在大项目的开发中
单向响应的数据流: React 实现了单向响应的数据流,从而减少了重复代码,这也是它为什么比传统数据绑定更简单
Declarative(声明式编码): React采用声明范式,可以轻松描述应用(自动dom操作)
Component-Based(组件化编码)
Learn Once,Write Anywhere(支持客户端与服务器渲染)
高效:React通过对DOM的模拟(虚拟dom),最大限度地减少与DOM的交互
1.虚拟(virtual)DOM, 不总是直接操作DOM,减少页面更新次数; 2.高效的DOM Diff算法, 最小化页面重绘;灵活:React可以与已知的库或框架很好地配合
React的虚拟DOM
传统DOM更新
真实页面对应一个 DOM 树.在传统页面的开发模式中,每次需要更新页面时,都要手动操作 DOM 来进行更新
虚拟DOM
DOM操作非常昂贵.我们都知道在前端开发中,性能消耗最大的就是DOM操作,而且这部分代码会让整体项目的代码变得难以维护.React把真实DOM树转换成JavaScript对象树,也就是Virtual DOM
虚拟DOM定义:
一个虚拟DOM(元素)是一个一般的js对象,准确的说是一个对象树(倒立的)
虚拟DOM保存了真实DOM的层次关系和一些基本属性,与真实DOM一一对应
如果只是更新虚拟DOM, 页面是不会重绘的
Virtual DOM算法步骤:
用JS对象树表示DOM树的结构.然后用这个树构建一个真正的DOM树插入到文档中
当状态变更的时候,重新构造一棵新的对象树.然后用新的树和旧的树进行比较,记录两棵树差异
把差异应用到真实DOM树上,视图就更新了
进一步理解: