Skip to content

Technical Blog

怀敬畏以知止,抱赤诚而敢行。
104 篇文章7 个专题
JavaScript · 17前端框架 · 13浏览器与 CSS · 8工程实践 · 10工具与部署 · 12LeetCode · 36Java · 8

最新文章

8 篇
Java2026/06/121 分钟

认证与授权机制

认证和授权不能混着看。认证决定 `Authentication` 怎么产生,授权决定这个对象有没有访问资格。 - `Authentication` - `AuthenticationManager` - `AuthenticationProvider` - `UserDetail

Java2026/06/121 分钟

企业级实战案例

com.example.demo ├── auth │ ├── AuthController.java │ ├── LoginRequest.java │ ├── LoginResponse.java │ └── RegisterRequest.java ├──

Java2026/06/121 分钟

过滤器链与执行顺序

过滤器顺序本身就是机制的一部分。Spring Security 大量问题都不是“配置错”,而是过滤器插错位置。 Servlet 场景下常见主链路可以概括为: 1. `SecurityContextHolderFilter` 2. `HeaderWriterFilter` 3. `

Java2026/06/121 分钟

Spring Security 6 总览

Spring Security 在 Spring Boot 3 里默认走 Servlet 安全链路,核心是把认证、授权、上下文保存、异常处理、登录态恢复拆成一组可组合的过滤器和策略对象。 - `SecurityContextHolder`:线程内安全上下文入口。 - `Authe

Java2026/06/121 分钟

SecurityFilterChain 配置方式

Spring Security 6+ 的配置核心就是显式声明 `SecurityFilterChain` Bean。旧时代继承 `WebSecurityConfigurerAdapter` 的思路已经退出主线。 @Configuration @EnableWebSecurity

文章列表

按时间排序
Java2026/06/121 分钟阅读

认证与授权机制

认证和授权不能混着看。认证决定 `Authentication` 怎么产生,授权决定这个对象有没有访问资格。 - `Authentication` - `AuthenticationManager` - `AuthenticationProvider` - `UserDetail

Java2026/06/121 分钟阅读

企业级实战案例

com.example.demo ├── auth │ ├── AuthController.java │ ├── LoginRequest.java │ ├── LoginResponse.java │ └── RegisterRequest.java ├──

Java2026/06/121 分钟阅读

过滤器链与执行顺序

过滤器顺序本身就是机制的一部分。Spring Security 大量问题都不是“配置错”,而是过滤器插错位置。 Servlet 场景下常见主链路可以概括为: 1. `SecurityContextHolderFilter` 2. `HeaderWriterFilter` 3. `

Java2026/06/121 分钟阅读

Spring Security 6 总览

Spring Security 在 Spring Boot 3 里默认走 Servlet 安全链路,核心是把认证、授权、上下文保存、异常处理、登录态恢复拆成一组可组合的过滤器和策略对象。 - `SecurityContextHolder`:线程内安全上下文入口。 - `Authe

Java2026/06/121 分钟阅读

SecurityFilterChain 配置方式

Spring Security 6+ 的配置核心就是显式声明 `SecurityFilterChain` Bean。旧时代继承 `WebSecurityConfigurerAdapter` 的思路已经退出主线。 @Configuration @EnableWebSecurity

Java2026/06/121 分钟阅读

Session、JWT、OAuth2

