miraculous111-优快云博客

原创 Vue3倒计时组件：5步搞定面试题

本文介绍了使用Vue3实现倒计时组件的关键要点。核心思路包括：1)定义目标时间；2)获取当前时间；3)计算时间差；4)使用递归setTimeout实现精确计时；5)结束时触发事件。重点解决了计时精度问题，通过计算"离下一整秒的毫秒差"来减少误差，并确保生命周期管理和事件只触发一次。组件支持目标时间动态修改，会实时重置倒计时状态。代码展示了完整实现，包括时间格式化、事件触发和组件卸载时的清理逻辑。

2025-11-23 19:45:55 936

Redis是一个高性能的开源内存数据库，支持10种数据类型（5种基本类型和5种高级类型），具有极速读写、丰富数据类型、持久化、主从复制等特性。基本数据类型包括字符串、列表、集合、有序集合和哈希；高级类型涵盖消息队列、地理空间等特殊场景。Redis支持事务、持久化（RDB和AOF）、主从复制及哨兵模式的高可用方案，适用于缓存、消息队列等多种应用场景。通过命令如set/get操作数据，并能设置过期时间、发布订阅等，满足不同业务需求。

2025-11-23 18:46:40 994

原创什么是MVVM以及HTML小案例

本文通过一个原生JS实现的MVVM案例，展示了数据驱动视图的核心原理。案例使用30行代码构建了类似Vue的双向绑定功能：Model层存储数据状态，View层负责展示，View-Model层通过Proxy拦截数据变化和事件监听实现双向同步。当输入框内容改变时，自动更新下方div内容，整个过程无需手动操作DOM。该案例揭示了Vue等框架的底层思想，即通过分离关注点和自动化同步机制，实现数据与视图的高效联动。完整代码展示了如何使用纯原生API实现最小MVVM架构。

2025-11-22 18:39:59 1098

原创 langchain+ollama+Next.js实现AI对话聊天框

本文介绍了如何在本地部署ollama大模型，并搭建一个前后端交互的AI对话系统。主要内容包括：1) ollama作为本地大模型Docker的优势，推荐使用mistral模型；2) 本地部署ollama的4个简单步骤；3) 使用Node.js+Express搭建后端服务，封装与大模型通信的方法；4) 前端通过打字机效果展示AI回复。文章提供了完整的代码实现，包括后端接口封装、跨域处理、前端消息发送逻辑和打字机动画效果实现，适合想要快速搭建本地AI对话系统的开发者参考。

2025-11-22 18:31:40 1314

原创异步任务调度器的核心设计与实现

本文介绍了任务并发控制的核心概念与实现方法。通过并发调度器机制，可以在指定并发数上限（pool size）下高效执行异步任务。关键设计包括：1）FIFO等待队列；2）运行任务计数器；3）自动补位的调度循环；4）支持动态扩容。代码实现采用递归检查的方式，确保任何时候运行任务数不超过阈值，就像"异步红绿灯"一样实现高吞吐而不阻塞。该方案解决了Promise.all全并发和async/await串行执行的弊端，实现了可控并发的任务调度。

2025-11-16 20:06:26 292

原创 Golang学习第一天笔记总结

Go语言学习摘要 Go语言主要特性：部署简单（直接编译为机器码）静态类型检查原生并发支持强大标准库简单易学（25个关键字）基础语法要点：变量声明：四种方式（默认值/显式初始化/类型推断/短声明）常量使用const声明，支持iota枚举函数支持多返回值（匿名/具名） import导包的特殊用法（别名/匿名导入/直接导入） defer延迟执行机制（后进先出） slice动态数组（引用传递，自动扩容） map的三种声明方式（需make初始化）典型示例包含Hello World程序、变量/常量声

2025-11-16 19:51:08 965

原创手写发布订阅模式，轻松实现事件通信

发布订阅模式是一种消息通信设计模式，通过事件中心实现发布者和订阅者的完全解耦。发布者只管广播事件，订阅者只监听事件，两者互不关心。本文详细介绍了发布订阅模式的三大核心角色：发布者、订阅者和事件中心（EventBus），并通过JavaScript实现了一个完整的EventBus类，包含注册(on)、发布(emit)和取消订阅(off)三个核心功能。特别提醒在取消订阅时需要使用具名函数而非匿名函数。最后通过购物车系统示例演示了EventBus的实际应用，包括价格变化、库存变化等事件的订阅、发布和取消订阅操作。

2025-11-05 13:19:35 503

