前端百草阁-CSDN博客

原创【物联网控制体系项目实战】—— 整体架构流程与 WS 实现

这是一份面向“产品、研发、测试、运维”的通用 IoT 控制架构说明，旨在帮助非实时音视频/物联网背景的同学也能快速理解“扫码绑定 → 任务控制 → 实时数据展示”的端到端路径。文中所有域名、路径、字段均为通用化示例，落地请以实际环境为准。WS：用于“事件驱动”，例如任务状态更新、配置变更、失败通知；延迟低、无需轮询。HTTP：用于“权威读取/指令下发”，例如任务创建/结束、刷新任务列表；具备幂等、鉴权、审计优势。组合优势：WS 触发 + HTTP 拉取权威数据，既实时又可控，便于审计与回放。

2025-10-23 21:35:51 1106

原创 Vue3 大文件上传实战：切片上传 / 断点续传 / 秒传 / 暂停恢复 / 全局并发控制

切片上传断点续传秒传（存在即返回）暂停 / 恢复全局并发控制与实时进度本文采用全局并发限流器作为上传调度核心，让多个文件、多个切片在总并发可控的前提下高效上传。统一、清晰的命名有助于维护与协作。/*** 文件上传状态枚举* - idle: 初始状态，未开始上传* - uploading: 上传中* - paused: 已暂停* - completed: 上传完成* - failed: 上传失败*//*** 分片上传状态枚举* - idle: 初始状态，未开始上传。

2025-10-21 21:26:57 886

原创 Vue 3 响应式原理详细解读【一】—— Proxy 如何突破 defineProperty 的局限

Vue 3 使用 Proxy + Reflect 重构响应式系统，解决了 Vue 2 基于 Object.defineProperty 的三个核心痛点：1) 动态属性增删问题，Proxy 自动拦截对象所有操作；2) 数组支持不足，原生拦截 push/pop 等方法；3) 性能瓶颈，采用惰性代理避免初始化递归。

2025-07-21 17:07:27 1247 7

原创【TypeScript】8个你必须要掌握的TypeScript工具类型技巧

本文深入解析了TypeScript中的8种核心工具类型，分为结构操作类型（Partial、Required、Readonly、Pick、Omit）和联合操作类型（Exclude、Extract、NonNullable）。

2025-07-09 11:17:19 1024

原创 Vue项目PDF目录功能集成【一】——方案深度思考

最终选择方案三的核心逻辑风险对冲将最容易出错的解析逻辑交给PDF.js维护，同时通过样式覆盖保留UI控制权，实现"核心稳定+外观可控"的平衡。演进可能性保留逐步替换的可能性：初期使用官方解析器，后期可针对高频文档类型开发优化版解析器，形成混合架构。虽然初期只实现目录，但后期增加缩略图也可以依赖于pdfjs demo 提供的能力。如果核心需求只是展示目录树 UI（不需要交互跳转功能），那么方案一和方案二更简单。

2025-06-08 19:58:01 1072

原创从npm库中的 Vue 组件到独立SDK：打包与 UMD 引入的最佳实践

本文介绍了文件预览组件从直接发布npm源码到打包为独立SDK的改造方案。

2025-06-04 21:20:26 1272

原创前端开发知识体系全景指南

从知识清单中找到自己的`知识盲点与欠缺、具有知识体系化的思想，开始建立自己的知识体系阅读文章时将知识归类到知识体系中，并不断完善自己的知识体系，从文章中获取到了有用的资源

2025-06-02 17:29:10 1360 1

原创 React状态管理神器——Jotai使用教程

Jotai是一个轻量级React状态管理库，基于原子化设计理念，将应用状态分解为独立单元。

2025-06-02 16:37:20 1079

原创 JavaScript 模块系统：CJS/AMD/UMD/ESM

本文深入解析了JavaScript四种模块系统(CJS/AMD/UMD/ESM)的设计原理与应用场景。

2025-06-01 16:57:36 838

原创 ERROR in node:path Module build failed: UnhandledSchemeError: Reading from “node:path“ is not handle

因引入sharp库导致Webpack无法处理"node:"协议的核心模块引用（如node:path），报错UnhandledSchemeError。

2025-05-27 15:39:34 792

原创【前端设计模式讲解】工厂模式

本文探讨了工厂模式在前端开发中的应用价值及实现方式。设计模式是提升工程化思维的关键，能帮助开发者跳出重复业务代码的陷阱。文章以多支付系统为例，详细展示了工厂模式的实现。

2025-05-25 17:47:07 1118

原创【TS简单上手，快速入门教程】————适合零基础

Vue 3 源码使用 TS 重写、Angular 默认支持 TS、React 与 TS 完美配合，TypeScript 已成为大中型前端项目的首选编程语言

2024-07-29 09:12:45 7384 1

原创 JS三座大山 —— 原型和原型链

利用流程图带你全方面理解原型和原型链！构造函数通过prototype属性指向原型对象，原型对象包含了共享的属性和方法，而对象实例通过原型链（__proto__属性指向原型对象）继承了原型对象的属性和方法。通过属性，我们可以追溯到对象实例的构造函数。这些概念共同构成了 JavaScript 中的原型继承机制。

2023-08-31 10:57:38 2480 44

原创【百草阁送书-第二期】一名阿里服务端开发工程师的进阶之路

目前，资讯、社交、游戏、消费、出行等丰富多彩的互联网应用已经渗透到了人们生活和工作的方方面面，正深刻改变着信息时代。随着用户规模的增长和应用复杂度的上升，服务端面临的技术挑战越来越严峻。在头部互联网企业，服务端开发岗位的职责早已不再局限于简单地围绕数据库编排“增删改查”服务，而要求工程师具备业务分析、架构设计、代码编写、技术攻关、团队协作、系统维护等综合能力。很多时候，服务端的第一行代码尚未写就，工程师便不得不与产品、运营、法务等人员和网络、中间件、操作系统、数据、算法、运维、安全等技术体系打交道。

2023-08-28 20:36:34 2907 60

原创 2023前端面试高频考点 —— CSS3

欢迎阅读本篇前端面试笔记的CSS3篇！CSS3是前端开发中非常重要的一部分，它为我们提供了丰富的`样式和动画效果`，使得网页更加美观和交互性更强。在前端面试中，对CSS3的掌握程度往往是评判候选人技术水平的重要指标之一。本篇笔记将围绕CSS3的常见问题和知识点展开，帮助您更好地准备和应对前端面试。

2023-08-24 00:22:39 4044

原创 2023前端面试高频考点 —— HTML5

HTML5作为最新的HTML标准，为前端开发带来了许多新的特性和功能。在前端面试中，HTML5的知识和应用已经成为了必备的技能。本篇文章将总结HTML5的重要知识点和常见面试题，帮助读者更好地准备前端面试，提升自己的竞争力。

2023-08-20 13:37:00 3970 3

原创如何从零开始配置前端环境以及安装必备的软件插件

本文讲解了 VSCode、Node.js、yarn、Webpack、vueCLI、git、等必备软件安装、以及VSCode 常用插件、VSCode代码格式化、VUE开发者工具安装

2023-08-05 15:26:39 18849 75

原创从Vue2到Vue3【七】——Vue2中响应式原理的实现及其缺陷

本文将探讨Vue 2响应式原理及其存在的缺陷与解决办法。Vue 2的响应式数据机制在大多数情况下能够满足我们的需求，但也存在一些缺陷。首先，Vue无法直接响应新增的属性，需要使用特定的方法进行补救。其次，对于数组的变动和对象属性的删除，Vue也无法直接进行响应式处理，需要使用相应的方法来触发更新。这些缺陷在实际开发中可能会带来一些困扰。

2023-07-30 20:10:12 7465 134

原创从Vue2到Vue3【六】——Vue3的改变（文末送书）

随着Vue 3的发布，我们迎来了一套强大且令人兴奋的组合式API，这为开发者带来了更多灵活性和可维护性。本文讲解了全局api、data、过渡类名、keyCode、native、 filter

2023-07-27 21:16:29 4960 274

原创从Vue2到Vue3【五】——新的组件（Fragment、Teleport、Suspense）

本文详细讲解了vue3中新增的三个组件(Fragment、Teleport、Suspense)，这些新增的组件为Vue 3带来了更多的灵活性和便利性。它们使得组件化开发更加简单且功能更丰富，为开发者提供更多的选择和工具来构建高效、可维护的应用程序。

2023-07-25 23:29:44 5610 156

原创从Vue2到Vue3【四】——Composition API（第四章）

随着Vue 3的发布，我们迎来了一套强大且令人兴奋的组合式API，这为开发者带来了更多灵活性和可维护性。本篇文章细致详细讲解了customRef、provide 与 inject、响应式数据的判断、Composition API 与 Options API的对比，干货满满！

2023-07-22 16:50:00 6050 216

原创从Vue2到Vue3【三】——Composition API（第三章）

随着Vue 3的发布，我们迎来了一套强大且令人兴奋的组合式API，这为开发者带来了更多灵活性和可维护性。本文讲解了vue3组合式API中的 shallowReactive 与 shallowRef、readonly 与 shallowReadonly、toRaw 与 markRaw的用法以及注意事项，欢迎大家订阅本系列文章，干货满满！

2023-07-20 11:10:05 4284 136