摘要：
VDOM VDOM，JavaScript对象，即对真实DOM的描述； 虚拟DOM创建页面性能：创建JavaScript对象的计算量 + 创建真实DOM的计算量；（第一步，创建JavaScript对象，即真实DOM的描述；第二步，递归地遍历虚拟DOM树并创建真实DOM；） 虚拟DOM更新更新页面过程： 阅读全文
摘要：
性能优化 1. 从输入URL到页面加载完成，发生了什么 2. webpack与Gzip 3. 图片优化 4. 浏览器缓存 5. 本地存储 6. CDN 7. 服务端渲染 8. 浏览器端的性能优化 9. DOM优化 10. 事件循环与异步更新策略 11. 回流与重绘 12. 优化首屏体验-懒加载 13 阅读全文
摘要：
Vue 1. 权衡的艺术 2. 框架设计的核心要素 3. vue.js3设计思路 1. 权衡的艺术 框架设计：在保持可维护性的同时让性能损失最小化； 命令式 VS 声明式 从范式上来看，视图层框架分为命令式和声明式。 命令式框架：关注过程，性能优； 声明式框架：关注结果，可维护性好 框架设计需要考虑 阅读全文
摘要：
1. 卸载npm本地依赖包node_modules 2. 安装pnpm: npm install -g pnpm 3. 创建配置文件，项目根目录下创建.npmrc文件 4. 转换相关文件：将package.json转成pnpm-lock.yaml文件，保证依赖版本不变：pnpm import 5. 阅读全文
摘要：
模块 允许代码分离，将其组织为可维护的单元，提升代码的可复用性和可读性； CommonJS（CJS）、ECMAScript Modules(ESM) CJS模块系统 导出模块 只需要使用module.exports或exports将模块中的内容导出即可 module.exports, // 指定属性 阅读全文
摘要：
npm （1）npm镜像源配置 npm默认的镜像地址是：https://registry.npmjs.org 淘宝开源的镜像站：https://registry.npmmirror.com/ 查看当前的镜像源：npm config get registry 设置为淘宝镜像源：npm config s 阅读全文
摘要：
冒泡排序： 比较相邻的元素，根据排序从小到大还是从大到小判断是否交换，一趟下来，有一个已排好序；如果遇到某一趟数据已经没有出现交换，说明已是有序数组，退出即可 function bubble(arr){ if(!(Array.isArray(arr))) { alert('数据类型有误，请传入数组' 阅读全文
摘要：
从0到0.8 vite 创建项目 eslint prettier EditorConfig 提交代码检测：husky && lint-staged proxy env-development 引入vuex@next 引入vue-router@next 引入axios 按需引入element-plus 阅读全文
摘要：
项目下下来直接跑，没问题，修改后报错跑不起来。原因是ESlint配置不匹配的问题，如项目中设置的是单引号配置，自动保存格式化后成了双引号 ，然后就报错了在，这时候可以选择修改vscode默认配置与项目一致，如setting.json文件中增加如下配置： { "vetur.format.default 阅读全文
摘要：
redux-thunk： 处理函数型action的中间件 asyAdd = () => { // 模拟下异步数据请求 store.dispatch((dispatch, getState) => { setTimeout(() => { console.log("getState", getStat 阅读全文
摘要：
Context API： React.createContext(defaultValue)：创建一个context对象。当React渲染订阅了这个Context对象的组件，这个组件会从组件树中离自身组件最近的那个匹配的Provider中读取到当前的context值。 Context.Provide 阅读全文
摘要：
描述：不同的请求接口，不同的code权限码，不能的type类型，相同的处理逻辑，后端配合几个接口数据返回格式名称一致 解决：采用配置项的形式，写一套逻辑代码，简化代码 getSelectData = () => { const selectDataArr = [ { service:aService 阅读全文
摘要：
v16之前生命周期： （1）initialization组件初始化阶段 constructor(){ super(props); this.state={} } super(props) 调用基类的构造方法，也将父组件的props注入给子组件，供子组件读取props，只读；state初始化 ，可修改 阅读全文
摘要：
antd4.x form使用实例： // AntdForm4.js class组件形式 import React, { Component, useEffect } from "react"; import { Form, Input, Button } from "antd"; const For 阅读全文
摘要：
react-router包含三个库：react-router、react-router-dom、react-router-native；react-router提供基本的路由功能，实际使用时不需要直接安装，根据运行环境选择react-router-dom（浏览器中）或react-router-nat 阅读全文
摘要：
react-redux： // index.js import React from "react"; import ReactDOM from "react-dom"; import "./index.css"; import App from "./App"; import { Provider 阅读全文
摘要：
Redux：JavaScript状态管理容易，保证行为一致性及易于测试可追踪。 Redux流程： 1. createStore 创建 store； 2. reducer 初始化、修改状态函数；reducer 是一个纯函数，接收旧的 state 和 action，返回新的 state； 3. getS 阅读全文
摘要：
创建项目： npx create-react-app demo cd demo npm start 引入antd： yarn add antd import React from "react"; import Button from "antd/es/button"; import "antd/d 阅读全文
摘要：
nodejs：一个异步的事件驱动的JavaScript运行时； nodejs特性：非阻塞I/O 事件驱动 运行node程序：node 文件名 或者 nodemon 文件名（该方式可监听文件改变） package.json：当创建一个nodejs项目意味着创建了一个模块，该模块的描述文件被称为pack 阅读全文
摘要：
1.vue (1)组件 每个组件单独分成文件，如A.vue文件实现A组件； 除index.vue之外文件名推荐大写开头如BaseHeader.vue或横线连接base-header.vue; 基础组件名可以共用相同的前缀，如BaseButton; 组件名应该倾向于完整单词而不是缩写； 组件名推荐多个 阅读全文