栗子纪blog

2021-02-09liukuan阅读(770)评论(1)赞(1)

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

2021-02-09liukuan阅读(536)评论(0)赞(2)

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

2021-02-09liukuan阅读(1176)评论(0)赞(1)

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

2021-01-29liukuan阅读(3210)评论(0)赞(8)

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

2021-01-29liukuan阅读(498)评论(0)赞(0)

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

2020-11-05liukuan阅读(604)评论(0)赞(0)

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

2020-11-05liukuan阅读(493)评论(0)赞(1)

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

2020-10-27liukuan阅读(589)评论(0)赞(1)

webpack的热更新又称热替换（Hot Module Replacement），缩写为HMR。 这个机制可以做到不用刷新浏览器而将新变更的模块替换掉旧的模块。 首先要知道server端和client端都做了处理工作 第一步，在 webpa...

2020-10-27liukuan阅读(827)评论(0)赞(0)

用webpack优化前端性能是指优化webpack的输出结果，让打包的最终结果在浏览器运行快速高效。 压缩代码。删除多余的代码、注释、简化代码的写法等等方式。可以利用webpack的UglifyJsPlugin和ParallelUglify...

2020-10-27liukuan阅读(419)评论(0)赞(1)

Webpack的运行流程是一个串行的过程，从启动到结束会依次执行以下流程 1、初始化参数：从配置文件和Shell语句中读取与合并参数，得出最终的参数 2、开始编译：用上一步得到的参数初始化Compiler对象，加载所有配置的插件，执行对象的...