当前位置: 首页 > news >正文

React (三)


文章目录

  • 项目地址
  • 十二、性能优化
    • 12.1 使用useMemo避免不必要的计算
    • 12.2 使用memo缓存组件,防止过度渲染
    • 12.3 useCallBack缓存函数
    • 12.4 useCallBack里访问之前的状态(没懂)
  • 十三、Styled-Components
    • 13.1 安装
    • 13.2给普通html元素添加样式
    • 13.3 继承和覆盖样式
    • 13.4 给react组件添加样式
    • 13.5 使用props控制样式
    • 13.6 使用嵌套样式
    • 13.7 定义主题
    • 13.8 实现样式的多态
  • 十四、使用React Transition Group实现动画(跳过)


项目地址

  • 教程作者:
  • 教程地址:
  • 代码仓库地址:
  • 所用到的框架和插件:
dbt 
airflow

十二、性能优化

12.1 使用useMemo避免不必要的计算

只有在指定的数值发生了变化,才会执行

  • 当页面发生变化时,因为react的机制,会导致页面进行一次刷新,但是由于购物车或者其他计算功能并没有更改,所以不应该重新计算;
  • 参数1:接受一个回调函数,返回我们需要计算的值
  • 参数2:和useEffect一样,接受一个依赖数组,把变化的东西放进去,来触发useMemo

在这里插入图片描述

12.2 使用memo缓存组件,防止过度渲染

只有props发生了变化,才会重新渲染组件

  • 虽然,上面计算没有重新渲染,但是商品列表没有变化(添加或者删除)商品ÿ
http://www.lryc.cn/news/490346.html

相关文章:

  • Python数据结构之链表
  • “LLM是否是泡沫”
  • 基于机器学习的人脸识别算法matlab仿真,对比GRNN,PNN,DNN以及BP四种网络
  • 算法(Algorithm)
  • C语言中const char *字符进行切割实现
  • 【UE5】在材质中计算模型在屏幕上的比例
  • 前端速通(HTML)
  • 订单日记为“惠采科技”提供全方位的进销存管理支持
  • Linux:文件管理(一)
  • 鸿蒙多线程开发——线程间数据通信对象03(sendable)
  • linux从0到1——shell编程7
  • 自主研发,基于PHP+ vue2+element+ laravel8+ mysql5.7+ vscode开发的不良事件管理系统源码,不良事件管理系统源码
  • 【海思Hi3519DV500】双目网络相机套板硬件规划方案
  • 【电源专题】BUCK电源SW电压的平均值为什么等于输出电压?
  • SpringCloud Gateway转发请求到同一个服务的不同端口
  • 【模块一】kubernetes容器编排进阶实战之pod的调度流程,pause容器及init容器
  • PySpark3:pyspark.sql.functions常见的60个函数
  • Python操作neo4j库py2neo使用之创建和查询(二)
  • 力扣11.23
  • golang实现TCP服务器与客户端的断线自动重连功能
  • 数据结构 (6)栈的应用举例
  • 谁的年龄最小(结构体专题)
  • 【论文笔记】LLaVA-KD: A Framework of Distilling Multimodal Large Language Models
  • M|大脑越狱
  • 数据库编程(sqlite3)
  • 【C语言】关键字详解
  • 什么是计算机网络
  • 【大数据学习 | Spark-Core】Spark的分区器(HashPartitioner和RangePartitioner)
  • CSS3_BFC(十二)
  • C0032.在Clion中使用MSVC编译器编译opencv的配置方法