首页
学习
活动
专区
工具
TVP
发布

编程之旅

专栏作者
143
文章
285232
阅读量
38
订阅数
Vue3 源码解析(十):watch 的实现原理
本篇文章笔者会讲解 Vue3 中侦听器相关的 api:watchEffect 和 watch 。在 Vue3 之前 watch 是 option 写法中一个很常用的选项,使用它可以非常方便的监听一个数据源的变化,而在 Vue3 中随着 Composition API 的写法推行也将 watch 独立成了一个 响应式 api,今天我们就一起来学习 watch 相关的侦听器是如何实现的。
Originalee
2021-06-21
1.2K0
Vue3 源码解析(九):setup 揭秘与 expose 的妙用
在前几篇文章中我们一起学习了 Vue3 中新颖的 Composition API,而今天笔者要带大家一起看一下 Vue3 中的另一个新鲜的写法 —— setup。
Originalee
2021-06-21
1.7K0
Vue3 源码解析(八):ref 与 computed 原理揭秘
在 Vue3 新推出的响应式 API 中,Ref 系列毫无疑问是使用频率最高的 api 之一,而 computed 计算属性是一个在上一个版本中就非常熟悉的选项了,但是在 Vue3 中也提供了独立的 api 方便我们直接创建计算值。而今天这篇文章,笔者就会给大家讲解 ref 与 computed 的实现原理,让我们一起开始本章的学习吧。
Originalee
2021-06-17
1.2K0
Vue3 源码解析(七):依赖收集与副作用函数
在上一篇文章《响应式原理与 reactive》中由于篇幅限制笔者留下了两个小悬念 track 依赖收集处理器与 trigger 派发更新处理器没有细致讲解,而在本篇文章中笔者会带着大家一起来学习 Vue3 响应式系统中的依赖收集部分和副作用函数。
Originalee
2021-06-17
9781
Vue3 源码解析(六):响应式原理与 reactive
今天这篇文章是笔者会带着大家一起深入剖析 Vue3 的响应式原理实现,以及在响应式基础 API 中的 reactive 是如何实现的。对于 Vue 框架来说,其非侵入的响应式系统是最独特的特性之一了,所以不论任何一个版本的 Vue,在熟悉其基础用法后,响应式原理都是笔者最想优先了解的部分,也是阅读源码时必细细研究的部分。毕竟知己知彼百战不殆,当你使用 Vue 时,掌握了响应式原理一定会让你的 coding 过程更加游刃有余的。
Originalee
2021-06-11
1.2K1
Vue3 源码解析(五):Patch 算法
与 React 一样,Vue 在处理虚拟 DOM 的更新时,也有自己的 diff 算法 —— patch。
Originalee
2021-06-09
8200
Vue3 源码解析(四):代码生成器
在 Vue3 源码解析系列的第一篇文章中,笔者带领大家一起走了一遍一个 Vue 对象实例化的流程,在一起看 @vue/compiler-core 编译模块的时候,首次出现了代码生成器 —— generate 模块。为了帮助大家回顾,我们再来看一遍 compile 编译过程中发生了什么。
Originalee
2021-05-27
1.2K0
Vue3 源码解析(三):静态提升
Vue3 尚未发布正式版本前,尤大在一次关于 Vue3 的分享中提及了静态提升,当时笔者就对这个亮点产生了好奇,所以在源码阅读时,静态提升也是笔者的一个重点阅读点。
Originalee
2021-05-13
8710
Vue3 源码解析(三):静态提升
Vue3 尚未发布正式版本前,尤大在一次关于 Vue3 的分享中提及了静态提升,当时笔者就对这个亮点产生了好奇,所以在源码阅读时,静态提升也是笔者的一个重点阅读点。
Originalee
2021-05-12
7520
Vue3 源码解析(二):AST解析器
上一篇文章中,我们从 packges/vue/src/index.ts 的入口开始,了解了一个 Vue 对象的编译流程,在文中我们提到 baseCompile 函数在执行过程中会生成 AST 抽象语法树,毫无疑问这是很关键的一步,因为只有拿到生成的 AST 我们才能遍历 AST 的节点进行 transform 转换操作,比如解析 v-if、v-for 等各种指令,或者对节点进行分析将满足条件的节点静态提升,这些都依赖之前生成的 AST 抽象语法树。那么今天我们就一起来看一下 AST 的解析,看看 Vue 是如何解析模板的。
Originalee
2021-05-10
1.1K0
Vue3源码解析 —— 编译器(一)入口
Vue3 发布已经有一段时间了,最近也有机会在公司项目中用上了 Vue3 + TypeScript + Vite 的技术栈,所以闲暇之余抽空也在抽空阅读 Vue3 的源码。本着好记性不如烂笔头的想法,在阅读源码时顺便记录了一些笔记,也希望能争取写一些源码阅读笔记,帮助每个想看源码但可能存在困难的同学减少理解成本。
Originalee
2021-04-22
9830
M1芯片Mac搭建前端开发环境
M1芯片出来了有一段时间了,各类软件的兼容性已经跟进的差不多了,迫于 M1 实在太香,我的 M1 Macbook 也于本周到达了我的手上。在花费了两三个小时搭建完开发环境后,立马用它开始干活了。这几天的感受只有寥寥一语可以概括:太 TM 香了!太强了
Originalee
2021-01-20
3.1K0
初学者也能懂的Event Loop
对于初学者来说,在面试或者学习的过程中,几乎都能接触到事件循环 (Event Loop) 这个名词,但是对于一个刚入门的前端工程师来说大部分都不明白事件循环到底是什么东西,以及它的作用是什么。今天这篇文章就是以一段代码和图片的示例来展示一个简单的事件循环的过程,希望看完这篇文章,能够让你对 JavaScript 的事件循环有一个基本的概念。
Originalee
2020-12-16
3900
JavaScript —— Array 使用汇总
由于 length 和 prototype 两个属性比较通用,所以这里不过多的介绍。
Originalee
2020-06-18
6260
JavaScript —— Array 使用汇总
由于 length 和 prototype 两个属性比较通用,所以这里不过多的介绍。
Originalee
2020-06-11
5150
H5 页面 iPhoneX 刘海屏适配
对于刘海屏的适配,你的脑子里首先得有苹果手机的 Safe Area 的概念,关于 Safe Area 网上的资料已经非常多了,这里就不再赘述,更偏向实战一点。但是为了比较,我这里给出一张苹果官方文档中,iPhone8之前的常规屏幕和刘海屏 Safe Area 区域的对比图。
Originalee
2020-06-02
4.1K1
JavaScript —— Map转换Object
本文记录 ES6 中新增的 Map 对象转换为 Object 的几种方式,以及测试各种方式转换的性能。
Originalee
2020-05-28
8.4K0
CSS的优先级
CSS 中的优先级也叫做特异性,浏览器使用它来判断在元素上使用何种属性,优先级是基于不同的选择器组合而成的匹配规则。
Originalee
2020-05-26
7700
Window.location 详细介绍
如果你需要获取网站的 URL 信息,那么 window.location 对象就是为你准备的。使用它提供的属性来获取当前页面地址的信息,或使用其方法进行某些页面的重定向或刷新。
Originalee
2020-05-18
1.7K0
使用 Carbon 来分享高大上的代码片段
我在推特上关注了很多国外的程序员大佬,包括一些著名框架的官方团队,比如 Facebook 的 React 开发团队,我经常能看到他们在推特中分享一些代码片段,是以图片的方式出现的,这些代码图片让我的印象很深刻,我之前也疑惑为什么会有这么高大上的分享方式,但是没有找到答案,直到今天我在刷 Github 的时候,推给我一个热门库,随手点开来看了下,谁晓得无心插柳柳成荫,这样一个生成高大上代码片段的第三方库就在我面前了。
Originalee
2019-10-18
1.5K0
点击加载更多
社区活动
腾讯技术创作狂欢月
“码”上创作 21 天,分 10000 元奖品池!
Python精品学习库
代码在线跑,知识轻松学
博客搬家 | 分享价值百万资源包
自行/邀约他人一键搬运博客,速成社区影响力并领取好礼
技术创作特训营·精选知识专栏
往期视频·千货材料·成员作品 最新动态
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档