春风得意马蹄疾
一日看尽长安花

前端框架

Vue3.0 Suspense组件

liukuan阅读(294)评论(0)赞(0)

Suspense是Vue3.0推出的一个内置特殊组件,用来定义具有异步请求数据的组建的显示。如果使用Suspense,要setup函数中需要返回一个promise. 例1 新建AyncShow.vue文件,setup函数需要返回一个Prom...

Vue3.0 Teleport组件

liukuan阅读(184)评论(0)赞(0)

teleport翻译过来就是"远距离传送"。Teleport组件设计的目的是将某个组件挂载在指定的元素上。在Vue3.0以前,我们所有组件都被挂载在根节点上如id是app的div,其他组件会一层层嵌套在整个html节点树...

Vue3.0 Composition API提取公共逻辑

liukuan阅读(391)评论(0)赞(1)

Composition API用于公共逻辑的提取,提高复用性,在Vue2.0中我们可以使用mixins的方式提取一些公共处理逻辑。以记录用户点击屏幕位置为例来说明,显示每次用户鼠标点击屏幕的位置,不考虑代码的复用性,我们会直接写出下面的代码...

Vue3.0语法

liukuan阅读(1286)评论(0)赞(2)

setup函数 在Vue3.0中提出了Composition API的概念,Vue2.0中我们通过props、data、methods等来定义组件,在Vue3.0中我们使用setup定义响应式的数据和方法 例: <template&g...

Vue3.0新特性

liukuan阅读(174)评论(0)赞(0)

Vue2.0数据响应 我们知道在Vue3.0之前的对象数据响应式的原理是Object.defineProperty(),数组的响应式原理是拦截数组的7个方法(包括push、pop、shift、unshift、splice、sort、reve...

React diff算法原理剖析

liukuan阅读(276)评论(0)赞(0)

React 中最值得称道的部分莫过于 Virtual DOM 与 diff 的完美结合,特别是其高效的 diff 算法,让用户可以无需顾忌性能问题而”任性自由”的刷新页面,让开发者也可以无需关心 Virtual DOM 背后的运作原理,因为...

React高性能的体现:虚拟DOM

liukuan阅读(245)评论(0)赞(1)

React高性能的原理 在Web开发中我们总需要将变化的数据实时反应到UI上,这时就需要对DOM进行操作。而复杂或频繁的DOM操作通常是性能瓶颈产生的原因(如何进行高性能的复杂DOM操作通常是衡量一个前端开发人员技能的重要指标)。 Reac...

react性能优化

liukuan阅读(132)评论(0)赞(0)

避免重复渲染 当一个组件的props或者state改变时,React通过比较新返回的元素和之前渲染的元素来决定是否有必要更新实际的DOM。当他们不相等时,React会更新DOM。 在一些情况下,组件可以通过重写这个生命周期函数shouldC...

函数式组件使用Hook实现生命周期

liukuan阅读(475)评论(0)赞(2)

Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。 Hook中的useEffect,通过使用这个 Hook,可以告诉 React 组件需要在渲染后执行某些...

Vue响应式原理

liukuan阅读(139)评论(0)赞(0)

Vue最显著的特性之一便是不太引人注意的响应式系统(reactivity system)。模型层(model)只是普通JS对象,修改它则更新视图(view)。这会让状态管理变得非常简单且直观,不过理解它的工作原理以避免一些常见的问题也是很重...