Astro Themes by Whono

:::info[简单比喻：电话簿查询] 想象一下你要找一个你不太熟悉的同事“张三”的电话号码： **检查手机通讯录**：你先在自己的手机通讯录里找“张三”。（**本地 DNS 缓存**） **询问办公室前台**：如果通讯录里没有，你会问公司…

**关键渲染路径** 指的是浏览器将 HTML、CSS 和 JavaScript 转换为用户在屏幕上所能看到的像素内容所经历的一系列步骤。 这个过程是“关键”的，因为它直接决定了**首屏内容**的加载速度。优化关键渲染路径的目的就是尽可能快…

当用户在浏览器地址栏输入 URL 并按下回车，一场跨越网络和计算机内部的复杂协作便拉开了序幕。 DNS 查询 旅程始于 **DNS 查询**，浏览器需要将用户输入的域名（如 google.com）解析为服务器的 IP 地址。这个过程会依次查…

**Rollup 是一个 JavaScript 模块打包器**。它的主要工作是将你编写的、分散的、多个小的 JavaScript 文件（或模块），按照它们的依赖关系，打包成一个或少数几个优化后的、可供浏览器高效执行的文件。 为什么需要打包？…

JavaScript 是一种**具有自动垃圾回收**的语言。这意味着开发者通常不需要手动管理内存，JavaScript 引擎（如 V8）会自动找出不再使用的变量并释放它们占用的内存。 垃圾回收的核心思想是：**确定哪些“对象”已经“不可达”…

JavaScript 是一种面向对象语言，是一种基于原型的语言，每个对象拥有一个原型对象。 原型链 **原型链** 是 JavaScript 中实现继承的机制。每个对象都有一个指向另一个对象的内部链接，这个被指向的对象就是它的**原型**。…

一句话概括 当两个或多个垂直相邻的块级元素的 margin 相遇时，它们会合并（折叠）成一个 margin。这个合并后的 margin 的大小等于发生折叠的 margin 中的最大值。 这个行为**只发生在垂直方向**（即上下），水平方向的…

一个元素的“最终宽度”是由多个属性共同作用的结果，而一切都始于 属性，它决定了元素的宽度和高度如何计算。 的值 有两个主要值： （默认值） 宽度和高度只包括**内容**区域。 你设置的 和 就是内容区（content）的尺寸。 **内边距（…

CSS 选择器优先级计算规则 CSS 选择器优先级通过权重系统计算，权重由四个组成部分（a, b, c, d）表示： 优先级权重组成 **a**: 是否使用内联样式（1 或 0） **b**: ID 选择器的数量 **c**: 类选择器、属…

JavaScript 事件循环(Event Loop)理解 JavaScript 是一种单线程语言，所谓单线程，就是**一次只做一件事，按顺序执行**。而要在单线程的世界里实现流畅的异步操作，必须理解事件循环（ ）机制。 事件循环机制并非 …

和 的响应式系统存在一些区别，本篇主要介绍 ，可以移步Vue2 和 Vue3 区别。 Vue 和 React 在处理状态到视图的更新上，走了两条截然不同的技术路线，这体现了它们在设计哲学上的根本差异。 Vue3 的 Proxy Vue 采用…

API 介绍 Intersection Observer API 提供了一种**异步**观察目标元素与祖先元素或顶级文档视口（viewport）**交叉状态**（即“相交”）的方法。简单来说，它可以非常高效地**监听一个元素是否进入了可视区…