摘要： 策略模式（Strategy Pattern）是一种行为设计模式，它允许你定义一系列算法，并将每个算法封装起来，使它们可以相互替换。下面介绍策略模式在 TypeScript 中的实现。 策略模式基本概念 策略模式包含三个主要部分： Context（上下文）：维护一个策略对象的引用 Strategy（策 阅读全文

摘要： 什么是单例模式？ 单例模式是一种创建型设计模式，它确保一个类只有一个实例，并提供一个全局访问点来获取这个实例。在 TypeScript 中，单例模式特别有用，因为它结合了 JavaScript 的灵活性和 TypeScript 的类型安全。 为什么需要单例模式？ 想象一下这些场景： 数据库连接池管理 阅读全文

摘要： 大家好！最近在个人项目里用上了 React Server Components (RSC)，觉得这东西有点意思，能让应用更快、更轻。以前 React 组件全在浏览器跑，现在部分移到服务器。今天我就来聊聊 RSC，从基础说起，帮你快速上手。 什么是 React Server Components？ 简 阅读全文

摘要： 在 2025 年的前端开发中，代码一致性和效率已成为核心痛点。传统工具链如 ESLint + Prettier 虽强大，却饱受配置复杂、性能瓶颈和 CI/CD 集成难题之苦。Ultracite，作为 Biome 的高度意见化预设，应运而生。它不仅零配置部署，还深度优化 AI 协作场景，帮助开发者与模 阅读全文

摘要： 前言 三年前，我们还在 Reddit 上吵得不可开交： “Redux 太啰嗦！” “Zustand 太黑盒！” “Jotai 会内存泄漏！” 今天，React 19 直接把“外挂仓库”拆成了无数颗微状态胶囊（Micro-State Capsules）——随用随取，随丢随灭。 状态不再集中，而是散落在 阅读全文

摘要： 背景 我们团队主要在做 C 端产品，对于 C 端应用，图片资源使用 CDN 十分重要，因此我们曾建立了一个文件上传平台：上传文件后，可以复制图片的 CDN URL 在前端项目中使用。 目前服务端不会对图片做压缩，使用前得先借助其他工具手动压缩再上传，体验很差。调研后发现，纯前端就能完成压缩且完全满足 阅读全文

摘要： import { render } from 'preact' const frag = document.createDocumentFragment() render(<CustomComponent />, frag) const container = document.querySelec 阅读全文

摘要： 为何需要通用 Action？ 在 Zustand 状态管理库中，开发者常常需要为状态对象的每个字段单独编写更新函数。然而，随着状态结构的复杂化，这种方式会导致代码冗余，维护成本增加。例如： updateName: (name) => set(() => ({ name })), updateAge: 阅读全文

摘要： 问题 使用 Delete unused imports 操作时，同时删掉了 import React from 'react';。 为什么不能删掉呢？因为代码 push 到远程仓库后会走 CI 流程， CI 流程里有代码检查节点进行 ESLint 检查 CI 节点的 ESLint 规则开发者无法修改 阅读全文

摘要： 引言 在状态管理领域，计算属性（computed properties）是一个极其重要的概念。MobX 和 Pinia 等库都内置了计算属性功能，允许开发者声明式地定义派生状态。虽然 Zustand 本身没有直接提供 computed API，但这并不意味着我们无法实现类似的功能。 本文将介绍三种在 阅读全文

摘要： 引言 在现代 React 应用开发中，状态管理一直是开发者面临的核心挑战之一。虽然 Redux 曾是主流解决方案，但其繁琐的样板代码让许多开发者望而却步。Zustand 作为一个轻量级的状态管理库，提供了更简洁的 API 和更好的 TypeScript 支持，同时还能与 React Context 阅读全文

摘要： 引言 在现代前端应用中，模态框(Modal)是最常用的UI组件之一。然而，随着应用规模的增长，模态框的状态管理往往会变得混乱。本文将介绍一种基于 Pinia 和 Vue 3 Composition API 的类型安全模态框管理方案，帮助你优雅地处理应用中的各种模态框状态。 核心概念解析 1. Pin 阅读全文

摘要： 好基友扔过来一张效果图，简单分析下，一起看看如何实现它吧。 一个半环形用于表示 0 - 100%。 半环形开头有一个圆点作为修饰。 半环形两端需要呈现为圆角。 通过 div 实现 先画一个长方形。 <div class="graph"></div> .graph { width: 200px; he 阅读全文

摘要：  ## useEffect 先理解 useEffect 有助于学习 useMemo 和 useCallback。因为 阅读全文

摘要： temp1.dispatchEvent( new MouseEvent('mouseover', { view: window, bubbles: true, cancelable: true, }) ); 阅读全文

摘要： ## 问题 在当前版本 vant weapp 组件库中，sticky 组件 offsetTop 属性类型为 number，单位默认为 px 且无法更改，而小程序默认单位是 rpx。这导致在一些场景下，如 sticky 的元素与顶部须保留一定距离，无法直接设置 offsetTop。 ## 解决 通过小 阅读全文

摘要： 解决方法 进入你当前的项目的 .git 目录 cd ./.git/ 删除 index.lock（linux） rm -rf ./index.lock 删除 index.lock（windows） rm -r -fo ./index.lock index.lock 执行编辑索引的 Git 命令时，Gi 阅读全文

摘要： node-sass 不支持 >>> 语法，推荐改用 /deep/。后来，node-sass 被 deprecated，推荐使用 dart-sass。但 dart-sass 又和 /deep/ 有冲突。所以，如果你使用 vue2 同时又使用 dart-sass，只剩一种选择 ::v-deep。 <st 阅读全文

摘要： 前置 微信小程序官方文档自定义组件章节内容比较杂，以下是我的学习记录。 小程序自定义组件 原生微信小程序支持简洁的组件化编程，通过组件化编程可以： 将页面内的功能模块抽象成自定义组件，以便在不同的页面中重复使用 将复杂的页面拆分成多个低耦合的模块，有助于代码维护 发布第三方原生小程序自定义组件或组件 阅读全文

摘要： 掌握用文本文件和CSⅴ文件准备训练数据 掌握对数据列和非数据列的处理 掌握从文件中加载训练数据 用文件准备训练数据 纯文本文件 纯文本文件（.txt）：只保存文本信息的文件 相比Word、PDF等格式文件较小 相比二进制格式存储数据文件稍大（易读性较好） 数据的数字化 数据格式 训练数据的格式 数据 阅读全文