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

青笔原创

专栏作者
43
文章
73199
阅读量
17
订阅数
手写 Vue (一):虚拟 DOM
最近公司面试了一些中高级前端,由于公司技术栈以 Vue 为主,而对于中高级前端,必不可少要问及 Vue 源码的问题。很多面试者,对于源码只能简单讲到响应式是基于 Object.defineProperty 或者 Proxy 等老生常谈的基础概念。Vue 经过这么多年的发展,成了很多前端开发者职业生涯不可或缺的一个框架。诚然,每个人都可以在短时间学习一个框架的使用,但是要深入阅读它的源码确实不是一件容易的事。这里面有很多因素,除了业务开发繁忙外,面对一个复杂庞大的代码库,以及众多平时不经常使用的构建工具和新的编程语言等干扰因素,我们时常不知道该从哪里切入。为了应付面试,只能通过一些面经文章和博客,快速获得一些基本的认知,但一旦面试官深入拷问,真正看过源码还是只看过文章,就水落石出。真正读懂源码不是靠一场突击战就能做到的,而是像浇花种树一样,日积月累,反复刻意的练习和回顾,到最后甚至可以自己写出一个框架,才算真正掌握。既然是一场持久战,我们就不能指望在短时间内把整个框架一口吃进去,而是将其分割成一个个小的技术点,一次消化一个单一技术点,连点成线,最后就能吃下整个框架。本文以及接下来一系列文章,尝试将 Vue 源码拆分成独立的技术点,并动手编码实现。
我是一条小青蛇
2020-12-09
6780
手写 Vue (二):响应式
提到 Vue 的响应式,通常指的是视图跟随数据的改变而更新。开发上带来的便利是,在需要更新视图呈现时,只需修改视图渲染所需要的数据即可,而不用手动操作DOM。从实现来说,可以分为两个部分:
我是一条小青蛇
2020-12-09
6610
JS 中的钩子(Hook)实现
Hook 这个词很多人都听过,就算不知道,也直接或间接地用到过。它通常是系统或框架开放出来供上层应用开发者执行代码的一种方式。例如,Vue 的生命周期钩子,本质就是框架内部在对应时机调用了组件定义的钩子函数;此外,Webpack 所使用 tapable 更是将 hook 的应用发挥的淋漓尽致,tapable 最值得称赞的就是,它对 hook 做了很好的抽象和分类。
我是一条小青蛇
2020-12-09
2.8K0
前端插件化架构的思考
有挺长时间没有更新博客了。一来是公司比较忙,二是自己也在思考一些新的问题。最近一个月,在我脑海回想最多的一个词语是“插件化架构”。作此文,也是想简单分享一下我对这个问题的见解。
我是一条小青蛇
2020-03-17
2.6K0
数据结构基础知识: 表 栈 队列 树 散列 堆
表,栈和队列是计算机科学中最简单和最基本的三种底层数据结构。事实上,每一个有意义的程序都将明晰地至少使用一种这样的数据结构,而栈则在程序中总是要间接地用到,不管你在程序中是否做了声明。
我是一条小青蛇
2019-11-21
1.1K0
一开始看不上亲密接触后又让你欲罢不能的 vim
每一个程序员都有一款心心念叨的代码编辑器。而在众多妖颜魅惑的编辑器偶像团体前,vim 就像个不加粉饰的农村姑娘,咋一看是那样朴实无华,难有倾心。但只要走近一点,来个亲密接触,又会被她的似水柔情所俘获。
我是一条小青蛇
2019-11-21
7090
Vue3 深度解析
距离尤雨溪首次公开 Vue3 (vue-next)源码有一个多月了。青笔观察到,刚发布国庆期间,出现不少解读 Vue3 源码的文章。当然不少有追风蹭热之嫌,文章草草讲讲响应式原理,或者只是做了一些上层的导读,告诉读者应该先看哪再看哪。不能说这些文章就没有一点价值,它确实能够让你在短时间内,不用过多思考就能了解到一些 Vue3 重中之重的“干货”。但是过于干货的未必就是好的。因为干货通常是经过作者咀嚼过后的产物,大部分营养其实只被作者消化了。留给读者的只是一些看似很有料,实则没有营养的残渣。就像一块啃到只剩骨头的排骨。这样的文章通常适合于媒体传播,仅用于快速捕获眼球。但是对于想更细致了解 Vue3 的专业前端开发,这显然远远不够。
我是一条小青蛇
2019-11-20
5.1K0
简单好用的Boss岗位搜索库(附github链接)
昨天一个朋友说最近想换工作。想让我帮看下Boss现在的招聘情况如何。正好想到上个月写了个开源爬虫框架kcrawler,最后添加了一个Boss类支持,可以实现快速根据关键词查询不同岗位,不同行业的的招聘情况。有现成可用的库,帮助朋友也是举手之劳。
我是一条小青蛇
2019-11-20
1.2K0
pitu: 开源命令行P图工具
对单张图片处理分为: 缩放(zoom),旋转(rotate),镜像(flip),裁剪(cut),灰度(gray),添加文本(text) 。
我是一条小青蛇
2019-11-20
6090
基础排序算法
使用比较运算符” < ”和” > ”,将相容的序放到输入中,且除了赋值运算符外,这两种运算是仅有的允许对输入数据进行的操作,在这些条件下的排序叫做“基于比较的排序”。本文介绍的除了桶式排序都是基于比较的排序。
我是一条小青蛇
2019-11-20
5320
从零开始构建 vue3
2019年10月5日凌晨,Vue 的作者尤雨溪公布了 Vue3 的源代码。当然,它暂时还不是完整的 Vue3,而是 pre-alpha 版,只完成了一些核心功能。github 命名为 vue-next ,寓意下一代 vue 。在笔者发文前,已经有很多大佬陆续发布了一些解读 Vue3 源码的文章。但是,本文并不打算再增加一篇解读源码的文章,而是以项目参与者的视角,通过动手实践,一步步理解和搭建自己的 Vue3 项目。因此,为了达到最佳效果,建议读者,一边阅读本文,一边打开终端跟着一步步动手实践。你将掌握所有构建 Vue3 所必须的知识。
我是一条小青蛇
2019-10-23
1.5K0
OpenCv-Python 开源计算机视觉库 (一)
1999年,英特尔的 Gary Bradsky 发起了 OpenCv 项目,并于 2000 年发布第一个版本。2005年,OpenCv 被首次应用在 Stanley,这也是赢得同年 DARPA 大挑战赛的车型。如今,OpenCv 除了支持计算机视觉,还增加了众多机器学习相关算法,未来还将持续扩展。
我是一条小青蛇
2019-10-23
2.3K0
python 数据分析工具包 pandas(一)
pandas 是专为 python 编程语言设计的高性能,简单易用的数据结构和数据分析工具库,它建立在 numpy 之上,可以许多第三方库完美集成在同一个科学计算环境中。pandas 被广泛应用于金融,统计,社会科学和许多工程技术领域,处理典型数据分析案例。
我是一条小青蛇
2019-10-23
8940
python 自动抓取分析文章阅读量——掘金专栏版
进入掘金个人主页,打开开发者工具,点击“专栏” tab ,在开发者工具”Network->XHR->Name->get_entry_by_self->Headers->Request URL” 复制 url。
我是一条小青蛇
2019-10-23
6950
算法分析基础
在数据量不大时,我们的程序只需要考虑能否实现功能。但随着用户量的增长以及随之而来的用户行为数据和各种业务数据的急剧增加,那些仅仅能满足功能的代码,就不得不再考虑它的运行效率。如果运行过于漫长,就算实现了功能,这样的程序在实际生产中也是不能用的,必须对程序算法进行分析,给出时间复杂度更低的改进算法。本文从初学者角度介绍算法分析的数学基础,以及如何使用大 $O$ 法分析程序或算法的时间复杂度和常用的分析法则。
我是一条小青蛇
2019-10-23
5530
python 自动抓取分析房价数据——安居客版
中秋回家,顺便想将家里闲置的房子卖出去。第一次卖房,没经验,于是决定委托给中介。中介要我定个价。最近几年,房价是涨了不少,但是长期在外,也不了解行情。真要定个价,心里还没个数。网上零零散散看了下,没有个系统的感知。心想,身为一代码农,为何要用这种低效的方式去了解房价。于是,就有了今天这篇专栏,也是继上篇《python 自动抓取分析文章阅读量——掘金专栏版》json 爬虫的一个补充。这次要抓取的房价来自安居客,西双版纳房价数据(其他房产相关的垂直平台还未覆盖)。之所以说是上一篇的补充,因为,这次数据来自 html 。废话不多说,撸起袖子开始干。
我是一条小青蛇
2019-10-23
2.8K0
python 命令行抓取分析北上广深房价数据
昨天在老家,发布了一篇《python 自动抓取分析房价数据——安居客版》。在文末,第6小节提供了完整代码,可以在 python3 环境,通过命令行传入参数 cookie 自动抓取房价数据。今天回到深圳,才想到,这段脚本只能抓取西双版纳的房价数据,如果读者不自己修改,那么就无法抓取其他城市的房价数据。于是,决定“好事做到底,送佛送到西”,将脚本加以修改,以北上广深为例,提供灵活抓取分析其他城市房价的完整代码。
我是一条小青蛇
2019-10-23
7190
如何发布自己的 python 包?
本文以笔者实际发布的 python 包 imgkernel 为例。因此,在本文所有出现 imgkernel 的地方,都替换成读者自己项目或包的名称。 同时,imgkernel 也托管在 github 上,后续 master 分支会更新,但是项目单独检出的 pkg 分支将保持与本文内容一致,不再改动。因此,可以将此分支 clone 下来作为新项目启动工程。clone pkg 分支的方法如下:
我是一条小青蛇
2019-10-23
5940
Python内置函数
所谓内置函数,就是无需import,就可以直接使用的函数 1. python2 & python3 内置函数统计 python2: 76 个 python3: 69 个 2. Python2与Python3公有的内置函数 2.1 数学计算(7个) 序号 函数 作用 示例 1 abs() 求绝对值 >>> abs(-1)1 2 round() 将小数四舍五入,默认保留0位小数 >>> round(1.4)1 >>> round(1.55, 1)1.6 3 pow() 指数求幂, 等价于幂运算符: x**
我是一条小青蛇
2019-10-23
6370
linux 查看系统信息和运行状态实用命令汇总
本文所有 shell 命令均在阿里云ECS服务器上测试过,以确保每行代码都是百分百可用的。测试使用的服务器配置信息如下:
我是一条小青蛇
2019-10-23
3.1K0
点击加载更多
社区活动
RAG七天入门训练营
鹅厂大牛手把手带你上手实战
Python精品学习库
代码在线跑,知识轻松学
博客搬家 | 分享价值百万资源包
自行/邀约他人一键搬运博客,速成社区影响力并领取好礼
技术创作特训营·精选知识专栏
往期视频·千货材料·成员作品 最新动态
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档