vuex和pinia
Vuex 作为 Vue.js 的状态管理库，其核心思想是“单向数据流”和“状态变更必须是可追踪的”。为了实现这一点，Vuex 使用了严格的分离： mutation: 用途：负责同步修改 state（状态）。所有对 state 的修改必须通过 mutation 来进行，确保状态变化的可追踪性。 原则：由于它是同步的，所有的状态变化都会立刻反映到应用的视图上。 设计：你不能在 mutation 中做
pinia不共享状态(闭包思想)
问题背景面试时，面试官问了我一个感觉比较有意思的问题，抽空来记录下。 具体问题Pinia 是 Vue 的专属状态管理库，它允许你跨组件或页面共享状态。那如果想使用pinia实现单独的状态应该怎么做。 分析问题这道题和vue中data的用法很像，因为data可以使用方法形式定义也可以使用对象形式，可以先分析下vue的data定义再来解决这个问题先模仿组件构造函数，定义 data属性，采用对象的形式
vue2和vue3key的作用
在 Vue 2 和 Vue 3 中，key 的作用是确保 Vue 在渲染和更新时能够高效地进行组件或 DOM 元素的复用、重排和渲染优化。尽管 Vue 2 和 Vue 3 在很多方面有相似之处，key 的基本作用一致，但两者在底层的实现和优化上存在一些区别。 1. key 的作用（Vue 2 和 Vue 3）主要作用： 标识唯一性： key 用来标识每个组件或 DOM 元素的唯一性，确保 Vue
vue2和vue3Diff算法
基本原理Vue2 双端比较：使用双端（头尾）比较的方法，设置指针分别指向新旧节点列表的开始和结束，依次比较节点，寻找可复用的节点。 暴力更新：当新旧节点不匹配时，Vue2 可能会进行全量更新，即使是小的变化也可能导致整个子树的重新渲染。 Vue3 优化的快速 diff 算法：引入了更高效的 diff 算法，通过创建一个映射表来记录新旧节点的位置，并利用最长递增子序列（LIS）算法来优化节点的移动
性能优化
前端优化大概可以有以下几个方向： 网络优化 页面渲染优化 JS优化 图片优化 webpack打包优化 Vue和React优化 数据埋点及性能监控 网络优化DNS预解析link标签的rel属性设置dns-prefetch，提前获取域名对应的IP地址 使用缓存减轻服务端压力，快速得到数据(强缓存和协商缓存)(juejin.cn/post/717878…)) 使用 CDN（内容分
手写promise
手写一个简单的 Promise 实现可以帮助理解 Promise 的基本原理。以下是一个基本的 Promise 实现，包括 resolve、reject 和 then 方法。 1. Promise 实现123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
防抖和节流
防抖（Debounce）和节流（Throttle）是两种常用的性能优化技术，主要用于控制函数执行的频率，尤其是在处理高频事件时（如滚动、输入等）。 防抖（Debounce）定义：防抖是一种确保某个函数在一定时间内只被执行一次的策略。它通常用于处理用户输入事件，避免在输入过程中频繁触发函数。 实现原理： 当事件被触发时，设置一个定时器。 如果在定时器到期前再次触发事件，则清除之前的定时器，并重新设
箭头函数和普通函数对比
箭头函数相对于普通函数（函数声明和函数表达式）的性能在大多数情况下是相似的，主要的区别在于它们的语法和行为特性，而不是性能。以下是一些关键点： 1. 语法简洁 箭头函数语法更简洁，特别是在函数体只有一条语句时，不需要使用大括号和 return。 示例：1234567// 普通函数const sum = function(a, b) { return a + b;};// 箭头