热门 React 性能优化之组件动态加载(react-loadable)

时间:2021-11-15   作者:lininn   分类:   热度:1034°    
时间:2021-11-15   分类:    热度:1034  
React 项目打包时,如果不进行异步组件的处理,那么所有页面所需要的 js 都在同一文件中(bundle.js),整个js文件很大,从而导致首屏加载时间过长。 所有,可以对组件进行异步加载处理,通常可以使用 React-loadable。 React-loadable 使用 例如,对于项目中的detail组件(/src/pages/detail/),在 detail 目录下新建 loadable.js: import React from 'react'; import Loadable from 'react-loadable'; const LoadableC...

阅读全文>>

热门 ES6 Class 继承与 super

时间:2021-11-1   作者:lininn   分类:   热度:978°    
时间:2021-11-1   分类:    热度:978  
class 可以 extends 自另一个 class。这是一个不错的语法,技术上基于原型继承。 要继承一个对象,需要在 {..} 前指定 extends 和父对象。 这个 Rabbit 继承自 Animal: class Animal { constructor(name) { this.speed = 0 this.name = name } run(speed) { this.speed += speed alert(`${this.name} runs with speed ${th...

阅读全文>>

热门 Object.defineProperty 和ES6 的 Proxy

时间:2021-10-26   作者:lininn   分类:   热度:1052°    
时间:2021-10-26   分类:    热度:1052  
监听一个变量的变化,当变量变化时执行某些操作,这类似现在流行的前端框架(例如 React、Vue等)中的数据绑定功能,在数据更新时自动更新 DOM 渲染,那么如何实现数据绑定喃? 本文给出两种思路: ES5 的 Object.defineProperty ES6 的 Proxy ES5 的 Object.defineProperty Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性,并返回此对象 ——MDN ...

阅读全文>>

热门 pm2如何实现的多进程

时间:2021-10-26   作者:lininn   分类:   热度:1131°    
时间:2021-10-26   分类:    热度:1131  
Node.js的Cluster多进程模式。 PM2的实现原理,它是基于Cluster模式的封装。   Node.js,都是以单线程的方式运行的,因此,在多核心处理器的系统中并不能发挥其最大的性能。 Node.js的cluster模块 幸运的是,Node.js给我们提供了cluster模块,它可以生成多个工作线程来共享同一个TCP连接。 它是如何运作的呢? 首先,Cluster会创建一个master,然后根据你指定的数量复制出多个server app(也被称之为工作线程)。它通过IPC通道与工作线程之间...

阅读全文>>

热门 Redux异步解决方案Redux-Thunk

时间:2021-10-26   作者:lininn   分类:   热度:1032°    
时间:2021-10-26   分类:    热度:1032  
function createThunkMiddleware(extraArgument) { return function thunk(store) { return function (next) { return function (action) { // 从store中结构出dispatch, getState const { dispatch, getState } = store; // 如果action是函数,将它拿出来运行,参数就是dispatch和getState i...

阅读全文>>

热门 Redux的reducer为什么不能有异步操作

时间:2021-10-26   作者:lininn   分类:   热度:1084°    
时间:2021-10-26   分类:    热度:1084  
回顾Redux设计和使用的三大基本原则 单一数据源,也就是store中的state是唯一的 state 是只读,Redux并没有暴露出直接修改state的接口,必须通过action来触发修改(即:只有store能改变自己的state) reducer必须是纯函数 Redux的设计初衷 先从Redux的设计层面来解释为什么Reducer必须是纯函数。 Redux的设计参考了Flux的模式,作者希望以此来实现时间旅行,保存应用的历史状态,实现应用状态的可预测。所以整个Redux都是函数式编程的...

阅读全文>>

热门 vue data不可以使用箭头函数的问题解析

时间:2021-10-20   作者:lininn   分类:   热度:1042°    
时间:2021-10-20   分类:    热度:1042  
这篇文章主要介绍了vue data不可以使用箭头函数问题,本文通过源码解析给大家介绍的非常详细,具有一定的参考借鉴价值,需要的朋友可以参考下 首先需要明确,a() {}和 b: () => {}是不同的 let obj = { a() {}, // 相当于 a:function() {}, b: () => {} } 1 VUE.js 源码解析 注意此处只设计核心代码 这段代码也是UMD实现原理,本文这里不是重点,有兴趣的可以自行探究。 (function (global, factory) { typeof exp...

阅读全文>>

返回顶部    首页    手机版本    后花园   会员注册   
版权所有:覆手为雨    站长: lininn