- 博客(25)
- 收藏
- 关注
RSS订阅原创 langchain-chroma调用时出现kernel crashed
摘要：本文记录了使用Jupyter调用langchain-chroma进行文档向量存储时遇到的Kernel崩溃问题。通过排查发现是由于缺少Visual C++ Redistributable依赖导致onnxruntime无法运行，安装对应组件后问题解决。文章详细描述了问题现象、排查过程（包括检查文件生成、测试不同参数配置）以及最终解决方案，并提供了官方参考文档链接。该案例说明当编译器直接崩溃时，应优先检查系统级依赖是否完整，而非单纯怀疑代码或环境配置问题。
2026-03-29 10:53:00
321
原创 Vue3虚拟DOM创建器之h函数
在 Vue 3 的响应式系统中，h 函数（hyperscript）是连接逻辑与视图的关键桥梁。它用于创建 VNode（虚拟 DOM 节点），是编写 render 函数时最常用的工具之一
2026-03-10 16:29:56
205
原创 Vue核心运行时runtime-core之组件挂载流程
本文梳理了Vue3组件挂载的核心流程：从createApp调用render(vnode, container)开始，经过patch判断组件类型后执行mountComponent。重点介绍了组件实例的创建过程，包括setupStatefulComponent处理状态组件、执行setup函数并处理返回值，以及通过finishComponentSetup最终确定render函数来源（setup返回函数或模板编译）。整个过程展示了Vue3组件从初始化到可渲染的完整链路，为理解后续响应式更新机制奠定了基础。文章采用代
2026-02-24 15:56:37
203
原创 Vue3核心运行时之runtime-core
本文分析了Vue3运行时核心@vue/runtime-core的实现机制。主要内容包括：1) runtime-core作为平台无关的VNode调度器和组件生命周期管理器的作用；2) 从createApp到render的初始化流程，包括创建渲染器、应用实例和首次渲染；3) patch函数实现虚拟DOM的挂载和更新；4) 元素节点和组件的处理过程；5) 组件自动更新的简化实现，通过setupRenderEffect建立响应式更新机制。runtime-core通过调用runtime-dom提供的接口操作DOM，管
2026-02-17 17:36:42
401
原创 vue3运行时核心模块之runtime-dom
摘要： runtime-dom是Vue 3的核心运行时包，作为Vue的DOM操作适配层，提供浏览器环境下的DOM节点操作、事件绑定、属性更新等具体实现。它使Vue保持平台无关性，可适配浏览器、SSR、Native等不同环境。核心功能包括：1）nodeOps对象封装基础DOM操作方法（插入/移除节点、创建元素/文本节点等）；2）patchProp处理属性更新，包含class/style/事件等特殊逻辑。通过平台相关实现与核心逻辑解耦，runtime-dom确保Vue在不同环境下高效运行。（149字）
2026-02-15 12:33:02
445
原创 深入Vue3响应式核心：computed 的实现原理与应用
本文深入解析了Vue3中computed属性的实现原理。通过简化源码分析，揭示了computed如何通过"依赖收集→脏标记→触发更新"的机制实现响应式更新。重点剖析了computed的缓存机制(_dirty标志)和惰性求值特性，对比了计算属性与普通方法的区别。文章指出computed体现了Vue响应式系统的三大核心：精准依赖追踪、惰性与缓存、分层解耦，是响应式编程思想的完美实践。通过实例代码演示了computed的两种使用方式及其内部运作流程。
2026-02-14 12:01:32
950
原创 Vue3响应式原理之ref篇
本文深入剖析Vue3中ref与reactive的核心区别及使用场景。ref适用于基本类型和对象，通过.value访问；reactive仅用于对象/数组，直接属性访问。ref对象会自动转为reactive，而reactive性能略优。文章通过源码分析RefImpl类实现机制，对比两者在模板解包、嵌套响应式等差异，并给出推荐使用场景：基本类型用ref，复杂对象用reactive。同时指出常见误区，如effect内创建ref会丢失响应式。掌握两者差异有助于编写高效可维护的Vue3应用。
2026-02-12 09:19:00
402
原创 Vue3 响应式依赖收集与更新之effect
本文深入解析了Vue3响应式系统中effect的实现原理，重点介绍了依赖收集(track)和触发更新(trigger)的机制。通过ReactiveEffect类封装effect函数，利用Proxy代理实现响应式数据追踪，当访问响应式属性时自动收集依赖，数据变更时触发对应effect重新执行。文章详细剖析了createGetter/setter、track/trigger等核心函数的实现逻辑，并通过具体案例演示了响应式更新的完整流程。这种基于Proxy的响应式系统相比Vue2的Object.definePro
2026-02-08 20:23:00
403
原创 Vue3 响应式之reactive：深入理解 Proxy代理
Vue3 使用 Proxy 实现响应式系统时，通过懒递归代理优化嵌套对象的处理。相比 Vue2 的递归代理方案，Vue3 只在属性被访问时才将其转为响应式，避免了初始化时深度遍历的性能损耗。核心实现包括：1) 使用 WeakMap 缓存已代理对象防止重复代理；2) 在 get 拦截器中对返回的对象值再次调用 reactive；3) 仅当属性被访问时才进行代理转换。这种方案显著提升了性能，特别是处理大型嵌套对象时，同时通过 WeakMap 自动管理内存，防止内存泄漏。
2026-02-07 00:40:26
312
原创 TypeScript工具类型之omit
TypeScript 的 Omit 工具类型用于从对象类型中剔除指定属性。其核心实现基于 Pick 和 Exclude：先通过 Exclude 过滤掉目标键，再用 Pick 保留剩余属性。例如 Omit<User, 'password'> 会移除敏感字段。Omit 还可通过映射类型自定义实现，如 MyOmit<T,K>。理解 Omit 的工作原理有助于开发者更灵活地进行类型操作，并构建更复杂的工具类型。该类型在隐藏敏感数据、创建部分类型等场景中非常实用。
2026-01-23 00:24:19
31
原创 JavaScript内存回收机制
摘要：本文介绍了JavaScript的内存回收机制，包括内存溢出的常见问题及自动垃圾回收机制的工作原理。JS采用分代回收策略，将内存分为新生代（频繁回收的小数据）和老生代（大数据）。新生代通过空间复制实现回收，老生代则采用标记清除与内存整理。虽然引擎自动管理内存，开发者仍需注意及时释放不再使用的数据（如定时器、闭包等），避免内存泄漏。了解垃圾回收机制对编写高性能代码具有重要意义。
2025-11-02 01:05:36
175
原创 vue之异步更新队列
Vue的异步更新队列通过将Watcher对象缓存并去重，在微任务阶段批量更新视图，优化性能。利用Promise微任务机制确保及时更新，同时避免重复操作。数据变更不会立即触发视图更新，需通过nextTick访问最新DOM。这种基于EventLoop的机制减少了DOM操作，在保证响应式的同时提升了渲染效率。
2025-10-27 18:46:40
324
原创 CSS变量的应用
CSS变量（Custom Properties）是以--开头的自定义属性，通过var()函数调用，具有继承性和局部作用域特性。在:root定义可实现全局使用，支持动态修改实现实时样式更新，常用于主题切换等场景。其优势在于提升代码可维护性，但需注意浏览器兼容性问题（不支持IE）。结合JavaScript可动态控制变量值，为前端开发提供更灵活的样式管理方案。
2025-10-09 00:10:36
378
原创 win10本地部署和运行Ollama加载大模型
这篇博客详细介绍了如何在本地部署和运行开源工具 **Ollama**，以便在个人设备上轻松使用大型语言模型（LLM）。文章首先阐述了 Ollama 的优势，如操作简单、跨平台支持、丰富的模型库和硬件加速能力。接着，介绍了在Windows 系统上的安装方法，并演示了如何通过 `ollama run deepseek` 等命令下载模型并进行交互对话。
2025-09-18 18:09:58
1928
原创 基于qiankun的微前端架构实践
本文分享了基于qiankun的微前端实践方案，通过React主应用集成Vue/React子应用，实现多技术栈协同开发。主应用负责整体布局和子应用管理，使用qiankun的registerMicroApps注册子应用，并通过全局状态管理实现主-子应用通信。子应用需导出bootstrap、mount、unmount生命周期函数，并配置webpack为UMD格式输出。该架构支持独立开发和部署，同时保持用户体验一致性，有效解决了大型前端应用的模块化拆分与整合问题。
2025-09-10 10:12:36
1899
原创 JavaScript中的Map与Object详解
摘要： JavaScript中的Map和Object均可存储键值对，但存在关键差异： 键类型：Object仅支持字符串/Symbol键，Map支持任意类型（包括对象）。 性能：Map在频繁增删时更高效，Object适合静态数据。 功能：Map直接提供.size和顺序迭代，Object需手动处理。 场景选择： Object：简单配置、JSON序列化、点语法访问。 Map：动态键、复杂键类型、高频操作或需顺序遍历。 示例：Map适合缓存机制，Object适合结构化用户数据。根据需求灵活选择可优化代码性能与可维护
2025-09-09 10:03:23
496
原创 前端模块化加载器：SystemJS
SystemJS是一个动态通用模块加载器，最初作为ES6模块加载器的垫片出现，现已发展为支持AMD、CommonJS、ES6等多种模块格式的运行时加载系统。它的核心功能包括模块格式兼容、动态加载、运行时配置和插件扩展，特别适合微前端架构和遗留系统迁移。虽然现代构建工具和浏览器原生ESM支持减少了其必要性，SystemJS在实现代码分割、动态加载等特定场景中仍有独特优势，如灵活处理混合技术栈、按需加载模块等。不过其运行时解析带来的性能开销和配置复杂性也限制了在现代项目中的广泛应用。
2025-08-12 10:08:45
842
2
原创 Vue3 Diff 算法片段解析：新旧节点队列之乱序比对与更新策略
Vue 3 的 Diff 算法通过双端比较和映射优化提升了虚拟 DOM 更新效率。文章通过 [c d e] 变为 [e c d h] 的示例，演示了算法核心步骤：1) 建立新节点 key 映射表；2) 标记新旧节点对应关系；3) 倒序处理节点移动和新增。关键优化包括双指针缩小比对范围、Map 加速查找、倒序处理确保稳定性，以及精确区分节点操作类型。该算法有效减少了不必要的 DOM 操作，显著提升了渲染性能。
2025-07-13 18:11:10
352
原创 Scrcpy用电脑无线控制手机
摘要： Scrcpy是一款免费开源的安卓投屏控制工具，支持通过ADB协议将手机屏幕实时投射到电脑，并可用键鼠直接操作。其优势包括高清画质、低延迟、无线连接、跨平台支持等。使用步骤：1)下载Scrcpy并安装ADB工具；2)手机开启USB调试并首次通过USB线连接；3)启用ADB无线模式后获取手机IP；4)无线连接后即可脱离数据线使用。提供比特率调整、分辨率限制、录屏等优化命令，适用于日常办公或应用测试场景。（149字）
2023-09-25 11:31:06
1528
原创 vue实现h5自定义文件上传功能组件
本文介绍了一个基于Vue实现的文件上传组件。该组件支持单文件上传、类型和大小限制、上传后文件显示与删除功能。核心代码包括模板结构、JS逻辑和样式定义，通过隐藏的input元素实现文件选择，使用FormData进行上传。组件还提供了扩展思路，如支持多文件上传、文件预览和按钮样式自定义。该实现简洁有效，可作为基础组件进一步优化扩展。
2022-06-06 11:42:06
929
原创 HttpServer使用
const fs = require('fs')const http = require('http')const zlib = require('zlib') // 压缩const createReadStream = fs.createReadStream('./test.html') // 读取文件流// 充当客户端向远程地址发起请求http.get('http://nodejs.cn/api/http.html', (res)=>{ console.log(res.statu
2021-12-05 09:32:33
737
原创 umi报文件名、目录名或卷标语法不正确
window下运行umi或create-umi命令报文件名、目录名或卷标语法不正确umi或create-umi在使用yarn或npm安装时被定义为全局安装，而安装完成后由于其它原因例如包管理器缓存或全局模块被重新设置为其它路径而导致命令运行失效。解决:查找到umi.cmd命令使用编辑器打开，删除除开头%"后直到盘符保存即可...
2021-08-29 00:51:50
877
原创 移动端实现1px像素边框
<div class="box"></div> .box{ width: 100px; height: 100px; position: relative; } .box::after{ position: absolute; left: -50%; top: -50%; wi..
2021-07-19 10:58:46
264
原创 vue图片上传
<template> <div class="uploadBlock"> <template v-for="(item,index) in img" v-show="img.length>0"> <div class="uploadImage"> <img :src="item.img" alt="...
2020-04-02 17:49:42
213
原创 js设置cookie
var user=' user'function setCookie(name,value,day){ var oDate=new Date() oDate.setDate(oDate.getDate()+day) document.cookie=name+"="+value+";expires="+oDate }function getCookie(name){ var a...
2019-11-13 17:41:50
167
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人