归档

梳理浏览器 Event Loop 中宏任务与微任务的执行规则、嵌套顺序、async/await 行为、性能陷阱与调试方法。

Js 是一门单线程的语言，这是因为它运行在浏览器的渲染主线程中，而渲染主线程只有一个。

JavaScript单线程与异步处理：浏览器渲染主线程负责解析HTML、CSS、执行JS等，同步执行易阻塞。为避免卡顿，浏览器采用异步处理，将计时器、网络请求等任务交由其他线程处理，完成后加入消息队列，主线程调度执行，确保流畅运行。

探索如何避免在输入时切换输入法导致的误输入问题。本文介绍了HTML结构和JavaScript逻辑，通过监听输入法事件，实现在用户完成输入后触发搜索功能，提升用户体验。

实现逐字显示文字效果，通过CSS动画和JavaScript结合。HTML创建文本容器，CSS设置居中显示，JavaScript控制字符逐个显示，间隔500毫秒。可调整显示速度和文本内容。

本文深入探讨了从用户在浏览器输入URL到页面展示的完整流程，涉及网络请求、浏览器进程、渲染进程等关键环节。文章首先回顾了浏览器的进程架构，然后详细分析了用户输入URL后的导航过程，包括URL请求、重定向、响应数据类型处理等步骤。接着，讨论了渲染进程的准备和文档提交阶段，最后概述了页面渲染阶段。通过本文，读者可以全面了解浏览器内部工作机制，为前端开发和性能优化提供理论基础。

本文深入探讨了JavaScript中的XMLHttpRequest对象，解释了其在不刷新页面的情况下与服务器交换数据的能力。文章首先介绍了JavaScript操作DOM的方法，然后详细阐述了XMLHttpRequest的基本概念、工作流程、使用方式以及回调函数的同步与异步执行。进一步，文章探讨了XMLHttpRequest背后的实现机制，包括创建请求、配置请求信息、发送请求和处理响应。指出了使用X

本文深入探讨了JavaScript中`requestAnimationFrame`（简称rAF）与`setTimeout`在实现动画时的性能差异。文章首先介绍了浏览器渲染进程的任务调度系统，解释了rAF相较于`setTimeout`的优势在于其能够与浏览器的刷新周期同步，从而实现更流畅的动画效果。接着，文章回顾了Chromium任务调度系统的演变，从单消息队列的队头阻塞问题，到引入高优先级队列，再

`requestAnimationFrame`是浏览器提供的API，用于创建平滑动画效果。它通过控制帧率、优化可视性、利用合成器线程和协同帧延，确保动画与浏览器重绘过程同步。使用时传入回调函数，该函数会在下一次重绘前被调用，并接收时间戳参数。与`setTimeout`相比，`requestAnimationFrame`更高效、精确，适合动画和高频更新场景。

深入探讨浏览器页面主线程的工作原理，包括消息队列和事件循环系统。首先介绍单线程处理任务的基本概念，然后通过C++代码示例，逐步引导读者理解如何在线程运行中处理新任务，并引入事件循环机制。接着，文章讨论了如何通过消息队列实现线程间的任务传递，以及如何处理来自其他进程的任务。此外，还分析了消息队列中任务类型的多样性，以及如何安全退出页面主线程。指出使用单线程的缺点，并提供实践建议，帮助开发者优化Web

探索JavaScript异步编程的革新，从Promise到async/await，深入理解生成器、协程及V8引擎实现机制。本文提供详细的技术解析和代码示例，助力开发者掌握ES7的异步编程模式，优化代码结构，提升编程效率。

前面我们讲到了每个渲染进程都有一个主线程，并且主线程非常繁忙，既要处理DOM，又要计算样式，还要处理布局，同时还需要处理JavaScript任务以及各种输入事件。要让这么多不同类型的任务在主线程中有条

Optional chaining 是一个现代 JavaScript 语法特性，允许开发者在读取对象内部嵌套属性时安全地处理 undefined 或 null 值。这种语法通过 ?. 操作符实现，可以

1. jsx-dev-runtime.js jsx export { jsxDEV } from "./jsx/ReactJSXElement"; 2. ReactJSXElement.js jsx

“双缓存” 是一种常见的图形处理技术，用于在图像渲染中实现平滑的、无闪烁的更新效果。它通过使用两个缓冲区（即两块内存区域）来完成。其中一个缓冲区用于显示图像，而另一个缓冲区则用于在后台进行图像的更新和

在 JavaScript 中是使用构造两数来新建一个对象的，每一个构造函数的内部都有一个 prototype 属性，它的属性值是一个对象，这个对象包含了可以由该构造西数的所有实例共享的属性和方法。 当

1. var 声明作用域 var 定义的变量，没有块的概念，可以跨块访问，不能跨函数访问

async/await 其实是 Generator 的语法糖，它能实现的效果都能用 then 链来实现，它是为优化 then 链而开发出来的。从字面上来看，async 是 “异步” 的简写，await

Fiber 架构是 React 中用于实现虚拟 DOM 的一种算法架构。它的目标是提高渲染性能和用户体验，通过将渲染工作分割成多个小任务，在不阻塞主线程的情况下逐步完成整个渲染过程。

Promise 是异步编程的一种解决方案，它是一个对象，可以获取异步 操作的消息，他的出现大大改善了异步编程的困境，避免了地狱回调， 它比传统的解决方案回调函数和事件更合理和更强大。

Fiber 架构的起源可以追溯到 React 团队在 2017 年提出的一项重大改进计划。在过去的 React 版本中，渲染过程是基于递归的，即组件树的遍历是通过递归函数来完成的。这种方式在大规模复杂

FiberNode（也称为 Fiber 节点）是 React Fiber 架构中的核心概念之一，用于表示组件的层级结构和渲染过程中的任务。

思路 ：React 获取服务器端时间，本质上就是给服务器端发送一个请求，然后从返回数据里面的 headers 里面获取到服务器 date，然后更新服务器时间去格式化，获取服务器时间结束。按秒进行数据

React 使用合成事件（SyntheticEvent）来处理浏览器原生事件的跨浏览器兼容性问题。合成事件是一个封装了原生事件的对象，提供了一致的跨浏览器接口，使您能够在不同浏览器中以一致的方式处理事