原创 Linux系统管理与常用命令详解

本文总结了Linux系统管理中的常用命令和知识点，主要包括：1）软件安装与管理（yum/apt命令）；2）服务控制（systemctl命令）；3）软链接创建（ln命令）；4）时间管理（date/ntp命令）；5）网络配置（IP地址、主机名、域名解析）；6）网络工具（ping/wget/curl）；7）进程管理（ps/kill）；8）系统状态监控（top/df/sar）；9）环境变量配置。文章以实用命令为主，适合Linux初学者快速掌握系统管理基础，涵盖了从软件安装到网络配置再到系统监控的常见操作场景。

2025-11-02 19:42:39 794

原创掌握Linux权限管理学习笔记

本文介绍了Linux系统中用户权限管理及常用命令。root用户作为超级管理员拥有最高权限，普通用户权限通常限制在HOME目录内。文章详细讲解了用户切换命令（su、exit）、临时root授权（sudo）、权限查看与修改（chmod、chown），包括rwx权限含义和数字表示法。此外还总结了实用的Linux快捷键：强制停止程序（ctrl+c）、退出登录（ctrl+d）、历史命令搜索（history、!前缀、ctrl+r）、光标移动（ctrl+a/e/左右键）和清屏操作（ctrl+l或clear命令）。这些内容

2025-11-02 16:39:39 727

原创 JS Bridge：打通Web与原生应用的神器

JS Bridge是一种连接JavaScript与原生代码的技术架构，使网页能调用移动设备原生功能。常见实现方式包括：注册全局API：直接在WebView注入JavaScript函数，适合同步调用但无法返回异步结果； URL Scheme：通过特定URL触发原生代码，支持异步调用但数据传递受限且安全性较低。两种方式各有利弊，需根据场景选择以实现网页与原生的无缝交互。

2025-11-01 21:45:54 358

原创 Linux入门笔记分享---基础命令

本文介绍了Linux系统的基础知识和常用命令。主要内容包括：Linux系统组成（内核和系统级应用程序）、虚拟机使用技巧、目录结构（树形结构）、路径表示方法，以及文件/目录操作命令（ls、cd、pwd、mkdir等）、文件内容操作命令（cat、more、grep等）、查找命令（which、find）等。文章还讲解了管道符、重定向、vi/vim编辑器等实用技巧，为Linux初学者提供了系统的入门指导。通过命令格式说明和实际示例，帮助读者快速掌握Linux基本操作。

2025-11-01 21:10:32 921

原创前端竞态问题是什么？怎么解决？

前端竞态问题及解决方案竞态问题指多个异步请求同时发出，由于响应顺序不确定导致最终状态与预期不符。常见于快速切换页面时的数据请求场景。本文通过Promise模拟网络请求，展示竞态问题的表现（如后发请求先返回覆盖前次结果）。解决方案：请求取消：使用AbortController取消前序未完成的请求，确保只处理最新请求。唯一ID标记：为每个请求分配ID，响应时只处理最新ID对应的结果。两种方法均能有效避免异步请求的竞态问题，核心思路是控制请求的生命周期或识别请求的有效性。实际开发中可根据场景选择Axio

2025-10-24 20:44:40 708

原创 XSS攻击防范：从入门到精通

本文介绍了XSS（跨站脚本）攻击的原理与防范措施。XSS攻击是通过向网页注入恶意脚本，在用户浏览器执行以窃取信息或破坏页面的攻击方式。文章通过一个评论区漏洞案例演示了攻击过程，展示了如何通过插入恶意代码控制页面显示。防范措施包括：1）HTML转义处理特殊字符；2）使用textContent代替innerHTML避免直接执行HTML；3）通过输入验证正则过滤不安全内容。这些方法能有效防止XSS攻击，保障网页安全。

2025-10-19 18:34:33 543

原创前端埋点与监控实战指南

本文介绍了前端埋点与监控的基本概念和应用。埋点用于收集用户行为数据，分为手动埋点、自动埋点和可视化埋点三类；监控则关注系统性能和稳定性，包括性能监控、错误监控和用户体验监控。通过实际案例演示了如何实现用户事件跟踪和性能指标监控，包括点击事件、滚动事件和API调用耗时监控。埋点与监控能帮助产品实现精细化运营和高质量交付，为优化决策提供数据支持。文中提供了完整的前端代码示例，展示了如何通过JavaScript实现基本的数据采集与上报功能。

2025-10-19 17:40:33 367

