- 博客(404)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 【Tailwind】 大小屏动态适配方案
Tailwind CSS 提供了两种响应式设计思路：Mobile First（小屏原始+大屏增强）和 Desktop First（大屏原始+小屏裁剪）。前者默认样式针对小屏，使用min-*断点逐步增强；后者默认样式针对大屏，使用max-*断点逐步降级。关键区别在于默认状态的设定和失败策略方向，而非单纯语法差异。工程中必须保持一致性，同一属性只能选择一种断点方向（min或max），避免混合使用。选择依据应取决于项目类型：移动优先产品适合Mobile First，而数据密集系统更适合Desktop First。
2026-01-20 14:26:30
310
原创 【ThreeJS】camera-controls 的“使用详解 + 参数详解”
本文详细解析camera-controls的核心使用逻辑与参数语义。重点包括：1）必须通过update(delta)驱动相机状态更新；2）参数本质控制的是spherical、target等数学状态而非简单动画效果；3）核心API如setLookAt、fitToBox等在实际工程中的应用场景；4）边界系统等高级功能的实现原理。文章强调所有参数都有明确的数学映射关系，并提供典型工程配置示例，帮助开发者精准控制相机行为而非仅"调手感"。
2025-12-30 17:33:34
684
原创 【ThreeJS】camera-controls---高性能动画相机控制库
《camera-controls：状态驱动的相机控制系统解析》摘要： camera-controls是一个基于状态管理和插值过渡的相机控制库，其核心思想是将相机位置、目标点等参数作为可预测、可插值的数学对象来管理。与Three.js内置的OrbitControls不同，它采用声明式而非事件驱动的方式，通过维护球坐标、目标点等内部状态模型，实现更精确的相机控制。该库支持手动调用update(delta)，便于集成到各种动画系统中，并提供丰富的约束系统和二次封装能力。特别适用于需要业务逻辑驱动相机、状态可序列化
2025-12-30 17:23:38
689
原创 【ThreeJS】Renderer阴影类型区别
Three.js 提供4种阴影类型，各具特点： 1️⃣ BasicShadowMap：性能最优但锯齿明显，适合移动端/低配设备 2️⃣ PCFShadowMap：边缘轻微柔化，性能适中，推荐中端设备 3️⃣ PCFSoftShadowMap（默认）：柔化效果更好，桌面场景首选 4️⃣ VSMShadowMap：最自然柔和但性能高，需注意光晕问题，适合高端设备 📌 建议：移动端用Basic，桌面默认PCFSoft，高级场景可选VSM。性能与效果需权衡选择。
2025-12-29 16:43:58
256
原创 【Docker】必备速查指南
Docker 快速使用指南：包含容器查看(docker ps)、终止(stop/down)、运行(run/up)等基本操作。重点对比docker run(单容器测试)与docker-compose(多服务管理)的区别，后者通过YAML文件定义服务、卷和网络。Compose文件支持服务依赖、环境变量配置，适合复杂项目。常用命令总结包括日志查看、容器交互及删除操作。建议开发时使用卷挂载，生产环境采用多阶段构建优化镜像。
2025-11-14 17:23:56
331
原创 【docker】运行对应服务
使用Docker运行Redis等数据库服务无需本地安装，只需一条命令即可快速部署。通过Docker官方镜像，用户可以直接运行Redis等服务（如docker run -d -p 6379:6379 redis），自动完成镜像下载、服务启动和端口映射。与传统安装方式相比，Docker容器化方案更干净、版本可控，且使用体验完全一致（通过localhost相同端口访问）。此外，该方法同样适用于PostgreSQL、MySQL等主流服务，支持通过简单命令进行启动/停止/删除等全生命周期管理，避免系统污染并节省资源。
2025-11-14 15:59:58
366
原创 【threejs】系统梳理一下 Three.js 摄像机体系
分类关键点相机类型透视（真实） / 正交（技术）控制方式手动设置 or OrbitControls限制范围更新响应实战常见俯视、绕场、跟随、展示、BIM视角。
2025-10-30 17:50:35
1176
原创 【threejs】材质共享导致的典型问题
Three.js材质共享问题是加载GLB或复制模型时的常见坑。核心在于材质是引用而非拷贝，导致修改一处，多处同步变化。问题常出现在GLTF导入、模型复制和实例化网格时，表现为透明度、贴图、流光等属性联动变化。解决方案包括克隆材质、深度克隆贴图、针对性复制材质等，需根据场景权衡性能。验证材质是否共享可通过统计材质实例数量。实战中，独立材质适用于动态效果控制，而静态模型可共享材质以提升性能。最后提供了不同规模模型的优化建议和解决方案对照表。
2025-10-30 17:40:40
1046
原创 【Three.js】必学：GLB模型遍历与节点操作指南
本文详细介绍了Three.js中GLB模型层级结构的遍历与节点操作方法。主要内容包括：GLB模型的树状结构本质，使用object.traverse()进行深度优先遍历，筛选Mesh、Group等节点的技巧，访问层级关系的方法，以及性能优化建议。还提供了常见应用场景的代码示例，如查找特定节点、修改材质属性、添加动画效果等。文章强调通过规范命名、使用调试工具和掌握核心API，可以高效处理复杂的3D模型层级结构，为Three.js开发者提供了实用指南。
2025-10-30 17:34:28
940
原创 Zod-to-OpenAPI：自动生成文档全解析
zod-to-openapi 是一个将 Zod schema 转换为 OpenAPI 文档的工具。其核心流程为：首先通过 extendZodWithOpenApi 扩展 Zod 方法，为 schema 添加 OpenAPI 元数据；然后将所有 schema 注册到 OpenAPIRegistry，并通过 registerPath 定义接口路径、请求和响应；最后使用 OpenApiGeneratorV3 生成 OpenAPI 规范的 JSON 文档，可输出给 Swagger UI 或 Redoc 使用。该工具
2025-10-27 11:49:17
453
原创 【NestJS】 OpenAPI文档：运行时动态生成揭秘
NestJS 的 OpenAPI 文档是基于 Reflect 元数据，在运行时动态扫描生成的；但你可以通过手动导出静态 JSON 文件。
2025-10-25 19:00:27
557
原创 【NestJS】深入理解NestJS装饰器原理
NestJS的装饰器系统是框架核心，它通过TypeScript装饰器语法和Reflect Metadata机制实现。装饰器分为类装饰器、方法装饰器、参数装饰器和属性装饰器四种类型，在类加载阶段就执行而非运行时。多个装饰器执行顺序遵循"从下到上"的规则，NestJS启动时会读取装饰器生成的元数据构建路由映射、依赖注入等逻辑。整个过程可概括为：编译时装饰器执行并记录元数据，启动时Nest读取元数据注册逻辑，请求时应用这些预定义规则。
2025-10-25 18:56:35
899
原创 【NestJS】 管道(Pipe)核心原理解析
NestJS 管道（Pipe）详解：本文全面介绍了 NestJS 中的 Pipe 机制，包括其基本概念（参数转换验证器）、不同级别管道的使用（参数级、方法级、控制器级和全局管道），以及自定义管道的实现方法。重点解析了管道执行顺序、内部工作原理和不同场景下的应用特点，如参数级管道精确控制单个参数，全局管道自动处理所有装饰器参数，以及请求级管道可访问请求上下文。文章还提供了自定义管道的代码示例和使用场景对比表，帮助开发者根据需求选择合适的管道实现方式。
2025-10-24 17:03:32
880
原创 【NestJS】Reflect Metadata 全解
Reflect Metadata：TypeScript元数据编程指南 Reflect Metadata是TypeScript中用于存储和读取类、方法、属性元数据的API。它通过Reflect.defineMetadata()和Reflect.getMetadata()实现元数据的定义与读取，常用于框架开发（如NestJS）。核心功能包括： 为类/方法附加额外信息（如路由路径、HTTP方法） 通过装饰器语法简化元数据标记 支持原型链查询和精确查询 提供完整的元数据生命周期管理（增删查改） 典型应用场景： 构建
2025-10-24 16:09:56
630
原创 【NestJS】依赖注入：超越自动new的深层解析
NestJS 依赖注入（DI）远不止简单的自动实例化类，而是一套完整的对象生命周期管理系统。它基于 IoC 容器实现依赖图解析，结合工厂模式、单例模式等设计模式，提供强大的模块化能力。核心优势包括：通过抽象接口实现可插拔架构、轻松mock依赖提高可测试性、支持不同作用域实例（单例/请求/瞬时）等。这种机制实现了控制反转，让业务代码无需关心依赖创建，使系统更灵活、可扩展且易于维护。
2025-10-24 14:39:51
679
原创 【NestJS】依赖注入（DI） 的模块系统、`imports`、`@Module`、`providers` 之间的关系彻底搞清楚
NestJS模块机制核心要点：模块(@Module)作为代码组织单元，包含providers(可注入服务)、controllers(控制器)、imports(导入其他模块)和exports(暴露服务)四个关键属性。providers支持类、值、工厂函数等多种注入方式，通过IoC容器管理。模块间通过imports和exports建立依赖关系，实现服务共享。整个机制实现了模块解耦、依赖自动注入和统一生命周期管理，使开发者能专注于业务逻辑。
2025-10-24 14:34:30
323
原创 【Angular 】Angular 中的依赖注入
当你开发系统中较小的部分（如模块或类）时，可能需要使用其他类的功能。例如，你可能需要一个HTTP服务来进行后端调用。依赖注入（DI）是一种设计模式和机制，用于创建应用程序的某些部分并将其提供给应用程序中需要它们的其他部分。Angular支持这种设计模式，你可以在自己的应用程序中使用它来提高灵活性和模块化程度。
2025-10-24 14:02:27
933
原创 【NestJS】依赖注入：@Injectable()的核心作用
摘要： NestJS的@Injectable()装饰器是依赖注入（DI）机制的核心标识。未添加时，Nest无法识别类的可注入性，导致依赖解析失败（如UserService无法注入到UserController）。加上后，Nest会通过反射记录元数据，交由IoC容器管理生命周期，实现自动实例化和依赖传递（如UserService自动注入DatabaseService）。其作用类似“员工胸牌”，标记可托管类，解决手动实例化、依赖链管理等问题，并提升可测试性。简言之，@Injectable()是Nest DI系统
2025-10-20 16:48:47
866
原创 【NestJS】中间件与管道：请求处理双雄对决
NestJS 中间件（Middleware）和管道（Pipe）是请求处理流程中的两个关键组件。中间件在请求到达控制器前执行，负责全局逻辑如日志、鉴权和跨域处理；而管道专注于控制器方法参数的验证和转换。主要区别在于：中间件作用于整个请求阶段，可修改请求/响应对象；管道则针对单个参数进行数据校验和类型转换。形象地说，中间件是"安检大门"，而管道是"验票员"。实际开发中，中间件适合处理跨请求逻辑，管道则用于参数级别的数据验证。两者配合使用可构建更健壮的应用流程。
2025-10-20 16:24:10
507
原创 【NestJS】【后端架构师】`class-validator + @nestjs/swagger` 远不如 `zod + zod-to-openapi` 一体化
Zod 在工程一体性和开发体验上已超越传统 class-validator 方案 传统方案（class-validator + @nestjs/swagger）需要重复声明类型、校验和文档，实际是运行时拼装的"伪一体"。而 Zod 通过单一 schema 同时定义类型、校验规则和 OpenAPI 文档，实现真正的"类型即验证"。对比显示，Zod 在类型同步、文档维护、跨层复用等方面优势明显，支持 Prisma 集成和前后端共享，其链式 API 和丰富生态提供了更简洁高
2025-10-20 15:25:11
476
原创 【Blender】【快捷键】物体控制全量快捷键
Blender物体控制快捷键指南：基础选择与模式切换（右键单选/Shift加选/Tab切换模式）、核心变换操作（G移动/R旋转/S缩放及轴锁定组合键）、物体管理（H隐藏/X删除/Shift+D复制）、视图控制（中键拖动旋转/Shift+中键平移）以及编辑模式高频操作（E挤出/Ctrl+R环切）。掌握这些快捷键可显著提升3D建模效率，建议从基础变换操作开始练习。
2025-10-17 15:04:59
900
原创 【NestJS】class-transformer什么用
对比点class-transformer 作用是否在 Zod 中仍需请求参数类型转换把字符串转数字、日期等❌（Zod 内部可做）响应数据隐藏字段✅（可用自定义函数代替）类实例创建❌（Zod 直接校验对象）Swagger 类型推断依赖装饰器❌（Zod → OpenAPI 替代）
2025-10-17 10:33:27
436
原创 【NestJS】Pipe+Interceptor+ExceptionFilter打造完美三段式
本文总结了在 NestJS 中使用 Pipe（管道）、Interceptor（拦截器）和 Exception Filter（异常过滤器）实现三段式响应（code + message + data）的最佳实践。Pipe 负责请求入参的验证与清洗，Interceptor 处理成功响应的统一包装，而 Exception Filter 捕获异常并格式化为三段式错误响应。三者协作形成完整的请求处理流程：ZodValidationPipe 校验参数 → Controller 执行业务 → ResponseInterce
2025-10-17 10:18:20
425
原创 【NestJS】NestJS三件套：校验、转换与文档生成,对比Django DRF
NestJS 采用模块化设计，通过三件套组合实现类似 Django DRF Serializer 的功能： class-validator 负责参数校验（替代 DRF 的字段验证） class-transformer 处理 plain ↔ class 转换（类比 DRF 的序列化/反序列化） @nestjs/swagger 自动生成 OpenAPI 文档（类似 drf-spectacular） 三件套通过装饰器联动工作，配合 ValidationPipe 实现： 请求数据自动转换为 DTO 实例 参数校验
2025-10-16 17:00:16
1139
原创 【NestJS】【class-validator + DTO】轻松生成Swagger文档
NestJS 通过 @nestjs/swagger 模块可轻松生成 OpenAPI/Swagger 文档。安装依赖后，在 main.ts 配置 Swagger 并注册路由。DTO 类需添加 @ApiProperty 装饰器描述字段，结合 class-validator 实现参数校验。Controller 使用 @ApiTags 分组接口。启动服务后访问 /api-docs 即可查看自动生成的交互式文档，支持 JWT 鉴权、响应类型等扩展功能。该方案实现了代码与文档的同步维护，提升开发效率。
2025-10-16 11:44:44
375
原创 【Prisma】 多表拆分：模块化 Schema 管理实战，多文件 Schema 拆分
Prisma模块化Schema管理方案 针对中大型项目表多导致的单文件管理痛点，建议采用模块化Schema拆分方案： 1️⃣ 文件结构：按业务模块拆分模型（如user.prisma），通过merge脚本自动合并到主schema.prisma 2️⃣ 实现方式：预构建脚本拼接模型文件，保留统一数据源配置 3️⃣ 自动化流程：集成合并+生成命令，支持50+表级项目开发 4️⃣ 扩展方案：超大规模项目可采用多schema+独立客户端生成 核心优势：提升可维护性、减少协作冲突、保持Prisma特性完整。通过脚本自动
2025-10-16 11:31:14
411
原创 【Prisma】Prisma 命令大全（Node / NestJS 通用）
🧩 Prisma 主要通过命令行（CLI）来管理数据库模型、迁移、生成客户端。
2025-10-16 11:18:46
741
原创 【NextJS】NextJS后端框架：class-validator vs zod
在NextJS类后端框架（如NestJS）中，class-validator与zod的适用场景截然不同。class-validator基于装饰器和DTO模式，深度集成依赖注入，适合类风格的控制器开发，支持自动验证与Swagger兼容；而zod以函数式Schema为核心，轻量灵活，适合无类约束的轻量API或性能敏感场景。结论：类架构优先选class-validator，函数式或Serverless场景选zod。 （150字）
2025-10-16 11:02:31
931
原创 【NestJS】NestJS后端开发全指南
NestJS 是一个基于 Node.js 和 TypeScript 的后端框架，采用模块化架构和依赖注入等企业级设计模式。核心结构包括：模块（Module）组织代码、控制器（Controller）处理路由、服务层（Service）实现业务逻辑。通过装饰器（如@Get、@Post）定义API，支持DTO验证、中间件、守卫（权限控制）和拦截器等高级功能。相比Express，NestJS提供了更规范的工程化架构，适合构建复杂后端应用。其核心思想是将代码分层组织，使项目结构更清晰、可维护性更强。
2025-10-16 10:48:13
1061
原创 【Turborepo】【Next】 Turborepo + Next.js 前后端精简搭建笔记（带官网）
本文介绍了使用 Turborepo + Next.js + NestJS 搭建前后端项目的精简流程。主要内容包括：1) Turborepo 初始化创建 monorepo 项目结构；2) 前端使用 Next.js 开发页面和 API Route；3) 独立后端使用 NestJS 创建模块化服务；4) 通过 Turborepo 管理多项目脚本；5) 可选的公共模块共享方案。文章提供了各框架官网链接和典型命令，并建议小型项目可用 Next.js API Route，中大型项目则采用前后端分离架构。
2025-10-15 14:27:43
362
原创 【Next/Nuxt全栈】【ORM】Prisma 全解指南（2025最通俗版本）
示例：一个简单的用户与文章系统provider = "postgresql" // 可改为 mysql / sqlite / mongodb优势说明✅ 类型安全全自动生成 TS 类型✅ 自动补全IDE 体验极佳✅ 迁移系统管理数据库结构✅ 支持主流数据库✅ 可视化Prisma Studio 超方便🚀 生态完善结合 Next.js / tRPC / Drizzle 等缺点说明❌ 不太适合超复杂原生 SQL高度抽象❌ Prisma Client 会有少量生成时间。
2025-10-14 16:32:07
1041
原创 【个人项目】题库系统-表设计
本文介绍了题库系统的核心模块设计与数据库表结构。系统包含题目、分类、用户、答题记录和统计五大模块，采用关系型数据库设计，详细说明了题目表、分类表、答题记录表、试卷表和统计表的结构与字段。文章还提供了扩展设计建议（如多语言支持、AI题目生成等）和系统数据流示例，强调灵活可扩展的题目结构和答题记录是题库系统的设计关键，可支持从基础练习到智能刷题的全流程功能。
2025-10-14 16:23:10
1169
原创 【思考】一个普通人，如何构建“稳固、清醒、有力量”的知识体系
《普通人的知识体系构建路径》摘要： 本文提出一个由下至上的五层知识体系模型：1.生存基础层（健康/法律/理财）；2.理性思维层（逻辑/批判性思维/科学方法）；3.人文社会层（心理学/社会学/历史哲学）；4.技能实践层（工具使用/职业协作/学习能力）；5.精神价值层（自我认知/伦理信念/美学创造）。强调每层都是上一层的支撑基础，知识成长应遵循"生存→思考→理解→实践→意义"的递进逻辑，最终实现从"知道"到"理解为何知道"的认知跃迁。
2025-10-10 16:46:45
713
原创 【ThreeJs】【性能优化】从渲染底层到业务逻辑的系统性提速方案
Three.js性能优化指南 本文系统介绍了Three.js性能优化的关键策略，主要分为GPU和CPU两个层面的优化方案。在GPU层面，建议通过合并模型（InstancedMesh）、压缩贴图（1k分辨率）、减少动态光源和优化阴影设置来降低GPU负担。CPU层面则推荐使用节流/防抖控制逻辑执行频率，采用懒加载技术和LOD（多层次细节）模型管理。其他优化包括合理配置Renderer参数、及时释放内存资源，以及使用stats.js等工具监控性能。实战案例显示，通过系统优化可将3D看房项目从25FPS提升至稳定的
2025-10-08 21:15:18
1549
原创 【ThreeJs】【伪VR】用 Three.js 实现伪 VR 全景看房系统：低成本实现 3D 级交互体验
本文揭秘了低成本实现"伪VR"全景看房系统的技术方案。通过Three.js在球体内壁贴360°全景图，配合热点交互系统，实现3D环视效果。核心原理是创建反转球体加载全景贴图，结合热点导航、场景切换和自动导览功能。相比真3D建模，该方案具有成本低、性能高、易维护等优势，适合房产、酒店等场景快速部署。文章还提供了从伪VR到真3D的渐进式升级路径，展示了如何用简单技术实现沉浸式体验。
2025-10-08 21:05:02
1186
原创 【前端】【架构师】【Prettier】Prettier 配置详解（带示例）
Prettier配置详解：本文介绍了Prettier代码格式化工具的常用配置项，包括基础格式控制（如行宽、缩进）、字符与语句风格（如引号、分号）、JSX/Vue模板处理（如属性换行）等关键参数。提供了JSON配置示例和代码对比，并推荐了Vue/React项目的通用配置方案。特别强调跨平台开发时需设置endOfLine: "auto"以避免换行符问题，帮助开发者快速掌握Prettier的格式化规则定制。
2025-09-26 16:09:58
543
原创 【ThreeJs】【HTML载入】Three.js 中的 CSS2DRenderer 与 CSS3DRenderer 全面解析
在 Three.js 项目中，很多时候我们需要把 HTML 元素放进 3D 世界里：比如信息标签、操作按钮、甚至一个完整的弹窗界面。Three.js 官方提供了两种方案：本文将从 区别、使用规则、示例写法、事件交互 四方面来讲解。👉 简单一句话：规则 1：需要固定朝向相机 → 用 CSS2DRenderer例：人物名字、坐标标签、提示文字规则 2：需要 3D 效果或网页窗口 → 用 CSS3DRenderer例：可旋转的网页卡片、嵌入式表单、3D 弹窗规则 3：性能优先时 → 先考虑 CSS2DRe
2025-09-24 16:49:06
1978
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人