React 18正式版发布，小明也兴冲冲地开始hooks学习之旅。某天他使用codesandbox写了一个小demo时，他发现组件诡异地渲染了多次。。。。。。

React 会创建一个虚拟 DOM(virtual DOM)。当一个组件中的状态改变时，React 首先会通过 "diffing" 算法来标记虚拟 DOM 中的改变，第二步是调节(reconciliation)，会用 diff 的结果来更新 DOM。 展示组件关心组件看起来是什…

1. React 中 keys 的作用是什么？ Keys 是 React 用于追踪哪些列表中元素被修改、被添加或者被移除的辅助标识。 有了key属性后，就可以与组件建立了一种对应关系，react根据key来决定是销毁重新创建组件还是更新组件。 key相同，若组件属性有所变化，则…

笔者是一个 react 重度爱好者，在工作之余，也看了不少的 react 文章, 写了很多 react 项目 ,接下来笔者讨论一下 React 性能优化的主要方向和一些工作中的小技巧。送人玫瑰，手留余香，阅读的朋友可以给笔者点赞，关注一波 。 陆续更新前端文章。 方向分别加以探…

大家好，我是六六。花费了一周的时间终于写完了这篇js核心概念的汇总。创作的过程也是查缺补漏，希望大家也能有收获的。喜欢的给作者点个赞哦，创作不容易的。 如有错误，请大家积极指出来，避免误导他人。（第一次写这么多字的文章，难免会有错误的） 如有补充，告诉我，我会积极添加上来。 我…

本文不讲 react、redux、action、reducer 的具体应用，只是单纯的讲解 reducer 为什么必须是纯函数，本文适合有一定 redux 开发经验的同学。 用过 react 的同学对 redux 一定不会陌生，我们知道 redux 可以提供可预测化的状态管理。…

将定义好的interface统一放到typings目录下面。 前端组件写完了之后，别忘了对应的node中的路由和ssr的代码。 最后访问localhost:7999/demo页面就可以查看效果了。 第一个页面构建完毕之后，我们可以在写一个复杂一点的todolist页面来检查一下…

今天开始，我们开始揭开react-router-dom神秘的头盖骨，哦不，面纱。 在此之前，我们需要了解一些预备知识：React的context和react-router-dom的基本使用。需要复习的同学请移步： 下面是我跟小S同学一起阅读源码的过程。 大家可以参照这个思路，进…

CSS是一门几十分钟就能入门，但是却需要很长的时间才能掌握好的语言。它有着它自身的一些复杂性与局限性。其中非常重要的一点就是，本身不具备真正的模块化能力。 1. 面临的问题 你可能会说，CSS有@import功能。然而，我们都知道，这里的@import仅仅是表示引入相应的CSS…