原创 iframe实战：跨域通信与安全隔离

这篇文章介绍了HTML中的iframe标签及其应用场景和通信方式。iframe是一种"页中页"标签，可在当前文档内嵌入独立浏览上下文，拥有完整的运行环境并与父页面隔离。常用场景包括第三方支付、微前端子应用、跨域上传组件等，既能实现安全沙箱又能按需加载。通信方式分为同源和跨域两种：同源时可直接访问对方的DOM和window对象；跨域时需使用postMessage API进行安全通信。文章还通过视频和代码演示了父子页面间的跨域数据通信实现，包括数据生成、发送和接收展示的全过程。核心代码展

2025-10-18 19:04:50 973

原创 LLM大语言模型初步学习认识

本文总结了李宏毅老师关于大语言模型（LLM）的学习笔记，重点介绍了语言模型训练、增强式学习、Prompt工程、思维链（CoT）、检索增强生成（RAG）、思维程序（PoT）、超参数设置、过拟合问题及可解释机器学习等内容。其中，Prompt工程强调优化输入提示以提升模型输出质量，CoT和PoT分别通过显式推理和代码生成改进模型逻辑能力，RAG则结合外部检索解决知识更新问题。文章还探讨了超参数的作用、过拟合的成因，以及增强模型可解释性的方法，为理解和应用大语言模型提供了实用指导。

2025-08-11 16:29:01 920

原创快速掌握Rollup：Rollup学习笔记

Rollup学习笔记摘要 Rollup是一款高效的JavaScript模块打包工具，通过静态分析和Tree-shaking技术剔除未使用代码，生成更轻量的库或应用。核心特性包括：安装与配置：支持全局安装，通过rollup.config.js定义入口/输出格式（如ES、CJS）。 Tree-shaking：基于ES模块的import/export静态分析，优化代码体积。

2025-08-11 16:18:48 921

原创双指针合并有序数组技巧

本文介绍了合并两个有序数组的解法。通过双指针遍历两个数组，将较小元素存入临时数组，处理剩余元素后，将结果拷贝回原数组。重点注意：不能直接赋值（nums1 = result），必须逐个元素拷贝以保证原数组被修改。方法包含三个关键步骤：双指针比较合并、处理剩余元素、结果回拷。作者通过实践总结了常见错误点，强调边界处理和数组拷贝的重要性，最终实现了高效的数组合并。

2025-07-31 15:17:54 359

原创 Django框架入门学习

Django框架学习摘要 Django是一款高效、安全的Python Web框架，支持快速开发和模块化设计。其核心特性包括简洁的URL映射机制（支持查询字符串和path传参）、模块化路由管理（支持include和reverse反转）、以及强大的模板系统（DTL语法、变量传递、继承与包含）。数据库操作提供原生SQL和ORM两种方式，ORM通过对象映射简化数据库交互。项目结构清晰，包含manage.py、settings.py等核心文件，同时支持静态文件管理和WSGI部署。Django的模板系统支持过滤器、标签

2025-07-31 15:11:01 973

原创 WebRTC通话原理与入门难度实战指南

WebRTC技术实现浏览器间实时音视频通信，无需插件。其核心流程包括：媒体协商：通过SDP协议交换支持的媒体格式；网络协商：利用STUN/TURN服务器获取公网IP，解决NAT穿透问题，并通过信令服务器交换网络信息（如candidate）。关键API：MediaStream获取设备媒体流，RTCPeerConnection建立点对点连接。实践部分演示了调用getUserMedia打开摄像头和麦克风的代码，通过约束条件控制设备参数，成功时绑定流到视频/音频标签。WebSocket用于建立信令通道，管

2025-06-07 23:08:19 1061

原创 Egg.js框架的基本介绍与用法，以及如何连接数据库并对数据库进行增删改查

本文介绍了Egg框架的项目结构、配置路由和页面、Controller控制器，GET、POST的请求以及参数接受，EJS模版的使用，cookie的增删改查，连接数据库以及对数据库的基本操作

2025-06-07 22:55:41 1309

原创 Webpack基本用法学习总结

Webpack 是一个强大的静态资源打包工具，能够将多个文件打包成一个或多个输出文件，便于在浏览器中运行。其核心概念包括入口（entry）、输出（output）、加载器（loader）、插件（plugins）和模式（mode）。Webpack 本身只能处理 JavaScript 和 JSON 文件，其他资源如样式、图片等需要通过加载器处理。

2025-05-09 23:46:11 1059