全玉 - 博客园

2020年5月16日

摘要： React的事件处理使用合成事件(SyntheticEvent)，不是原生事件。 1. 合成事件的异步访问合适事件为了节约性能，使用对象池。当一个合成事件对象被使用完毕，即调用该对象的同步代码执行完毕，该对象会被再次利用。其属性会被重置为null。所以异步访问合适事件的属性，是无效的。解决方法有阅读全文

posted @ 2020-05-16 18:35 全玉阅读(2757) 评论(0) 推荐(0) 编辑

mobx的实现原理

摘要： 1. mobx是基本概念 Observable //被观察者 Observer //观察者 Reaction //响应 1.1 在被观察者和观察者之间建立依赖关系通过一个Reaction来track一个函数，该函数中访问了Observable变量，Observable变量的get方法会被执行，此时阅读全文

posted @ 2020-05-16 17:06 全玉阅读(3737) 评论(0) 推荐(1) 编辑

2020年5月15日

js自定义事件

摘要：标准浏览器自定义事件 document.createEvent() event.initEvent() element.dispatchEvent() 自定义事件的函数有 Event、CustomEvent 1、Event // 向 window派发一个resize内置事件 window.dispa 阅读全文

posted @ 2020-05-15 22:45 全玉阅读(435) 评论(0) 推荐(0) 编辑

React16废弃的生命周期和新的生命周期

摘要： 1. React16废弃的生命周期有3个will： componentWillMount componentWillReceiveProps componentWillUpdate 废弃的原因，是在React16的Fiber架构中，调和过程会多次执行will周期，不再是一次执行，失去了原有的意义。此阅读全文

posted @ 2020-05-15 14:43 全玉阅读(4971) 评论(0) 推荐(0) 编辑

正则表达式基本概念

摘要： 1. 分组 () 包裹的就是分组，可以得到结果，或者进行交换等整体操作 2. 捕获 () 分组默认就是捕获组，(?:) 加上?:，就是非捕获组，只参与匹配，整体结果中会存在，消耗字符，分组不会在结果中，节约性能 3. 环视 (?=) (?!) (?<=) (?<!) 有4种环视，分别可以正向和反向，阅读全文

posted @ 2020-05-15 11:50 全玉阅读(206) 评论(0) 推荐(0) 编辑

webpack异步加载文件的方式

摘要： 1. import import(/* webpackPrefetch: true,webpackChunkName: "yourFileName",webpackPreload: true */ 'LoginModal') import ( /* webpackChunkName: "yourFi 阅读全文

posted @ 2020-05-15 01:29 全玉阅读(1371) 评论(0) 推荐(0) 编辑

2020年5月14日

React.lazy懒加载组件

摘要： 1. React.lazy的用法 React.lazy方法可以异步加载组件文件。 const Foo = React.lazy(() => import('../componets/Foo)); React.lazy不能单独使用，需要配合React.suspense，suspence是用来包裹异步组阅读全文

posted @ 2020-05-14 21:27 全玉阅读(14330) 评论(0) 推荐(0) 编辑

前端性能分析方法

摘要： 1. 代码覆盖率 Coverage 打开chrome DevTools，ctrl + shift + p，输入coverage命令，回车，调出coverage面板进行录制，即可分析，加载或执行期间的，js被执行到情况，未被执行的js，就是可以优化的点，可以移除死代码，或懒加载非必要代码 2. CP 阅读全文

posted @ 2020-05-14 19:47 全玉阅读(660) 评论(0) 推荐(0) 编辑

vue.extend，mixins和vue.component的区别

摘要： 1. Vue.extend Vue.extend就是传入一下组件options，然后返回了一个Vue的子类，也可以看做是一个组件构造函数。真的是一个Vue的子类，源码中，使用原型集成和Copy属性和方法形式，将其继承自Vue。 const Sub = function VueComponent ( 阅读全文

posted @ 2020-05-14 19:45 全玉阅读(2140) 评论(0) 推荐(0) 编辑

前端性能优化10个方面

摘要： 1. 加载优化 1. 压缩合并2. 代码分割(code spliting)，可以基于路由或动态加载3. 第三方模块放在CDN4. 大模块异步加载，例如: Echarts，可以使用require.ensure，在加载成功后，在显示对应图表5. 小模块适度合并，将一些零散的小模块合并一起加载，速度较快6 阅读全文

posted @ 2020-05-14 19:04 全玉阅读(2110) 评论(0) 推荐(0) 编辑

全玉金生

公告