70. 在开发中，你遇到解决不了的问题你该如何处理？

69期问题及答案

1. React Fiber它的目的是解决什么问题？

React Fiber 是 React 库中的一种用于虚拟 DOM 渲染和协调的重新实现机制。它的主要目的是提高渲染性能和用户界面的交互性，使 React 应用更具响应性。

React Fiber 的核心思想是实现一种增量式渲染，将渲染任务分割成多个小任务，使得浏览器有机会在执行这些小任务的间隙进行其他操作，如处理用户输入、动画等。这种方式可以避免长时间的渲染阻塞，从而提高用户体验。

以下是 React Fiber 的一些关键概念和特点：

1. Fiber 节点： 在 React Fiber 中，虚拟 DOM 节点被称为 Fiber 节点。每个 Fiber 节点代表了组件树中的一个组件或 DOM 元素。

2. 调度和协调： React Fiber 使用一种优先级调度算法，将渲染任务分成不同的优先级，使得 React 能够在每个渲染任务之间进行调度和切换。这允许 React 根据任务的优先级来决定何时中断任务、切换任务和恢复任务。

3. 增量更新： Fiber 的增量更新机制允许 React 将一个大的渲染任务分解成多个小任务，并将其分散执行。这样浏览器在执行小任务的间隙可以执行其他操作，从而减少页面渲染造成的阻塞。

4. 时间切片： React Fiber 使用时间切片技术，将渲染任务分解成一系列时间片。每个时间片都有一个时间限制，在限制内尽可能多地执行工作，然后将控制权交还给浏览器，以响应其他事件。

5. 任务优先级： Fiber 引入了不同优先级的任务，如同步（Sync）、批量（Batch）、动画（Animation）等。通过设置不同的优先级，可以在不同情况下保障用户界面的响应性和流畅性。

6. 中断和恢复： Fiber 允许中断正在进行的渲染任务，并在稍后恢复。这种机制使得 React 可以更灵活地响应用户输入和其他高优先级任务。

总之，React Fiber 是 React 库中的一种重要机制，旨在提高渲染性能和用户界面的响应性。通过增量式渲染、任务优先级和时间切片等技术，React Fiber 使得应用程序在处理渲染任务时更加灵活，从而提高用户体验并减少界面卡顿。

2. sass和less对比，你通常会用什么？

SCSS（Sassy CSS）和 Less 都是流行的 CSS 预处理器，它们在语法、功能和特性上有一些相似之处，但也存在一些区别。下面是对 SCSS 和 Less 进行的一些对比，以便你更好地了解它们：

SCSS 和 Less 的对比：

1. 语法：

• SCSS 使用类似于传统 CSS 的大括号和分号的语法，使得它在书写上更接近于普通 CSS。

• Less 使用缩进式语法（类似于 Sass），但也支持类似 CSS 的大括号和分号。

嵌套规则：

• 无论是 SCSS 还是 Less，都支持在选择器中嵌套其他选择器和属性，从而更清晰地表示层次关系。

变量：

• SCSS 和 Less 都支持变量，用于存储并复用样式中的值。

• SCSS 使用 $ 符号来声明变量，例如 $color: red;。

• Less 使用 @ 符号来声明变量，例如 @color: red;。

混合（Mixins）：

• 混合是一种将一组样式属性捆绑到一个名称中，然后在其他地方进行重用的机制。

• SCSS 使用 @mixin 关键字来定义混合，然后通过 @include 在样式中使用它。

• Less 使用 .mixin 命名规则来定义混合，然后通过 .mixin(); 在样式中使用它。

导入：

• SCSS 和 Less 都支持使用 @import 导入其他样式文件。

• 在 Less 中，@import 会在客户端生成额外的 HTTP 请求，而 SCSS 会将导入的样式合并到一个文件中。

运算：

• SCSS 和 Less 都支持进行数学运算，如加法、减法等，用于计算样式的值。

选择哪个？

选择使用 SCSS 还是 Less 取决于你的偏好、项目需求以及团队的习惯。SCSS 的语法更接近于传统的 CSS，对于那些已经熟悉普通 CSS 的开发者来说，上手可能更容易。然而，Less 也是一个功能强大的预处理器，尤其适合那些喜欢缩进式语法的开发者。

无论选择哪个，重要的是要根据项目需求、团队的技术栈和个人喜好来做出决策。它们都能帮助你更有效地管理和组织样式，提高开发效率。

3. 状态管理的精髓是什么？为什么需要状态管理？状态管理如何持久化？

状态管理的精髓在于有效地管理应用程序中的数据，并确保不同组件之间的数据共享和同步。状态管理的核心概念是将应用程序的状态集中管理，使得状态变化能够被轻松追踪、管理和通知给相关组件，从而实现更好的代码组织、可维护性和可扩展性。

为什么需要状态管理？

1. 共享状态： 在大型应用中，多个组件可能需要访问和共享相同的数据。状态管理可以避免通过多层嵌套的 props 传递数据，使得数据共享更简单。

2. 组件解耦： 通过状态管理，组件之间可以更松散地耦合。每个组件只需要关注自己的业务逻辑，而不需要关心如何获取和更新数据。

3. 避免 prop drilling： 当组件嵌套层级较深时，通过 props 传递数据会变得繁琐。状态管理可以避免这种情况，让数据在整个应用中流动。

4. 跨组件通信： 在一些情况下，不同组件之间需要进行通信，例如触发一个组件的操作会影响另一个组件。状态管理可以帮助实现这种跨组件的通信。

状态管理如何持久化？ 状态管理通常是在内存中管理的，但在某些情况下，你可能需要将状态持久化，以便在应用程序关闭后仍然保留数据。这通常涉及将状态数据保存在本地存储、数据库或服务器上。

以下是一些持久化状态的方法：

1. 本地存储： 使用浏览器提供的本地存储机制，如 localStorage 或 sessionStorage，将状态数据存储在用户的浏览器中。这适用于较小的数据量。

2. Cookie： 使用 Cookie 作为持久化状态的一种方式。然而，由于 Cookie 有大小限制，它更适合存储较小的数据或标识符。

3. IndexedDB： IndexedDB 是浏览器提供的一种更强大的客户端数据库，适用于存储大量结构化数据。

4. 远程服务器： 如果需要跨设备同步状态数据，可以将数据存储在远程服务器上，并通过网络请求进行读写操作。

5. 专用数据持久化库： 有一些专门用于前端状态持久化的库，如 Redux Persist。这些库可以帮助你将应用程序状态自动存储在本地存储或其他持久化方式中。

总之，状态管理的持久化涉及将应用程序状态数据存储在不同的持久化媒介中，以便在应用程序关闭后仍然能够恢复数据。选择持久化方式需要根据数据大小、安全性和跨设备同步等因素进行权衡。

70期

1. 在开发中，你遇到解决不了的问题你该如何处理？

2. 在开发组件时，你认为请求数据的部分是放到组件里面，还是在组件外面通过props传进来，2种区别是什么？

3. 什么是长链接，什么是短链接？

上面问题的答案会在第二天的公众号推文中公布，大家可以关注公众号：程序员每日三问，第一时间获得推送内容。

学习不打烊，充电加油只为遇到更好的自己,每天早上9点纯手工发布面试题（死磕自己，愉悦大家） 希望大家在这浮夸的程序员圈里保持冷静，每天坚持花20分钟来学习与思考，在千变万化，类库层出不穷的今天，不要等到找工作时才狂刷题，提倡每日学习。