<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[程序员蜡笔熊的博客]]></title><description><![CDATA[我爱这生活。]]></description><link>https://blog.youkuaiyun.com/m0_47553675</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; m0_47553675]]></copyright><item><title><![CDATA[transition 写在 CSS 变量上为什么不生效？给变量补张「类型身份证」]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/165237063</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/165237063</guid><author>m0_47553675</author><pubDate>Sun, 13 Sep 2026 15:58:28 +0800</pubDate><description><![CDATA[CSS 变量默认不支持动画插值，因值为无类型字符串。通过 @property 注册并声明 syntax 类型（如 <number>、<color>），可使变量参与过渡与动画。未注册变量导致秒跳，initial-value 缺失则规则被静默丢弃，'*' 语法虽兼容但不可插值。注册后支持渐变、滚动进度驱动等高级效果，性能需谨慎评估。]]></description><category></category></item><item><title><![CDATA[告别scroll 监听：CSS 滚动驱动动画，主线程堵死也仍跟手]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164852960</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164852960</guid><author>m0_47553675</author><pubDate>Thu, 10 Sep 2026 15:20:42 +0800</pubDate><description><![CDATA[CSS滚动驱动动画无需JS监听scroll事件，通过animation-timeline: scroll()或view()将动画进度与滚动位置直接绑定，实现零主线程负担的流畅动效。实测表明，即使主线程被阻塞1.5秒，CSS动画仍能精准同步滚动位置，而基于事件的JS方案则会丢失事件、卡顿甚至瞬跳。其核心优势在于进度计算由合成器线程完成，不受主线程影响，真正实现“滚动即播放”。]]></description><category></category></item><item><title><![CDATA[Vite 8 换芯实测：Rolldown 替掉双引擎，构建快 3.19 倍]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164629699</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164629699</guid><author>m0_47553675</author><pubDate>Tue, 08 Sep 2026 18:53:34 +0800</pubDate><description><![CDATA[Vite 8 正式将 Rolldown 设为默认打包引擎，取代 esbuild+Rollup 双架构，构建耗时降低 3.19 倍，产物略小且 tree-shaking 依旧彻底；Rolldown 性能与 esbuild 同级，但单引擎消除了双引擎结构性损耗，并统一插件体系，minifier 也换为 oxc。]]></description><category></category></item><item><title><![CDATA[CSS 锚点定位实测：零 JS 实现气泡跟随，自动翻转很香但暗藏 3 个致命坑]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164455556</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164455556</guid><author>m0_47553675</author><pubDate>Mon, 07 Sep 2026 12:09:35 +0800</pubDate><description><![CDATA[用 anchor-name 与 position-anchor 声明锚点，浏览器自动算位置，滚动缩放无需JS，实测贴边居中偏差0.0px。注意：anchor() 写错属性或锚点名不存在会静默失效；popover隐式锚点Chromium尚未实现，需显式命名并加 inset:auto；配合 position-try-fallbacks 可自动溢出翻转。]]></description><category></category></item><item><title><![CDATA[Bun 从 Zig 逃到 Rust：50 万行代码 11 天搬完，另一个团队却反着跑]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164399766</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164399766</guid><author>m0_47553675</author><pubDate>Sat, 05 Sep 2026 14:18:54 +0800</pubDate><description><![CDATA[Bun用AI花16.5万美元、11天将50万行Zig代码重写为Rust，以解决大量use-after-free和内存泄漏问题。同期Roc团队花487天人工将30万行Rust编译器逆向重写为Zig，却称Zig版本bug更少。核心冲突在于：Rust靠编译器保证内存安全，Zig依赖人工与defer；Bun因GC与手动内存并存致bug丛生，而异步模型（栈式协程→无栈Future）的迁移是AI最大考验。]]></description><category></category></item><item><title><![CDATA[z-index: 99999 输给 z-index: 2？原生弹窗的 Top Layer 排位战：后进者居上、看得见却点不着]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164357929</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164357929</guid><author>m0_47553675</author><pubDate>Fri, 04 Sep 2026 07:57:51 +0800</pubDate><description><![CDATA[showModal()与showPopover()是进入顶层唯一途径，z-index在此失效；父级transform会创建新层叠上下文，导致子元素99999输给外部z-index:2；模态dialog才受顶层保护，非模态仅普通定位；最反直觉的是先开模态框后弹气泡时，气泡视觉在上层却被backdrop截断指针事件，“看得见点不着”。另有表单自动关闭、焦点管理、::backdrop样式等原生特性可供利用。]]></description><category></category></item><item><title><![CDATA[告别 z-index 内战，原生 popover 属性白送 Top Layer、自动关闭与焦点管理]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164326640</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164326640</guid><author>m0_47553675</author><pubDate>Thu, 03 Sep 2026 10:35:08 +0800</pubDate><description><![CDATA[Popover API解决了弹层组件四大痛点：层级、外点关闭、ESC关闭、焦点管理。它默认是auto，弹层放在顶层，z-index压不住；点外部和ESC自动关闭；焦点自动回退到触发按钮。自动模式会互斥其他气泡，嵌套祖先豁免。打开方式有四种，但open属性无效。与popovertarget相比，commandfor后来居上胜出。]]></description><category></category></item><item><title><![CDATA[button按钮原生开关弹窗，零 JS 搞定80%交互场景]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/164295118</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/164295118</guid><author>m0_47553675</author><pubDate>Wed, 02 Sep 2026 12:37:01 +0800</pubDate><description><![CDATA[内容是关于HTML Invoker Commands API的实测，包括属性、命令、事件行为等。摘要需要简洁概括，不超过150字。我们需要提炼核心信息：命令API是什么、关键特性、浏览器支持和注意事项。注重要点：commandfor/command属性简化弹窗控制，减少JS，浏览器处理焦点和遮罩，支持dialog和popover，命令不冒泡，自定义命令需--前缀，show命令不支持等]]></description><category></category></item><item><title><![CDATA[DeepSeek V4 Pro，用前端项目跑了一遍，Agent 能力暴涨8倍是真的吗？]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163750737</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163750737</guid><author>m0_47553675</author><pubDate>Fri, 14 Aug 2026 12:31:30 +0800</pubDate><description><![CDATA[摘要：DeepSeek V4 Pro 低调发布，性能大幅提升 DeepSeek 昨晚悄然推出 V4 Pro，未做任何宣传，但核心指标惊人： 1M 上下文 + 384K 输出，支持长代码分析与生成； DeepSWE 评测暴涨 8.6 倍（7.3 → 62.7），Terminal Bench 达 87.9 分，接近 Claude Fable 5； 价格极低，输入/输出成本仅为 Claude 的 1/36 和 1/90。 实测 前端场景（React 组件生成、Bug 修复等）表现优异： 生成完整 TypeScri]]></description><category></category></item><item><title><![CDATA[Node.js 事件循环到底和浏览器差在哪？5 个实验了解 libuv 真实调度]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163733056</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163733056</guid><author>m0_47553675</author><pubDate>Thu, 13 Aug 2026 20:03:55 +0800</pubDate><description><![CDATA[本文对比了浏览器和Node.js事件循环的差异，并通过实验验证了Node.js事件循环的执行顺序。浏览器采用任务队列和微任务队列机制，而Node.js基于libuv库实现，包含6个阶段（timers、pending callbacks、idle/prepare、poll、check、close callbacks）。实验结果显示： 在非I/O环境下，setTimeout和setImmediate的执行顺序不确定，取决于系统性能； 在I/O回调中，setImmediate总是先于setTimeout执行； N]]></description><category></category></item><item><title><![CDATA[async/await 到底是不是 Generator 的语法糖？手写执行器，Babel 编译产物里藏着答案]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163513711</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163513711</guid><author>m0_47553675</author><pubDate>Thu, 06 Aug 2026 16:26:51 +0800</pubDate><description><![CDATA[本文深入探讨了Generator与async/await的关系及其实现原理。主要内容包括： 自动执行器：通过分析手动调用next()的痛点，展示了如何实现自动执行器来自动处理Generator的异步流程，达到类似async/await的效果。 Babel编译机制：通过实验解析async/await的底层实现，发现其并非简单的Generator语法糖，而是基于Promise和特殊的状态机实现。 实战应用：提供了Generator在条件分支异步流程中的实际应用示例，并对比了Generator+自动执行器与原生a]]></description><category></category></item><item><title><![CDATA[Rspack 2.0 正式发布 — 前端构建工具格局再变天]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163335358</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163335358</guid><author>m0_47553675</author><pubDate>Thu, 30 Jul 2026 14:19:19 +0800</pubDate><description><![CDATA[Rspack 2.0 发布，性能翻倍，构建速度提升显著，10000 组件项目缓存构建从 5.6s 降至 1.4s。依赖大幅精简，@rspack/dev-server 依赖从 192 个减至 1 个，安装体积减少 90%+。核心包转为纯 ESM，支持现代特性如 RSC 和 import defer。此外，优化了 tree shaking 能力，支持 CommonJS require 解构和模块联邦 tree shaking。Rspack 2.0 不再局限于“更快的 webpack”，开始形成自己的技术路线。]]></description><category></category></item><item><title><![CDATA[Kimi K3 开源实测：扒开 MoE 架构，896 个 expert 怎么选 16 个？]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163281520</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163281520</guid><author>m0_47553675</author><pubDate>Tue, 28 Jul 2026 20:35:24 +0800</pubDate><description><![CDATA[摘要： 月之暗面（Moonshot AI）开源了全球首个3T级参数大模型Kimi K3，采用混合专家（MoE）架构，总参数量2.8万亿，单次激活约1040亿参数，支持100万token上下文窗口。其核心优势包括： 前端能力突出：在代码生成评测中超越Claude和GPT同期版本； 低迁移成本：API兼容OpenAI规范，前端开发者可快速适配； 超长上下文：支持全项目级代码分析与重构。 技术亮点： MoE路由机制：896个专家中动态选择16个处理输入，显著降低计算量； 硬件门槛：权重文件达1560GB，普通设备]]></description><category></category></item><item><title><![CDATA[MCP 7/28 最大改版实测：扒开真实 HTTP 请求，无状态化到底改了什么]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163261794</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163261794</guid><author>m0_47553675</author><pubDate>Tue, 28 Jul 2026 09:58:53 +0800</pubDate><description><![CDATA[2026年7月28日，MCP协议发布重大修订版本，核心变化是从有状态架构转为完全无状态设计。旧版本依赖initialize握手和会话ID维护状态，导致分布式环境存在负载均衡受限、水平扩展复杂等痛点。新版本移除会话机制，每个请求自包含完整上下文，支持任意实例处理任意请求，显著提升了扩展性和可用性。实测显示，新版协议简化了请求流程，无需握手即可直接调用工具，更适应云原生架构需求。这一变革将影响MCP服务的部署架构、路由方式和缓存策略，推动AI工具调用协议向更高性能演进。]]></description><category></category></item><item><title><![CDATA[Generator 到底暂停了什么？扒开 Babel 编译产物，暂停的真相藏在一个 switch 里]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163250992</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163250992</guid><author>m0_47553675</author><pubDate>Mon, 27 Jul 2026 20:55:21 +0800</pubDate><description><![CDATA[本文深入解析了 Generator 函数的底层实现机制。从 Babel 编译角度，Generator 被转化为由 switch 语句构成的状态机，每个 yield 对应一个 case 分支，通过 context 对象保存执行状态。从 V8 引擎视角，Generator 的挂起恢复依赖栈帧切换和上下文保存。文章通过状态机模型揭示了 Generator 暂停/恢复的本质——将函数分割为多个执行片段，通过 next() 调用驱动状态流转，实现协程式控制。这种机制为异步编程提供了同步化书写的基础，是理解 async]]></description><category></category></item><item><title><![CDATA[React Compiler 用 Rust 重写了，编译提速 10 倍——手写 useMemo 的日子到头了]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163242633</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163242633</guid><author>m0_47553675</author><pubDate>Mon, 27 Jul 2026 14:52:37 +0800</pubDate><description><![CDATA[前端工具链加速：React Compiler 转向 Rust 提升性能 最近，Meta 将 React Compiler 从 TypeScript 重写为 Rust，核心逻辑速度提升10倍。这延续了微软将 TypeScript 编译器用 Go 重写后速度暴增的趋势，表明前端工具链正在从 JavaScript 生态迁移到性能更强的语言。 关键点： 性能提升：Rust 版本核心转换逻辑快10倍，集成到Rspack等工具后提速7-13倍 开发体验：自动处理memoization，减少手动优化代码的负担 架构优化：]]></description><category></category></item><item><title><![CDATA[ES2026 落地了什么？两个真上线的特性 + 两个被毙的，一次讲清楚]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163137376</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163137376</guid><author>m0_47553675</author><pubDate>Thu, 23 Jul 2026 18:30:20 +0800</pubDate><description><![CDATA[ES2026 新特性解析：Temporal API 与 using 语法正式加入 摘要：ES2026 确认包含 Temporal API 和 using 语法两项重大更新。Temporal API 历经9年开发，彻底重构日期时间处理，提供类型分离设计（PlainDate/ZonedDateTime等），解决 Date 对象的时区混乱、月份0基等问题。using 语法实现显式资源管理，自动释放文件/数据库连接等资源。而 Record & Tuple 提案已被撤回，管道运算符仍停留在 Stage 2 阶段。开发]]></description><category></category></item><item><title><![CDATA[Google A2UI 协议：AI Agent 学会“造界面“了，前端工程师该慌吗？]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163085740</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163085740</guid><author>m0_47553675</author><pubDate>Tue, 21 Jul 2026 20:37:52 +0800</pubDate><description><![CDATA[Google开源A2UI项目：让AI Agent生成可交互界面 2025年12月，Google悄然推出A2UI（Agent-to-User Interface）开源项目，旨在解决传统AI Agent仅能输出文本的局限，使其能直接生成动态交互界面。其核心是通过JSON协议描述UI组件（如日期选择器、按钮等），由客户端渲染执行，实现“AI描述界面，终端绘制界面”的分离架构。 技术亮点： 安全高效：采用受限组件库（如Text、Button等18种基础组件），避免执行任意代码风险； 流式渲染：支持界面逐块生成，优化]]></description><category></category></item><item><title><![CDATA[TypeScript 7.0 编译器用 Go 重写，速度暴增10倍——背后到底做了什么？]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163053926</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163053926</guid><author>m0_47553675</author><pubDate>Mon, 20 Jul 2026 19:58:04 +0800</pubDate><description><![CDATA[TypeScript 7.0 编译器用 Go 重写，速度暴增10倍——背后到底做了什么？]]></description><category></category></item><item><title><![CDATA[事件循环到底在循环什么？5 道面试题拆透宏任务与微任务的执行顺序]]></title><link>https://blog.youkuaiyun.com/m0_47553675/article/details/163017143</link><guid>https://blog.youkuaiyun.com/m0_47553675/article/details/163017143</guid><author>m0_47553675</author><pubDate>Sun, 19 Jul 2026 12:34:00 +0800</pubDate><description><![CDATA[事件循环核心机制解析 摘要：本文深入解析JavaScript事件循环机制，通过调用栈和任务队列的分层模型，揭示异步代码执行顺序的关键原理。重点拆解宏任务（setTimeout等）与微任务（Promise等）的执行优先级差异：每个宏任务执行后必须清空微任务队列，这一特性解释了为何Promise回调优先于setTimeout执行。通过5道典型面试题的逐层分析，展示了async/await的微任务转换机制，并纠正了常见的16.67ms渲染间隔误区，强调渲染实际取决于VSync信号和主线程空闲状态的协同。文章最后提]]></description><category></category></item></channel></rss>