睡不着先生

⚡Vite 构建优化全攻略：快，还能更快！ 🧠 为什么 Vite 被称为“下一代前端构建工具”？因为它构建速度远超webpack

⏱ requestIdleCallback 与 requestAnimationFrame 实战指南：掌控任务调度的两把利刃！ 🧠 基本概念：这两个 API 做什么的？ API 作用 适合任务类型 r

🧲 CSS Scroll Snap 实战指南：让滚动体验“自动对齐” ✨ 什么是 Scroll Snap？ Scroll Snap 是一套 CSS 属性组合，用于让滚动元素在滚动结束时自动对齐到特定子

⚙️ 前端环境变量与配置管理实战指南：从开发到上线都不踩坑！ 📦 什么是环境变量？ 环境变量（Environment Variables）是在构建或运行时注入到应用中的配置信息，通常用于区分开发/测试

🚀 前端性能的隐藏杀手锏：用好 preload / prefetch / preconnect 🧠 为什么需要资源预加载？ 资源加载过程是串行的，等请求发生才开始下载，是性能最大瓶颈。

🧊 动画炫酷但卡顿？前端高性能动画实现的实战指南！ ⚙️ 一句话原则：动效看起来是“动”的，浏览器计算尽量是“静”的。

🚰 从小水管到洪流：你真的会用前端 Stream API 吗？ 🎬 引子：什么是 Stream？ Stream（流）是指“按块”处理数据的一种方式，而不是等待整个数据加载完成。

响应式设计一直以来都依赖「媒体查询」来根据视口宽度调整布局。但这并不利于组件复用。现在，`Container Queries`（容器查询）让组件可以根据自身容器大小改变样式，实现“组件级响应式”！

📌 CSS Anchor Positioning：重新定义「锚定定位」的时代来了！用纯 CSS 的方式精确「锚定」任意元素，一次性解决层叠、滚动、居中等定位痛点！