自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

原创 react 源码中 的 diff 以及 对 key 的使用

无论是在 vue 还是 react 中,使用 key 都是一个 必须面对的问题,最近就对 react 的key 做了一点学习,这里就当做个人的学习笔记了 我们就来看这里的 (已删除 多余的代码,只留下了 数组类型的 子节点 ) // This API will tag the child...

2020-05-10 14:03:39 209 0

原创 实现乞丐版的 vue data + method + computed

最近有了点空,就想着 把 vue 给搞定了, 看了一遍之后,决定自己写一个乞丐版的 vue,上班的时候划水一个早上也算是 结束了 index.html <div id="app"> {{age}} <p>{{name}}<...

2020-03-18 14:46:26 113 0

原创 vue keep-alive 内置组件与 LRU缓存机制
原力计划

export default { name: 'keep-alive', abstract: true, props: { include: patternTypes, exclude: patternTypes, max: [String...

2020-06-30 22:41:49 103 3

原创 vue3.0 api 的简单学习

vue3.0 出来了一段时间了,但是直到这一段时间,才想着要认真学一学,真是惭愧Vue 组合式 API 1、上手 下载 官方的 vue3.0 的一个包 git clone https://github.com/vuejs/vue-next-webpack-preview.git vue3...

2020-06-28 21:02:41 132 0

原创 vue 中 patch、patchVnode 函数(更新节点)createElm 函数 的学习
原力计划

在前面的博客中,我浅薄的学习了Vue 源码中 的 diff 以及 对 key 的使用,现在 再来学习一下更加难以理解的 patch 的过程 vue 在 虚拟 dom 这一块,是参照了snabbdom.js 然后在上面进行了部分的修改的,所以如果有不理解的,推荐先去学习这一个东西 1、...

2020-06-27 21:52:49 214 0

原创 vue-router 的学习以及实现

这里记录一下关于 vue-router 的学习,以及自己实现一个类似的东西 vue-router 分为 hash 模式和 history 模式,众所周知的是,hash 模式 是利用 监听hashchange 事件来实现的,而 history 则是通过监听 popstate 事件 实现的,那么...

2020-06-27 20:50:03 60 0

原创 Promise学习笔记 以及手写附带的 各种静态函数

Promise 源码 + Promise.all Promise.allSettled Promise.race Promise.resolve

2020-06-20 13:27:35 74 0

原创 es6模块化开发的基础知识

1、在现代浏览器使用模块化开发 创建一个 script 标签,加上 type="module" 属性 创建一个 index.js 文件,使用 import 引入 另外一个文件 export 的内容 启动 一个本地的服务器,可以使 http-server 或者browser...

2020-06-14 21:22:18 60 0

原创 大前端 — gulp 的简单学习

yarn add gulp --dev 在根目录创建一个 gulpfile.js exports.foo = done => { console.log('hello gulp') done() // 任务完成 目前的 gulp 只支持 异步...

2020-06-07 22:41:49 33 0

原创 大前端 — Yeoman 的 简单学习

经常会有人问我,前端的脚手架到底是什么东西?我一般也只能泛泛而谈,把对方拉到比我低的水平,然后一本正经的编点东西.... 1、脚手架是一种约定和规范 相同的文件组织结构 相同的开发范式 相同的模块依赖 相同的工具配置 相同的基础代码 然后脚手架 将这些 重复性的东西全部都集成起来...

2020-06-07 01:33:43 73 0

原创 学习《CSS世界》记录

学习了 张鑫旭 的 《CSS世界》之后,记录下部分内容 1、文字少时居中显示,多时居左 p21 <style> .box { text-align: center; width: 100px; border: 1px s...

2020-06-05 19:12:38 55 0

原创 基于 npm 的 自动化构建 的简单学习

brower-sync "serve":"brower-sync ." "scripts": { "build": "sass scss/main.scss css/style.css", ...

2020-06-02 16:56:20 64 0

原创 V8引擎内存优化+运行性能优化

V8引擎内存优化+运行性能优化

2020-05-30 23:53:46 119 0

原创 Vue 源码中 的 diff 以及 对 key 的使用,以及和 react 之间的区别

一直不想写 vue diff 的过程,因为 这一块网络上讲的人实在是太多了,这里写了也只不过是拾人牙慧罢了,但是不写吧,又觉得心痒痒的,毕竟前面写了一篇 react 的 export function isDef (v: any): boolean %checks { return v...

2020-05-29 15:32:21 115 0

原创 网络安全 学习之 https

通过对 罗剑锋的《 透视HTTP协议》 进行了学习之后,记录相关知识点 一个安全的协议是基于 机密性(Secrecy/Confidentiality)是指对数据的“保密”,只能由可信的人访问,对其他人是不可见的“秘密”,简单来说就是不能让不相关的人看到不该看的东西。 完整性(Integrit...

2020-05-28 21:49:28 137 0

原创 webpack 打包之后的代码学习

export default function count (a, b) { return a + b } import number from './number' export default function add (a, b) { ...

2020-05-28 14:07:47 101 0

原创 http 网络知识摘要

DNS 的解析过程 访问根服务器,他会告诉你 .com 的 顶级服务器 访问 .com 顶级 服务器,他会告诉你 baidu.com的地址 最后访问 baidi.com 域名 服务器,得到 www.baidu.com 的 地址 域名解析可以配置内部的策略,返回离客户端最近的主机,或者返回当...

2020-05-27 21:23:13 86 0

原创 js 里面 try catch finally 中的 return 问题

1、try catch 我们先来看 下面 的一段代码 ​ function useTry() { try { return i-- } catch (error) { return 'hh' + error } } ...

2020-05-24 20:38:49 162 0

原创 重学js 第二篇, 函数式编程

for (let 1000, ) for (let 100) 垃圾回收机制

2020-05-24 20:26:43 71 0

原创 大前端— 可视化方式的内存管理

Performance 内存问题的外在表现: 页面出现延迟加载,或经常性暂停,不断地内存溢出,然后回收,频繁垃圾回收 页面持续性出现糟糕的性能, 不断地申请新的内存,内存膨胀 页面的性能随时间延长越来越差,内存泄漏 1、任务管理器 内存,dom节点所占用的内存 实际大小...

2020-05-24 19:38:11 54 0

原创 大前端— js 内存

从全局执行上下文出发,能找到的,就被认为是可达的 js 自动的 设计 class ,进行一一对应,然后不要随便修改结构,delete,要不然会重新设计一个 V8内存 64位 1.5G 32位 800M 新生代 32M, 16M,复制,标记整理 老生代 1.4G 700M,标记清除,...

2020-05-24 19:08:18 73 0

原创 大前端 — js es6 中的小技巧

关于解构 const arr = [1, 2, 3, 5, 6, 7, 8] /** 如果我只想要 第三个,怎么办? 很简单,我甚至还能够给这个设置默认值: */ const [,,third = 'third'] = arr // 如果我想要一个对象除了 某一个 字...

2020-05-23 11:16:05 66 0

原创 typescript 的简单学习

真的只是简单学习,简单地记录我认为有意思的部分 1、安装 以及开始使用 yarn add typescript --dev 然后暴露 对应的配置 yarn tsc --init 可以看到 生成了 一个对应的 文件 tsconfig.json 查看里面的配置之后,修改里面的几项内...

2020-05-17 19:55:35 62 0

原创 flow 的简单学习

真的只是简单学习,简单地记录 1、安装 以及开始使用 在当前的目录执行 yarn add flow --dev 接着 在 要检查的文件上 添加关键字 // @flow // @flow function sum(a: number, b: number) { ret...

2020-05-17 15:38:26 90 0

原创 js 异步迭代器

同步的迭代器模式 众所周知,迭代器模式就是在已有的 对象里 增加一个 迭代函数,然后 通过迭代函数 来执行 对应的函数 const obj = { arr1: [1,2,3,4,5], arr2: [1,2,3,4,5], next(fn) { const arr = [...

2020-05-17 00:12:25 112 0

原创 webpack 打包过程 学习

通过 程柳峰 老师的 视屏学习 webpack,这里记录一下 关于 webpack 的学习笔记 1、npm run build 发生了什么 会 从 node_module/.bin 中查找 webpack.cmd 查找 webpack-cli 或者 webpack-commond 是否安...

2020-04-24 22:16:55 55 0

原创 记录一次 webpack 打包速度优化之路

最近发现了 自己在 webpack 方面知识的薄弱,正好 手里 有个 打包 两分多 的项目,就用这个项目练练手 由于 该项目的 webpack 版本 是基于 3.6.0 的 1、多进程 打包 压缩 const HappyPack = require('happypack�...

2020-04-20 13:22:06 96 0

原创 关于http 的知识总结

1、http1.1 2、http2.0 3、https

2020-04-18 21:24:43 94 0

原创 浏览器页面是怎么渲染的
原力计划

正如前面写的浏览器中输入URL后会发生什么事情--超级详细版中介绍的一样,一个 页面的渲染过程 也涉及到了 很多的东西,以及进程之间的通信 1、网络 网络进程接收到了 一个 html 文件 之后,除了会判断 content-type 之外,还会发生什么呢? 首先,要知道的是 TCP 的通讯 ...

2020-04-18 12:22:45 59 0

原创 重新了解 javascript

最近学了很多东西,发现 js 的很多内容只是凭借着我的 主观意识,或者说 感觉。所以这需要系统地学习 以及整理一下 1、变量提升 首先要明确的一点是,在 es6 出现以前,js 只有五种作用域 , 全局作用域 函数作用域 try/catch 作用域 eval 作用域 with 作用域...

2020-04-17 09:41:51 80 0

原创 浏览器中输入URL后会发生什么事情--超级详细版

这个问题实在是 老生常谈,甚至是面试必考题之一, 我这里记录一下我学习的结果,仅供自己学习 1、浏览器的进程 首先要了解的是,一个浏览器 是有好多进程的,比如 浏览器进程、渲染进程、GPU进程、网络进程、插件进程 浏览器进程 是 管理浏览器本身的,而渲染进程 基本上是一个标签页一个,那么为...

2020-04-16 10:13:04 95 0

原创 v-model 处理 中文 输入法时 和 @input :value 的区别

你或许会说 没什么区别,就是@input :value 的 语法糖,最多就是 处理的逻辑多了一点 但是 看一下截图中 箭头 所指的地方 // 看一下指令插入的地方 inserted (el, binding, vnode, oldVnode) { if (vnode.tag ...

2020-04-07 09:48:36 154 0

原创 vue $nextTick 与 MutationObserver

网络上 其实讲 nextTick 的文章五花八门,我看了也获益匪浅,但是我这段时间 看了源码之后,发现 vue 的nextTick 又有了 较大的改动 /* @flow */ /* globals MutationObserver */ import { noop } from '...

2020-04-07 09:29:32 52 0

原创 Vue 使用 函数调用组件 的方法

之前写过一篇react 方法组件构造 Loading 的使用, 现在这篇就是 Vue 版本的 方法调用组件了 组件还是 vue 组件,这个和之前是一样的 Toast/Toast.vue <template> <div class="toast" ...

2020-03-11 15:47:30 339 0

原创 vue 初试 typescript

vue 里使用 ts 需要另外装两个包 "dependencies": { "vue-class-component": "^7.2.2", // 这个是 写 vue 的官方库 "vue-prop...

2020-03-10 17:00:34 66 0

原创 flutter 提示找不到设备

昨天运行地好好地,今天跑的时候提示找不到设备 在 vscode 打开终端 输入如下所示 这样就能发现 ios 设备被打开了,然后就能愉快地 debugger了,注意,第二个命令是 上面查询出来的设备之一 便于复制,这里输一下命令: flutter emulators flutter...

2020-01-04 15:38:35 874 0

原创 flutter provide 学习笔记

作为一名前端,关于 flutter 的 状态管理器 Provide 的使用方法其实不是很能理解,因为这里出现了泛型 所以决定去看看 Provide,了解使用 Provide 中的泛型到底是怎么被使用的,同时加深对于 Dart 的理解 首先,是 github 上的 example 源码,我将会基...

2019-12-24 14:11:57 49 0

原创 react hook 中的闭包问题

在 react 中,当父组件向子组件传递一个函数的时候,那个函数中包含一个变量,state ,会产生闭包问题 上代码: // 父组件 const uploadTable = (props) => { const { uploadingFileList, } = prop...

2019-12-20 16:18:33 301 0

原创 react + mobx 实现基本的 todolist

之前使用 react 都是直接用了 redux ,对于 mobx 也只能说是 久仰久仰,现在有机会了就来试一试 mobx 是使用了 proxy 来进行数据 双向绑定的一个库,如果使用过vue 的话,对于里面的部分功能就不会陌生了 yarn add mobx yarn add mobx-rea...

2019-12-07 14:20:27 92 0

原创 react-redux 到底干了什么

function createState(reducer) { let state = null; const listeners = []; const subscribe = (listener) => listeners.push(listener); const ge...

2019-12-06 14:22:19 35 0

提示
确定要删除当前文章?
取消 删除