Session 模式的重点不是登录接口,而是认证成功后服务端如何保存状态。 @Bean SecurityFilterChain webChain(HttpSecurity http) throws Exception { return http .sessionManagemen

Java2026/06/121 分钟阅读

Spring Security 源码级原理解析

运行时入口是 Servlet `Filter`,不是配置类。真正处理请求的是 `FilterChainProxy`。 SecurityContext context = SecurityContextHolder.getContext(); Authentication auth

LeetCode2026/06/121 分钟阅读

2976. 转换字符串的最小成本

图模型 — Floyd-Warshall 全源最短路径 将 26 个小写字母视为图中的节点,字符转换视为带权有向边。通过 Floyd-Warshall 预处理出任意两个字符之间的最小转换成本,再遍历 source 的每个位置累加即可。 --- 1. 初始化 26×26 的距离矩阵

工程实践2026/06/0135 分钟阅读

Vercel AI SDK 源码级解析

从 Data Stream Protocol 到 Provider Adapter、从 useChat 状态机到 Tool Calling 执行模型、从浏览器运行时到生产故障模式——对 Vercel AI SDK 的系统级技术分析。

工程实践2026/05/1922 分钟阅读

前端开发中常见的设计模式:框架实现与问题场景笔记

记录 Module、Singleton、Observer/PubSub、Factory、Decorator、Strategy、Proxy、Adapter、State Machine、Command、Chain of Responsibility、DI、MVVM/Flux、Composite、Flyweight 等模式在前端中的常见落点,结合 Vue 3 响应式、Redux 中间件、Koa compose,以及 SSR 状态泄漏、EventBus 内存泄漏、Proxy 渲染风暴等问题场景

工程实践2026/05/119 分钟阅读

LRU 缓存的 Map 实现:从 V8 OrderedHashMap 到前端缓存架构

基于 V8 OrderedHashMap 内部存储模型(buckets + entries 分离、hole 机制、rehash 触发规则)分析 Map based LRU 的真实 O(1) 条件与退化场景,覆盖渲染管线中 transform vs top 的帧预算差异、缓存架构的 tradeoff

浏览器与 CSS2026/04/147 分钟阅读

响应式布局的机制与策略:从 viewport 约束到 container query 的布局系统演进

以浏览器 viewport 渲染模型与 CSS 媒体查询的求值机制为起点,拆解 flexbox 主轴交叉轴弹性分配、grid 显式隐式轨道自适应、clamp/min/max 的数学函数组合原理,覆盖 container query 的尺寸容器与样式容器隔离边界、移动优先的 em 断点策略、以及 CLS 与响应式图片的预防性设计。

前端框架2026/04/135 分钟阅读

Vue Mixin 合并策略:从 mergeOptions 到 applyOptions 的完整合并链路

以 mergeOptions 源码为入口,拆解 Vue2/3 中 mixin 的 6 种合并策略(data 深合并、hooks 数组连接、methods 覆盖、assets 原型链),分析多 mixin 同名冲突的解决规则、全局 mixin 与局部 mixin 的实现差异,以及与 Composition API 在依赖追踪、类型安全和可调试性上的架构对比。

工具与部署2026/04/1010 分钟阅读

Chrome Lighthouse 与网页性能:从指标到优化

从浏览器渲染管线出发,深度解析 LCP、INP、CLS 等 Core Web Vitals 指标的底层机制,结合 Lighthouse CI 集成和真实生产案例,输出可落地的性能优化策略与监控方案。

浏览器与 CSS2026/04/064 分钟阅读

calc() 的求值机制与响应式模式:从百分比基数解析到 CSS 自定义属性的组合运算

深入 calc() 在浏览器 Style Resolution 阶段的求值管道——白空间语法约束、百分比基数的上下文依赖(width 基于包含块 width、transform 基于自身)、+/- 运算符的类型提升与乘除的单操作数限制,覆盖 calc() + var() 组合的惰性求值、vw 参与的流畅缩放公式、以及 resize 触发 layout recalc 的性能边界。

JavaScript2026/02/258 分钟阅读

Web Worker 多线程机制:从消息传递到浏览器进程模型的完整分析

以 Worker 构造函数的线程创建为入口,拆解 DedicatedWorker/SharedWorker 的消息传递机制(structured clone + transferable)、WorkerGlobalScope 的独立事件循环与主线程的通信时序,覆盖 worker 线程生命周期管理、错误传播路径、以及 CPU 密集型任务拆分与主线程渲染预算的关系。

前端框架2026/02/246 分钟阅读

Vue Router 导航守卫机制:从 promise 链到 popstate 的完整执行路径

以 navigate() 源码入口为起点,拆解导航守卫三类注册方式(全局/路由级/组件内)的解析和执行顺序,分析 runGuardQueue 的 promise 链推进逻辑,覆盖导航取消/重定向的 abort 控制、popstate 事件与浏览器历史栈的联动,以及守卫死循环和异步不返回的常见排查路径。

工具与部署2026/02/1311 分钟阅读

网站 SEO 解析:从搜索引擎原理到前端框架选型

从搜索引擎爬虫架构、两阶段索引机制到SSR/SSG/ISR渲染策略的深度对比,结合VitePress重构项目的真实Lighthouse数据与GSC收录曲线,输出一套可落地的SEO工程方案。

JavaScript2026/02/045 分钟阅读

事件循环、微任务、宏任务

从 HTML 规范的事件循环处理模型推导微任务/宏任务的调度时序,结合 V8 内部 task queue 实现与 async/await 的 Promise 化展开,覆盖微任务饥饿、requestAnimationFrame 的渲染检查点定位与生产环境中的长任务排查路径。

工程实践2026/01/2716 分钟阅读

Vibe Coding:从认知分工到工程策略

从"意图表达 vs 实现生成"的认知分工模型出发,分析 vibe coding 在编程光谱中的定位、理解债务的累积与偿还机制、分层使用策略(核心层/功能层/样板层)的工程设计、不同 AI 编程工具对 vibe coding 的适用性差异,以及 vibe coding 对代码审查、团队协作和

浏览器与 CSS2026/01/206 分钟阅读

白屏优化——从网络请求到首帧渲染的完整链路拆解

从浏览器加载 URL 的完整链路出发,按网络层(DNS→TCP→TLS→CDN→Gzip)、资源层(关键CSS内联→代码分包→Tree Shaking→HTTP/2)、渲染层(SSR→SSG→预渲染→骨架屏→延迟Hydrate)、构建层四个维度拆解白屏优化策略,覆盖 Vite/Webpack 分包配置、Nginx

前端框架2026/01/146 分钟阅读

为什么要引入虚拟 DOM

从直接操作真实 DOM 的渲染管线成本推导虚拟 DOM 架构的必然性,覆盖 VNode 树的结构设计、两阶段 diff(同层比较 + LIS 算法)、编译时优化对运行时 diff 的替代趋势,以及 VDOM 架构与信号驱动架构在更新粒度上的根本分歧。

JavaScript2025/12/024 分钟阅读

import / require 与 tree shaking 的真正分界线

记录 ESM 与 CommonJS 在依赖图构建、执行时机、live binding 和副作用判定上的差异,以及这些差异为什么会直接决定 tree shaking 的有效边界。

浏览器与 CSS2025/11/174 分钟阅读

浏览器渲染流程——从 HTML 字节流到 GPU 合成帧的完整管线

从 Blink 渲染引擎的完整管线出发,逐阶段拆解 HTML 解析→DOM/CSSOM 构建→Render Tree→Layout→Paint→Composite,覆盖 preload scanner 的资源发现机制、script 阻塞的精确语义、强制同步布局的触发条件与性能代价,以及动画在

前端框架2025/08/257 分钟阅读

微信小程序分包机制与 uni-app 工程落地:从 2MB 硬约束到异步加载链的完整拆解

以微信小程序 2MB 主包限制为起点,拆解 uni-app pages.json 中 subPackages 配置到最终 dist/mp-weixin 构建产物的映射规则,覆盖分包异步化的 require.async 加载链、preloadRule 的下载时机 触发条件、独立分包的隔离边界、以及 vendor.js 公共依赖抽取对主包体积的侵蚀——实际项目从 2.4MB 拆到 1.7MB 的配置决策记录。

JavaScript2025/08/052 分钟阅读

数组判断的安全边界——为什么 Array.isArray 不可绕过

深入 V8 引擎层面分析 Array.isArray 通过 instance type 检测不可绕过的根因,对比 toString、instanceof、constructor 三种方案的可绕过路径,覆盖跨 Realm iframe 场景、Proxy 干扰、伪数组特征检测与生产环境的类型防护策略。

浏览器与 CSS2025/07/213 分钟阅读

CORS 预检——为什么一次 API 调用发了两次请求

从 Fetch 规范 §4.8 的 CORS 预检算法出发,逐条拆解简单请求的精确判定条件、OPTIONS 预检的触发规则、Access Control Max Age 的浏览器硬编码上限与跨引擎行为差异,覆盖 Authorization 头 + application/json 的组合触发场景与工程中的预检减少策略。

前端框架2025/06/307 分钟阅读

微信小程序登录体系的三种模式:从 code2Session 到手机号授权的完整状态机

以 wx.login 获取临时 code → 后端 code2Session 换取 openId/session_key 为核心链路,拆解静默登录、用户授权登录、手机号快速验证三种模式的时序差异与适用边界,覆盖 session_key 过期 → 重新 login 的静默刷新、token 双令牌轮换的持久化方案、以及 uni-app 跨端封装下各平台登录 API 的差异处理。

工具与部署2024/01/252 分钟阅读

Taro 开发环境 prebundle 路径异常排查

Taro 预编译模式下入口文件依赖路径缺少 prebundle 前缀的问题排查,涉及 webpack 版本差异与多平台编译产物不一致。

前端框架2023/12/013 分钟阅读

Vue3 新特性

Composition API、setup/script setup、Teleport 机制、Suspense 渲染流程、Fragment 与 Proxy 响应系统的实际用法与内部标记。

LeetCode2023/05/241 分钟阅读

49. 字母异位词分组

排序后字符串作为 key 的哈希表分组,时间复杂度 O(N·KlogK)。

LeetCode2023/05/171 分钟阅读

2692. 使对象不可变

递归 Object.freeze 实现深度不可变对象,阻止任意层级的属性修改。

LeetCode2023/05/161 分钟阅读

280. 摆动排序

奇数位 ≥ 相邻两侧的贪心交换策略,一次遍历 O(N)。

LeetCode2023/04/281 分钟阅读

2803. 生成器函数

手写 Generator 函数的迭代控制逻辑,理解 yield 的暂停/恢复机制。

LeetCode2023/04/271 分钟阅读

2823. 深度对象筛选

递归筛选对象中满足条件的属性,保留嵌套结构中符合条件的子树。

LeetCode2023/03/031 分钟阅读

2777. 日期范围生成器

实现日期范围的惰性生成器,按天/月/年步进生成区间内日期。

LeetCode2023/03/021 分钟阅读

2636. Promise 对象池

实现并发限制的 Promise 调度器,最多同时执行 n 个异步任务。

LeetCode2023/02/151 分钟阅读

2690. 无穷方法对象

实现无限链式调用的方法对象,每次返回 this 以支持任意深度的方法链。

LeetCode2022/12/301 分钟阅读

2805. 自定义间隔

实现自定义定时器,支持动态调整间隔与手动停止。

LeetCode2022/12/271 分钟阅读

2755. 深度合并两个对象

递归合并两个对象的属性,处理键冲突时的覆盖规则与嵌套对象的深度合并。

LeetCode2022/12/141 分钟阅读

128. 最长连续序列

哈希表 + 连续序列起点的 O(N) 判定策略,避免排序依赖。

LeetCode2022/12/091 分钟阅读

2700. 两个对象之间的差异

递归比较两个对象/数组,返回包含差异类型(新增/删除/修改)的结构化结果。

LeetCode2022/12/061 分钟阅读

2632. 柯里化

手写 curry 函数,支持每次传任意数量参数,参数数达标后执行原函数。

LeetCode2022/11/281 分钟阅读

2676. 节流

手写 throttle 函数,确保连续调用中至少每隔 n 毫秒执行一次。

LeetCode2022/09/071 分钟阅读

2822. 对象反转

反转对象的键值对映射,处理值不可序列化时的边界情况。

LeetCode2022/08/121 分钟阅读

2796. 重复字符串

实现字符串重复拼接,覆盖空字符串与大数据量边界。