于一的博客
搜索文章
首页
分类
文章
前端开发
情绪
关于我
心路
首页
分类
文章
前端开发
情绪
关于我
心路
2026 年 09 月
【Three.js】day106-geometry-performance
Day 106 · 几何进阶与性能 — BufferGeometry 原理与实例化 Day 102 你直接用 BoxGeometry(1,1,1) 造零件——好用，但没想过"它背后是什么"。今天掀开盖子看两层：几何体的数据本质（BufferGeometry：顶点、索引、attribute），和3D
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day105-boss-3d-workshop
Day 105 · BOSS 战 — 第一个 3D 车间：把 7 天零件拧成一件作品 第 15 周收官。今天不做新知识点，做组装与验收：把 Day 99-104 攒下的零件——场景、循环、光照、几何、边界、交互——拧成第一个"会转、会亮、可点、边界清晰"的 3D 车间。上午组装（车间布局 + 多设备
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day104-raycaster-interaction
Day 104 · 交互 — Raycaster 射线拾取与事件桥接 前六天场景是"能看的"；今天给它"手"——点一下设备，它高亮，旁边弹出信息面板。2D 里这叫命中检测（第 7 周拓扑图做过），3D 里叫 Raycaster（射线拾取）。今天落地三件事：屏幕坐标→世界射线的换算、Raycaster
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day103-three-vue-boundary
Day 103 · Three × Vue 边界 — 3D 版三问法则（本周灵魂） 前四天你有了能跑能转能发光的场景。今天不写新功能，做本周最重要的事：把第 3 个月沉淀的边界方法论（Day 85 三问法则）搬到 3D——场景图归 Three 管、业务状态归 Pinia 管、跨边界的通信走桥。今天决
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day102-geometry-transform
Day 102 · 几何与变换 — 用零件组装一台设备 前三天你有了：场景、循环、光照。但只有一个立方体。今天做"组装"——几何体（零件的形状）、三变换（position/rotation/scale）、以及 3D 组装的灵魂 Group（把零件焊成一台可以整体搬动的设备）。做完你会明白：3D 场景
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day101-lighting-materials
Day 101 · 光照与材质 — 让工业场景有质感 Day 99 第一天就踩过"全黑"的坑：Standard 材质没有灯就是黑。今天正面解决它——光照与材质是整个 3D"质感"的来源。你要掌握：四类常用材质各自什么时候用、四类光源各自长什么样、以及最重要的匹配原则（什么材质配什么光）。最后用 Da
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day100-rendering-loop
Day 100 · 渲染循环与动画纪律 — 让世界动起来 Day 99 我们"画了一次"——静态立方体。今天学习 3D 的灵魂：渲染循环。3D 不像 2D 那样可以做脏检查/局部重绘，它每一帧都要把整个场景重新画一遍，所以"持续渲染"不是可选项而是默认形态。今天要建立三样东西：rAF 循环骨架、Cl
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【Three.js】day99-three-scene-basics
Day 99 · 场景基础 — Scene / Camera / Renderer：第一个 3D 物体 Three.js 的第一课，也是 3D 世界里最朴素的真理：没有相机，世界存在但你看不见；没有光照，世界存在但你看不清。今天搭起最小组件——场景（容器）、相机（眼睛）、渲染器（画布）、一个立方体（
作者：mario
发布时间：2026-09-07
分类：
默认分类
,
Three.js
标签：
#
前端开发
【阶段2收官】day98-stage2-graduation
Day 98 · BOSS 战 — 阶段 2 毕业礼：0-3 个月的整体收官与数字孪生预告 第 98 天，阶段 2（夯实基础：0-3 个月）正式毕业。今天不写代码、不产出新资产——做三件事：阶段 2 的整体回顾（从 Day 1 的 HTML 骨架到 Day 97 的线上大屏）、毕业自检（对照学习计划
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【阶段2收官】day97-month3-summary
Day 97 · 第 3 个月毕业总结 — 变化量盘点与作品链收官 昨天简历与弹药库就绪，今天做第 3 个月的毕业总结：四周回顾（核心 → 生态 → 边界 → 交付）、能力对照（第 2 个月末 vs 现在）、认知增量（本月最值钱的三个想法）、作品链资产盘点。纪律照旧：写变化量，不写流水账。这篇总结是
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【阶段2收官】day96-resume-interview
Day 96 · 简历与面试弹药库 — 把 98 天变成一页纸和十段追问答案 毕业博文发了，今天做求职侧的最后一公里：简历项目条目升级为 Vue 版、面试弹药库系统化整理（每句简历话术配 10 分钟追问答案）、模拟问答实战演练。原则延续 Day 70 的"每句话撑住 10 分钟追问"——今天 add
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【阶段2收官】day95-graduation-blog
Day 95 · 毕业博文 — 《原生 vs Vue 开发大屏的体会》：三周对照表的最终变现 今天把 Day 71 起维护的对照表（≥ 20 行）、Day 84 的退役报告、Day 85 的边界文档、Day 93 的优化数据，熔炼成一篇文章。这篇博文是第 3 个月最重的认知资产：它证明你不只是"用了
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【阶段2收官】day94-readme-assets
Day 94 · README 与演示资产 — Vue 版重录：作品的第一印象工程 大屏 Vue 版上线了、瘦身了，但 README 和演示视频还是原生版时代的（Day 70 产出）。今天全部更新到 Vue 版：截图重截、GIF 重录、演示视频重录（含 URL 路由这个新卖点）、架构图重画（四层画布
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【阶段2收官】day93-bundle-optimization
Day 93 · 产物优化 — bundle 分析与首屏瘦身：数字说话的收官 昨天上线成功，今天给它"称重"：bundle 可视化分析找出体积大头、按需引入审计揪出漏网的整包 import、首屏指标建立优化前后的量化对比。今天的原则是"预算制"——设定目标、达标即停，不追求极致（优化兔子洞是收官周最
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【阶段2收官】day92-build-deploy
Day 92 · 生产构建与部署 — 还掉 history 回退的账：让陌生人看到你的大屏 收官周第一个工程日：把大屏部署到可访问的线上地址。核心是三件事：生产构建（vite build 与开发模式的差异）、history 路由的回退配置（Day 78 欠的账）、数据服务器的部署策略（静态站与 WS
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
阶段2收官
标签：
#
前端开发
【Canvas × Vue】day91-boss-screen-c
Day 91 · BOSS 战 — 屏 C 终验收与三屏齐活：边界课的结业考 本周收官，也是第 3 个月的"内容完成日"——三屏全部 Vue 化。今天两场验收：屏 C 终验收（拓扑功能 + 边界纯净度 + 动画生命周期）与三屏齐活回归（Day 84 清单重跑 + 拓扑增强项）。今天依然"验收不写码"
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
Canvas × Vue
标签：
#
前端开发
【Canvas × Vue】day90-screen-c-integration
Day 90 · 屏 C 整合 — 配置驱动的拓扑页：组装与包装 零件齐活（骨架/数据/交互/动画），今天组装整屏：ScreenC 从占位符变成完整页面——声明式拓扑配置、TechCard 包装、图例说明、告警联动提示。今天的增量不大（又是装配日），但要处理一个真问题：拓扑配置与设备数据的对账——配
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
Canvas × Vue
标签：
#
前端开发
【Canvas × Vue】day89-pulse-animation
Day 89 · 告警脉冲动画 — rAF 生命周期：danger 节点的呼吸感 屏 C 的最后一块拼图：告警脉冲动画（Day 68 的 danger 节点红底脉冲）。它是"每帧动画"与"组件生命周期"的正面试题——rAF 循环必须在失活时暂停（KeepAlive 摘 DOM 后继续跑是纯浪费）、激
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
Canvas × Vue
标签：
#
前端开发
【Canvas × Vue】day88-interaction-bridge
Day 88 · 交互桥接 — Canvas 事件 → emit：hover 详情的响应式化 入向桥通了，今天拆出向：Canvas 的命中检测事件如何变成 Vue 状态。核心技术点是 emit 桥（Day 85 出向契约）与 hoverNode 存 id 不存对象（Day 85 反例推演 4.2 的
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
Canvas × Vue
标签：
#
前端开发
【Canvas × Vue】day87-state-driven-render
Day 87 · 状态驱动重绘 — store → renderer：markRaw 与入向桥实现 今天的主题是入向桥的实现，以及本周最重要的一个 API：markRaw——renderer 实例绝不能被响应式系统代理。还要处理"重绘频率"问题：快照 500ms 一次，但状态色往往几秒才真变——脏检
作者：mario
发布时间：2026-09-04
分类：
默认分类
,
Canvas × Vue
标签：
#
前端开发
共 183 篇文章
1
2
3
4
5
6
7
8
9
10
页
