最近部门分享，有同学提到了 Vue 响应式原理，大家在讨论时，发现一些同学对这一知识理解还不够深入，不能形成一个闭环，为了帮助大家理解这个问题，我重新过了一下 Vue 源码，并整理了多张流程图，便于大家理解。 从 Vue 初始化，到首次渲染生成 DOM 的流程。 从 Vue 数…

前端同学大多常用技术栈都是简单易上手的vue。平时项目开发中配合使用vue-devtools如鱼得水。但是现网环境出现状况，如何快速定位问题呢？下面的骚操作让你调试现网环境就像开发时一样。

前言 大家好，我是林三心，在日常面试中，Diff算法都是绕不过去的一道坎，用最通俗的话，讲最难的知识点一直是我写文章的宗旨，今天我就用通俗的方式来讲解一下Diff算法吧？Lets Go 什么是虚拟DO

JSX就是Javascript和XML结合的一种格式。React发明了JSX，利用HTML语法来创建虚拟DOM。当遇到<，JSX就当HTML解析，遇到{就当JavaScript解析. 想折腾一下呗,开玩笑.最开始是因为近期在学习react,在里面体验了一把jsx语法,发现也并没…

由浅入深，从Vue组件的Slot、VNodes讲解Render函数和JSX

TL,DR： 如果你的组件不需要状态，那么将其转换为函数式组件可以将性能提高70%。 函数组件(不要与 Vue 的 render 函数混淆)是一个不包含状态和实例的组件。 简单的说，就是组件不支持响应式，并且不能通过 this 关键字引用自己。 没有状态或实例，你可能会好奇如何…

watch 是由用户定义的数据监听，当监听的属性发生改变就会触发回调，这项配置在业务中是很常用。在面试时，也是必问知识点，一般会用作和 computed 进行比较。 那么本文就来带大家从源码理解 watch 的工作流程，以及依赖收集和深度监听的实现。在此之前，希望你能对响应式原…

虽然Vue.js为我们提供了有用的computed, 但在某些场景下, 仍然还是需要使用到watch. 如上代码所示, 只有当dog的值有发生改变时, watch中的dog函数才会执行. 但是, 在某些情况下, 你可能需要在创建组件后立即运行监听程序. 你可以在使用watch时…

众所周知，在组件式开发中，最大的痛点就在于组件之间的通信。在 Vue 中，Vue 提供了各种各样的组件通信方式，从基础的 props/$emit 到用于兄弟组件通信的 EventBus，再到用于全局数据管理的 Vuex。 在这么多的组件通信方式中，provide/inject …