最近收到测试人员的反馈说我们开发的页面偶现卡死，点击无反应的情况，特别是打开页面较久的时候发生概率较高。打开任务管理器，看到内存占有率已经很高了，初步判断可能存在内存泄漏的情况。

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

换了新公司，工作中使用的技术栈也从Vue换到了React，作为一个React新人，经常的总结和思考才能更快更好的了解这个框架。这里分享一下我这两个月来使用React总结的一些性能优化的方法。 因为目前公司的项目是全面拥抱hooks的，所以只会涉及function组件写法，不包含…

在react 没有新增 hooks 之前，我们可以通过PureComponent、shouldComponentUpdate等方法进行性能优化，那么在hooks中有没有性能优化的方法呢？答案是肯定的。下面我们就来一一进行解答。 下面是官方文档的解释，感觉有些惜字如金，看完之后，…

React 作为一个视图框架，一般情况下速度已经很快了，并且在 React16 新推出的 Fiber 架构中，通过时间切片及高优先级任务中断来尽快相应用户的操作。但是有些我们忽略点，造成了不必要的组件 re-render，从而造成性能的浪费。 当组件更新时，pureCompon…

最近一直在学习关于React方面的知识，并有幸正好得到一个机会将其用在了实际的项目中。所以我打算以博客的形式，将我在学习和开发（React）过程中遇到的问题记录下来。 这两天遇到了关于组件不必要的重复渲染问题，看了很多遍官方文档以及网上各位大大们的介绍，下面我会通过一些demo…

曾拿这个问题问过不少前端求职者，但很少能给出正确的答案。下面就这个问题，浅谈下自己的认识。 针对上述问题，先进行一个简单的复现验证。 App 组件包含两个子组件，分别是函数组件 ChildFunc 和类组件 ChildClass。App 组件每隔 2 秒会对自身状态 cnt 自…

平常在完成业务功能开发后，不知道你是否还会精益求精，做一些性能优化方面的工作呢？React框架中有一些性能优化相关的注意事项，如果平常不怎么关注的话，可能就很容易忽略掉。接下来的这篇文章，将围绕工作中会用到的几种性能优化的相关经验进行介绍。 在渲染列表结构数据的时候，使用key…

本文将从 render 函数的角度总结 React App 的优化技巧。需要提醒的是，文中将涉及 React 16.8.2 版本的内容(也即 Hooks），因此请至少了解 useState 以保证食用效果。 正文开始。 当我们讨论 React App 的性能问题时，组件的渲染速…