归档

整理三道常见 React 面试题：Hooks 为什么不能写在条件语句里、组件通信方式有哪些、React Fiber 解决了什么问题。重点放在原理、边界和面试表达。

RSC 解决的是真问题，但它给心智模型和生态带来的撕裂，比宣传里说的大得多。

工具链已经 Rust 化，但「工具链用 Rust」和「你要写 Rust」是两回事。

JavaScript 引擎正是利用栈的这种结构来管理执行上下文的。在执行上下文创建好后，JavaScript 引擎会将执行上下文压入栈中，通常把这种用来管理执行上下文的栈称为执行上下文栈，又称调用栈。

HTTP（Hypertext Transfer Protocol）是一种用于在网络上传输超文本数据的协议。它是一种客户端 - 服务器协议，客户端发送请求，服务器返回响应。HTTP 是 Web 的基础，

HTTP 是一种允许浏览器向服务器获取资源的协议，是 Web 的基础，通常由浏览器发起请求，用来获取不同类型的文件，例如 HTML 文件、CSS 文件、JavaScript 文件、图片、视频等。此外，

“在浏览器里，从输入 URL 到页面展示，这中间发生了什么？” 这是一道经典的面试题，能比较全面地考察应聘者知识的掌握程度，其中涉及到了网络、操作系统、Web 等一系列的知识。所以我在面试应聘者时也必

在 上一篇文章 /browser/protocol/http-navigation.html 中我们介绍了导航相关的流程，那导航被提交后又会怎么样呢？就进入了渲染阶段。这个阶段很重要，了解其相关流程能

TCP（Transmission Control Protocol，传输控制协议）是一种面向连接的、可靠的、基于字节流的传输层通信协议，广泛用于互联网中的数据传输。它是 TCP/IP 模型中的核心协议

Hexo Admin 是一个为 Hexo 博客框架提供的一个管理界面，允许用户通过一个比较直观的 Web 界面来写文章和管理博客。若要将使用 Hexo Admin 编辑的博客部署到线上，需要遵循一些标

事件循环（Event Loop）是计算机程序中的一个设计模式，用于处理异步操作，特别是在图形用户界面程序和服务器端应用程序中。事件循环模式通过等待并分派事件或回调函数来驱动程序的执行流程，而不是通过直

HTTP : 是一种无状态的请求 - 响应协议。是互联网上应用最广泛的一种通讯协议，基于 TCP ，可以使浏览器工作效率更为高效，减少网络传输。

TLS（Transport Layer Security，传输层安全协议）三次握手是建立安全层通信的一个过程，它确保了数据在两个通信实体之间的传输是加密和身份验证的。TLS 是一种安全协议，通常用于在

服务端渲染（Server-Side Rendering，简称 SSR）是一种 Web 应用的渲染方式，其中 HTML 是在服务器上生成的，并作为完整页面发送到客户端（通常是浏览器）。客户端然后解析和显

实现一个泛型 DeepReadonly<T ，它将对象的每个参数及其子对象递归地设为只读。

实现泛型 GetReadonlyKeys<T ， GetReadonlyKeys<T 返回由对象 T 所有只读属性的键组成的联合类型。

不使用 Omit 实现 TypeScript 的 Omit<T, K 泛型。

不使用 Pick<T, K ，实现 TS 内置的 Pick<T, K 的功能

不要使用内置的 Readonly<T ，自己实现一个。

实现一个泛型 MyReadonly2<T, K ，它带有两种类型的参数 T 和 K 。

不使用 ReturnType 实现 TypeScript 的 ReturnType<T 泛型。

实现类似 Vue 的类型支持的简化版本。

通过 canvas 先制作图。可以做一个 canvas 背景在生成一个二维码 canvas 图，在将两个 canvas 合成一个图片，然后将图片分享出来。

