前言环境准备创建三个项目分别是： 其中 react 项目都是通过 create-react-app 创建的，vue 项目通过 vite 创建，另外项目还需要安装 qiankun。 搭建主应用子应用渲染入口首先需要给子应用在主应用中渲染的容器，我们在 App.js 中写一个容器 定义子应用的列表在 src 下新建一个 subApp.js name 子应用的名称，需要唯一 entry 子应用的入口

组件更新patchvue 在更新的时候，使用 patch 方法更新新老节点，判断老节点是否可以复用在 patch 时会先比较新老节点的类型，比较的方式就是判断 type 和 key 是否都相等，类型不同代表不能复用，直接卸载。然后判断新节点的类型， 在这里可以看到有三种类型的节点，使用不同的方法进行处理： 文本节点 Fragment 节点，vue3 引入 Fragment，在 vue3 的模板中可

创建一个 ref类组件的 ref函数当 ref 是一个函数时，入参就是当前的 DOM 节点，在函数内将它赋给别的值，就可以通过这个值进行访问。 字符串ref 可以绑定一个字符串，它会被保存到 this.refs 上。 另外当判断 ref 绑定的是字符串时，其实走的是函数的处理逻辑，只不过字符串都被绑定在了 this.refs 上。 createRef()通过 React 提供的 createRef

当依赖为引用数据类型时依赖是引用数据类型和基本类型对比 每次点击发现只会输出 useEffect - obj，也就是当 useEffect 依赖为对象时，每次更新都会执行。 依赖是如何进行比较的123456789101112131415function areHookInputsEqual( nextDeps: Array<mixed>, prevDeps: Array<mi

初始化项目12$ npm i -g @nestjs/cli$ nest new project-name 文件概览src/main.ts 入口文件123456789import {NestFactory} from '@nestjs/core';import {AppModule} from './app.modul

组件注册 Props v-model 透传Attributes 插槽 依赖注入 异步组件 自定义指令 插件 KeepAlive Teleport Suspense

响应式基础 计算属性 类和样式 条件渲染 列表渲染 事件处理 侦听器 模板引用 组件

从浏览器输入 URL 到页面呈现都发生了什么 输入 URL 查找缓存，有缓存读取缓存，没有进行下一步 DNS 域名解析，解析出域名对应的 IP 地址 和服务器建立 TCP 连接 发送 HTTP 请求 服务端响应请求，返回结果 断开 TCP 连接 浏览器渲染 缓存 首先查找浏览器缓存 然后查找操作系统缓存 查找路由器缓存 查找 ISP 缓存 http 缓存强缓存如果命中强缓存就无需向服务器发送请

前置性能分析工具这里使用 Webpack-bundle-analyzer 1pnpm add progress-bar-webpack-plugin -D 配置 12345678const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;module.exports =

初始化项目首先新建一个项目然后初始化。 12npm init -ypnpm add webpack webpack-cli -D 创建一个 src/main.js 文件，随便写点啥在根目录创建 build/webpack.common.js 文件 12345678910const path = require("path");module.exports