目前前端框架React、Vue、Svelte的认知

880 阅读1分钟

今年网络框架热度

今年,React.js 超过 jQuery,成为最常用的 Web 框架。 image.png

网络框架

新人 Svelte 位居榜首,成为最受欢迎的框架。React 是最需要的,也是四分之一的开发人员想要的。 image.png

React、Vue、Svelte JS 框架的设计思路

image.png

首先,是 ReactReact 是一个重运行时的框架,在数据发生变化后,并没有直接去操作 dom,而是生成一个新的所谓的虚拟 dom,它可以帮助我们解决跨平台和兼容性问题,并且通过 diff 算法得出最小的操作行为,这些全部都是在运行时来做的。

那么,Vue 这个框架,在运行时和预编译取了一个很好地权衡,它保留了虚拟 dom,但是会通过响应式去控制虚拟 dom 的颗粒度,在预编译里面,又做了足够多的性能优化,做到了按需更新。

最近很火的 Svelte ,就是一个典型的重编译的框架,作为开发者我们只需要去写模版和数据,经过 Svelte 的编译和预处理,代码基本全部会解析成原生的 DOM 操作,Svelte 的性能也是最接近原生 js 的。 image.png

  • Scheduler(调度器)—— 调度任务的优先级,高优任务优先进入

  • Reconciler(协调器)—— 负责调用 render 生成虚拟 Dom 进行 Diff,找出变化后的虚拟 Dom

  • Renderer(渲染器)—— 负责接到 Reconciler 通知,将变化的组件渲染在当前宿主环境,比如浏览器,不同的宿主环境会有不同的 Renderer