liangzhenmeng的博客

这里就回到了上面提到的多更新并存的问题：哪些更新优先级高，哪些更新优先级低，哪些更新需要立即去执行，哪些更新可以缓一缓再执行。搜索时，我们应该确保用户输入的内容是能够是实时响应的，而根据输入值搜索出来的内容在渲染更新的时候不应该阻塞用户的输入。通过这种优先级，我们就能判断哪些更新优先执行，哪些更新会被中断滞后执行了。在更新的时候就会依次去执行这个链表上的操作，从而计算出最终的。对于用户体验来讲，紧急更新应该是优先于非紧急更新的。的更新优先级，属于哪个更新任务中的操作。实际上，在每次更新时，更新。

多页面单页面（react vue）；前端路由原理

多页面实际上就是多个html，通过window.location互相跳转。缺点： 每个页面跳转都要刷新，重新加载资源，性能会比较慢好处： SEO友好，适合C端项目，隔离性好，每一个页面是一个独立的项目（每个项目可以由单独的团队负责）单页面：好处：在一个html中进行路由跳转，实际上是通过js去控制的。代表性的框架react/vue。比较适合B端的项目，不考虑SEO。页面跳转不用刷新，性能会好一些，用户体验也能好，可以实现代码复用。缺陷： SEO不好。

jsxs方法就是来生成element对象的，它执行的结果才是element对象。fiber对象是对react执行过程中元素状态的描述，打上一些标记等等。https://babeljs.io/ 可以尝试自己玩一下。worktag是对元素类型的进一步抽象。element对象是对UI的描述。

【代码】（二）【react-router v6】基本用法，带你彻底搞懂前端路由原理、react-router V6带来了什么。

深入理解React 时间切片、Fiber架构

程序中的所有数在计算机内存中都是以二进制的形式储存的。位运算就是直接对整数在内存中的二进制位进行操作。比如。

开篇第一句: useLayoutEffect 可能会影响性能。尽可能使用 useEffect。useLayoutEffect 是 useEffect 的一个版本，在浏览器重新绘制屏幕之前触发。

Hoc、render props和hook都是为了解决代码复用的问题，但是hoc和render props都有特定的使用场景和明显的缺点。hook是react16.8更新的新的API，让组件逻辑复用更简洁明了，同时也解决了hoc和render props的一些缺点。

当this.setState()被调用时，React会重新调用render方法来重新绘制UI。

组件是react的最小代码片段，无论函数组件还是类组件 在使用方式 和 最终呈现效果是一致的类组件可以用函数组件重构，同样函数组件也可以用类组件重构（并不推荐），在现代浏览器中闭包 和 类的性能只有在极端场景下才会有差异，所有认为基本一致差异从心智模型上分析，类组件是面向对象编程，核心概念是 继承 和 生命周期； 类组件的内核是函数式编程，主打immutable、没有副作用、引用透明（类中的this有很多自带属性，相对不透明）等之前，在使用场景，如果需要生命周期钩子，则首推类组件

Suspense的内部原理都是基于并发的，可想而知在这次更新中并发的重要性。但是，并发究竟是什么？React团队引入并发又是为了解决哪些问题呢？它到底是如何去解决的呢？前面提到的React18新特性与并发之间又有什么关系呢？相信大家在看官方文档或者看其他人描述React新特性时，或多或少可能会对以上几个问题产生疑问。因此，本文将通过分享并发更新的整体实现思路，来帮助大家更好地理解React18这次更新的内容。

forwardRef(render)用法详解，使用场景，单层传递、多层传递、命令式句柄 useImperativeHandle等。render 函数用法将 DOM 节点暴露给父组件在多个组件中转发 ref暴露命令式句柄而非 DOM 节点疑难解答我的组件使用了 forwardRef，但是它的 ref 总是为 null

事件是用户操作网页时发生的交互动作，比如 click/move， 事件除了用户触发的动作外，还可以是文档加载，窗口滚动和大小调整。事件被封装成一个 event 对象，包含了该事件发生时的所有相关信息（ event 的属性）以及可以对事件进行的操作（ event 的方法）

首先，useCallback适用于纯函数，即函数的输入和输出完全确定，不会受到外部环境的影响。最后，使用useCallback时，需要确保缓存的函数能够在组件的生命周期内保持稳定。而使用useCallback来缓存状态更新函数，可以确保在多次更新时，只需调用一次缓存内的函数，从而提高性能。最后，在使用useCallback时，需要确保缓存的函数能够在组件的生命周期内保持稳定，否则可能会导致意外的行为。在React中，useCallback是一个强大的Hook，它允许我们在组件中缓存函数，从而提高性能。

React 没有特殊的语法来编写条件语句，因此你使用的就是普通的 JavaScript 代码。以use开头的函数被称为Hook。useState 是React提供的一个内置Hook。可以通过组合现有Hook来编写自己的Hook。一个组件是 UI（用户界面）的一部分，它拥有自己的逻辑和外观。将变量user.imageUrl 赋值给 img 标签的 src 属性，需要使用{} 而非 “”。你的组件也不能返回多个 JSX 标签。你只能在你的组件（或其他 Hook）的。，请提取一个新的组件并在组件内部使用它。

使用immutable.js让你的react程序更加高效第一步npm i redux-immutable immutable -S//喜欢 yarn的同学yarn add redux-immutable immutable 第二步//接下来需要在你的reducer里修改defaultStateimport { Map,List,fromJS } from 'immutable';...

听之前同事说uni-app坑多（高手勿喷，本人小白，没学过uni，不了解，仅仅听别人说，勿骂），另外最近taro比较活跃，并且可以使用react语法开发（也支持了最新的vue3）,果断放弃uni-app,决定使用taro做个demo尝试了一下觉得还不错,只可惜taro3.x版本只有。，出于好奇的还是尝试了下，切了个页面发现flex布局在web和小程序上表现不一致，样式有些许差别，怕到了生产兜不住，另外由于时间、技术等等各方面综合考虑决定还是使用自己熟悉的技术栈进行开发，接着就有了后面的故事。