export function AppUpdate { const appleId = 2021004105638058; let _this = this; let platform = uni.g

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

在 Redis 命令行中，我们可以使用 config set 命令来设置 Redis 的密码。以下是设置密码的代码和注释。

编辑～/.zshrc 增加自定义配置

需要将运行 yml 命名为 docker-compose.yml

To install Maven and JDK Java Development Kit on Ubuntu, you can follow these steps:

使用 dpkg 命令：在终端中运行以下命令来安装.deb 文件：

注意，这条命令可能会提示：

Git 是一个分布式版本控制系统，用于跟踪文件的变化并协作开发。以下是使用 Git 的基本步骤：

1. 设置存储库。

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

需要实现包装方法和获取数据的 hooks

Code-Test

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

npm install -g nrm

nvm\_github

其中，配置参数含义如下:

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

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

webpack 的热更新⼜称热替换（Hot Module Replacement），缩写为 HMR。这个机制可以做到不⽤刷新浏览器⽽将新变更的模块替换掉旧的模块。 原理：

https://badge.fury.io/js/session-cookies

作用：给已有类型取别名 和 定义一个新的类型 搭配联合类型使用

1. DNS 劫持: 输⼊京东被强制跳转到淘宝这就属于 dns 劫持

RESTful 是一种基于 HTTP 协议，通过 URL、HTTP 方法和参数等方式来访问和操作资源的设计风格和架构方法。它是一种轻量级的、高效的、无状态的 Web 服务架构，可以用于设计和开发各种类

npm install hexo-generator-feed -d

CSRF（Cross-Site Request Forgeries） 攻击指的是跨站请求伪造攻击，攻击者诱导用户进入一个第三方网站，然后该网站向被攻击网站发送跨站请求。如果用户在被攻击网站中保存了登录

XSS 攻击指的是跨站脚本攻击，是一种代码注入攻击。攻击者通过在网站注入恶意脚本，使之在用户的浏览器上运行，从而盗取用户的信息如 cookie 等。

1. 不用图片。很多时候会使用到很多修饰类图片，其实这类修饰图片 完全可以用 CSS 去代替。 2. 对于移动端来说，屏幕宽度就那么点，完全没有必要去加载原图浪 费带宽。一般图片都用 CDN 加载，可

懒加载也叫做延迟加载、按需加载，指的是在长网页中延迟加载图片数据，是一种较好的网页性能优化的方式。在比较长的网页或应用中，如果图片很多，所有的图片都被加载出来，而用户只能看到可视窗口的那一部分图片数据

函数防抖是指在事件被触发 n 秒后再执行回调，如果在这 n 秒内事件 又被触发，则重新计时。这可以使用在一些点击请求的事件上，避免因 为用户的多次点击向后端发送多次请求。 函数节流是指规定一个单位时间

当渲染树中部分或者全部元素的尺寸、结构或者属性发生变化时，浏览器会重新渲染部分或者全部文档的过程就称为回流。 下面这些操作会导致回流：

⼀种代码注⼊⽅式，为了与 CSS 区分所以被称作 XSS。早期常⻅于⽹络论坛，起因是⽹站没有对⽤户的输⼊进⾏严格的限制，使得攻击者可以将脚本上传到帖⼦让其他⼈浏览到有恶意脚本的⻚⾯，其注⼊⽅式很简单包

⽤ webpack 优化前端性能是指优化 webpack 的输出结果，让打包的最终结果在浏览器运⾏快速⾼效。

浏览器缓存的全过程涉及了几种不同的缓存机制，主要包括浏览器缓存和 HTTP 协议中定义的缓存控制策略。下面是浏览器缓存的全过程的概览：

GUI 渲染线程是在 GUI 应用程序中负责界面渲染的线程。负责渲染浏览器页面，解析 HTML、CSS，构建 DOM 树、构建 CSSOM 树、构建渲染树和绘制页面；当界面需要重绘或由于某种操作引发回

实现多个标签页之间的通信，本质上都是通过中介者模式来实现的。因为标签页之间没有办法直接通信，因此我们可以找一个中介者，让标签页和中介者进行通信，然后让这个中介者来进行消息的转发。通信方法如下：

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

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

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

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

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

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

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