Zhencode-优快云博客

原创 JavaScript内存回收机制

摘要：本文介绍了JavaScript的内存回收机制，包括内存溢出的常见问题及自动垃圾回收机制的工作原理。JS采用分代回收策略，将内存分为新生代（频繁回收的小数据）和老生代（大数据）。新生代通过空间复制实现回收，老生代则采用标记清除与内存整理。虽然引擎自动管理内存，开发者仍需注意及时释放不再使用的数据（如定时器、闭包等），避免内存泄漏。了解垃圾回收机制对编写高性能代码具有重要意义。

2025-11-02 01:05:36 151

原创 vue之异步更新队列

Vue的异步更新队列通过将Watcher对象缓存并去重，在微任务阶段批量更新视图，优化性能。利用Promise微任务机制确保及时更新，同时避免重复操作。数据变更不会立即触发视图更新，需通过nextTick访问最新DOM。这种基于EventLoop的机制减少了DOM操作，在保证响应式的同时提升了渲染效率。

2025-10-27 18:46:40 292

原创 CSS变量的应用

CSS变量（Custom Properties）是以--开头的自定义属性，通过var()函数调用，具有继承性和局部作用域特性。在:root定义可实现全局使用，支持动态修改实现实时样式更新，常用于主题切换等场景。其优势在于提升代码可维护性，但需注意浏览器兼容性问题（不支持IE）。结合JavaScript可动态控制变量值，为前端开发提供更灵活的样式管理方案。

2025-10-09 00:10:36 351

原创 win10本地部署和运行Ollama加载大模型

这篇博客详细介绍了如何在本地部署和运行开源工具 **Ollama**，以便在个人设备上轻松使用大型语言模型（LLM）。文章首先阐述了 Ollama 的优势，如操作简单、跨平台支持、丰富的模型库和硬件加速能力。接着，介绍了在Windows 系统上的安装方法，并演示了如何通过 `ollama run deepseek` 等命令下载模型并进行交互对话。

2025-09-18 18:09:58 1048

本文分享了基于qiankun的微前端实践方案，通过React主应用集成Vue/React子应用，实现多技术栈协同开发。主应用负责整体布局和子应用管理，使用qiankun的registerMicroApps注册子应用，并通过全局状态管理实现主-子应用通信。子应用需导出bootstrap、mount、unmount生命周期函数，并配置webpack为UMD格式输出。该架构支持独立开发和部署，同时保持用户体验一致性，有效解决了大型前端应用的模块化拆分与整合问题。

2025-09-10 10:12:36 921

原创 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 445

原创前端模块化加载器：SystemJS

SystemJS是一个动态通用模块加载器，最初作为ES6模块加载器的垫片出现，现已发展为支持AMD、CommonJS、ES6等多种模块格式的运行时加载系统。它的核心功能包括模块格式兼容、动态加载、运行时配置和插件扩展，特别适合微前端架构和遗留系统迁移。虽然现代构建工具和浏览器原生ESM支持减少了其必要性，SystemJS在实现代码分割、动态加载等特定场景中仍有独特优势，如灵活处理混合技术栈、按需加载模块等。不过其运行时解析带来的性能开销和配置复杂性也限制了在现代项目中的广泛应用。

2025-08-12 10:08:45 724 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 318

原创 Scrcpy用电脑无线控制手机

摘要： Scrcpy是一款免费开源的安卓投屏控制工具，支持通过ADB协议将手机屏幕实时投射到电脑，并可用键鼠直接操作。其优势包括高清画质、低延迟、无线连接、跨平台支持等。使用步骤：1)下载Scrcpy并安装ADB工具；2)手机开启USB调试并首次通过USB线连接；3)启用ADB无线模式后获取手机IP；4)无线连接后即可脱离数据线使用。提供比特率调整、分辨率限制、录屏等优化命令，适用于日常办公或应用测试场景。（149字）

2023-09-25 11:31:06 853

原创 vue实现h5自定义文件上传功能组件

本文介绍了一个基于Vue实现的文件上传组件。该组件支持单文件上传、类型和大小限制、上传后文件显示与删除功能。核心代码包括模板结构、JS逻辑和样式定义，通过隐藏的input元素实现文件选择，使用FormData进行上传。组件还提供了扩展思路，如支持多文件上传、文件预览和按钮样式自定义。该实现简洁有效，可作为基础组件进一步优化扩展。

2022-06-06 11:42:06 862

原创 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 721

原创 umi报文件名、目录名或卷标语法不正确

window下运行umi或create-umi命令报文件名、目录名或卷标语法不正确umi或create-umi在使用yarn或npm安装时被定义为全局安装，而安装完成后由于其它原因例如包管理器缓存或全局模块被重新设置为其它路径而导致命令运行失效。解决:查找到umi.cmd命令使用编辑器打开，删除除开头%"后直到盘符保存即可...

2021-08-29 00:51:50 843

原创移动端实现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 245

原创 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 206

原创 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 146

Zhencode的博客