- 博客(141)
- 资源 (5)
- 收藏
- 关注
原创 【vue3源码】十四、认识vnode中的shapeFlag和patchFlag属性
介绍vnode中的shapeFlag和patchFlag属性属性
2022-09-29 21:37:35
2741
原创 【vue3源码】十三、认识Block
Block是vue3中一种性能优化的手段。Block本质是一种特殊的vnode,它与普通vnode相比,多出了一个属性,这个属性中保存了所有Block子代的动态节点。Block进行patch可以直接对中的动态节点进行patch,避免了静态节点之间的比较。Block每次创建Block节点之前,需要调用openBlcok方法,创建一个新的数组赋值给,并push到blockStack的栈顶。在创建vnode的过程中如果满足一些条件,会将动态节点放到中。节点创建完成后,作为参数传入setupBlock中。
2022-09-20 16:25:36
3033
原创 【vue3源码】十二、认识虚拟DOM
虚拟DOM(也可以称为vnode)描述了一个真实的DOM结构,它和真实DOM一样都是由很多节点组成的一个树形结构。
2022-09-14 22:20:10
1051
原创 【vue3源码】十一、初始vue3中的渲染器
vue3中的渲染器主要作用就是将虚拟DOM转为真实DOM渲染到对应平台中,在这个渲染过程中会包括DOM的挂载、DOM的更新等操作。通过方法会创建一个渲染器renderer,rendererrender、hydrate、createApp,其中render方法用来进行客户端渲染,hydrate用来进行同构渲染,createApp用来创建app实例。中包含了大量的函数用来处理挂载组件、更新组件等操作。
2022-09-10 22:53:45
1265
原创 【vue3源码】六、scheduler
scheduler通过三个队列实现,在vue只需通过调用、、queueJob方法将job添加到对应队列中,不需要手动控制job的执行时机,完全将job的执行时机交给了scheduler进行调度。queue执行时机DOM更新前queue中的job就包含组件的更新DOM更新后是否允许插队不允许允许不允许job执行顺序按入队顺序执行,先进先出按job.id升序顺序执行job。保证父子组件的更新顺序按job.id升序顺序执行jobscheduler中通过将队列中job的执行(即。
2022-07-22 21:09:36
1224
1
原创 【vue3源码】五、watch源码解析
本文将介绍watch、watchEffect、watchSyncEffect、watchPostEffect的具体实现。
2022-07-14 20:47:21
1389
原创 【pinia源码】四、mapHelper API源码解析
【pinia源码】系列文章主要分析pinia的实现原理。本篇文章将分析pinia中辅助函数的实现。
2022-06-20 10:31:22
2880
原创 【pinia源码】三、storeToRefs源码解析
【pinia源码】系列文章主要分析pinia的实现原理。本篇文章将分析storeToRefs的实现。
2022-06-19 13:55:51
3489
2
原创 【pinia源码】二、defineStore源码解析
【pinia源码】系列文章主要分析pinia的实现原理。本篇文章将分析defineStore的实现。
2022-06-18 22:52:54
4278
原创 【pinia源码】一、createPinia源码解析
【pinia源码】系列文章主要分析pinia的实现原理。本篇文章将分析createPinia的实现。
2022-06-17 22:17:50
2079
原创 【vue-router源码】十四、RouterView源码分析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析RouterView组件的实现。为了更好理解的渲染过程,我们看下面的例子:先规定我们的路由表如下:假设我们的地址是。现在我们访问,你肯定能够想到中显示的肯定是组件。那么它是怎样渲染出来的呢?首先我们要知道在进行时,会进行第一次的......
2022-06-15 22:41:12
848
原创 【vue-router源码】十三、RouterLink源码分析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析RouterLink组件的实现。
2022-06-14 15:35:31
586
原创 【vue-router源码】十二、useRoute、useRouter、useLink源码分析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析useRoute、useRouter、useLink的实现。
2022-06-13 17:29:26
2190
原创 【vue-router源码】十一、onBeforeRouteLeave、onBeforeRouteUpdate源码分析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析onBeforeRouteLeave、onBeforeRouteUpdate的实现。
2022-06-12 21:51:46
7830
原创 【vue-router源码】十、isReady源码解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析isReady的实现。
2022-06-12 17:19:18
1978
原创 【vue-router源码】九、全局导航守卫的实现
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析全局导航守卫的实现。
2022-06-11 08:11:59
665
原创 【vue-router源码】八、router.go、router.back、router.forward源码解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。本篇文章将介绍router。go、router.back、router.forward的实现。
2022-06-10 08:16:40
4098
原创 【vue-router源码】七、router.push、router.replace源码解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将分析push的实现,通过该文章你会了解一个稍微完整的导航解析流程。
2022-06-09 08:00:00
4762
原创 【vue-router源码】六、router.resolve源码解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将介绍router.resolve的实现。
2022-06-08 12:31:37
2511
原创 【vue-router源码】五、router.addRoute、router.removeRoute、router.hasRoute、router.getRoutes源码分析
【vue-router源码】系列文章将带你从0开始了解的具体实现。该篇文章将分析router.addRoute的实现。
2022-06-07 10:40:03
4843
原创 【vue-router源码】四、createRouter源码解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将带你分析的createRouter实现。
2022-06-07 08:57:22
5272
原创 【vue-router源码】三、理解Vue-router中的Matcher
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。该篇文章将带你理解vue-router的matcher。
2022-06-06 22:13:42
2625
原创 【vue-router源码】二、createWebHistory、createWebHashHistory、createMemoryHistory源码解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。
2022-06-05 22:37:50
19207
1
原创 【vue-router源码】一、router.install解析
【vue-router源码】系列文章将带你从0开始了解vue-router的具体实现。
2022-06-04 18:00:16
1968
原创 vue组件移动在DOM节点中的位置
mounted() { this.$nextTick(() => { const body = document.querySelector('body') body.append(body) })}
2020-05-11 09:31:42
3019
原创 【Docker】Docker服务外部无法访问
近期使用Dokcer启动tomcat,在宿主机上可以正常访问,而使用外部浏览器访问时,无法正常打开页面,通过以下步骤进行排查解决:一、检查防火墙设置1.1 查看防火墙是否正在运行firewall-cmd --state 打印running,防火墙正在运行,下面尝试关闭防火墙试试:systemctl stop firewalld.service 关闭防火墙后,外部继续访问,仍...
2020-01-16 09:45:44
6239
原创 Web Components之自定义HTML标签
一、Web Components Web Components是一种组件化的方式,它允许您创建可重用的定制元素(它们的功能封装在您的代码之外)并且在您的web应用中使用它们。Web Components的一个重要特性是封装,通过Web Components创建的组件,可以有效地将其自身的html结构、css样式及行为隐藏起来,并从页面中的其他代码分离出来,也就是每个组件都是独立的,不会互相干扰...
2020-01-07 08:51:30
1179
2
原创 【Nginx】Nginx负载均衡配置
一、什么是负载均衡? 负载均衡就是将负载分配到不同的服务器上,保证服务的响应速度。二、Nginx配置负载均衡 Nginx配置负载均衡相对简单,在nginx中的conf目录中找到nginx.conf,添加一下配置:http { ... upstream myserver { server ip_address:port; server ip_address:port; }...
2019-12-30 21:56:17
218
1
原创 【Docker】CentOS 7安装Docker
一、安装docker依次执行以下命令sudo yum install -y yum-utils device-mapper-persistent-data lvm2sudo yum-config-manager --add-repo https://download.docker.com/linux/centos/docker-ce.repoyum install docker-ce d...
2019-12-29 19:24:11
198
原创 【Nginx】Nginx常用命令
以下命令均在nginx的安装路径下的sbin目录下执行# 查看nginx版本号./nginx -v# 启动nginx./nginx# 关闭nginx./nginx -s stop# 重新加载nginx./nginx -s reload
2019-12-28 22:44:34
201
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人