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

面试问题:React基本概念,和所遇到的CPU和IO问题

         在官方文档里面可以看见React基本设计概念,React是用 JavaScrip构建快速响应的大型Web应用程序的首选方式,但是快速响应用一定的是依赖,CPU的性能和IO的约束。

        首先CPU性能原因:大部分浏览器的刷新频率为60HZ,及16.6ms浏览器刷新一次,但是由于越大的项目js越复杂,导致他的运行时间早就超过了16.6ms,由于浏览器的渲染线程原理,在跑到js的时候必须等他跑完才会继续跑html。浏览器给出的解决方法是,每一帧流一点时间给js。原生的话你需要手动调用,而react会自动用这个来优化js速度,这种操作叫时间切片,时间切片:将同步的更新变为可中断的异步更新。

        IO的限制,这种可以从服务器的角度进行一个优化,包括利用hTTP2-3等现代协议,同时也可以使用人机交互这种视觉感受,让用户减少对网络延迟的感知,响应时间:0.1s内,用户感觉会流程。1秒内流畅但是会察觉到延迟,10s内,需要提供进度条。对于动画控制在200ms到500ms之间是用户最舒服的。就比如说Suspense以及配套的useDeferredValue这种React提供的功能。

        Suspense:是可以在跳转的过程中显示进度条或者别的内容来告诉用户在加载的。在响应时间超过1s的时候使用。

        useDeferredValue:类似防抖,截流的功能,但是比他们效率更高,他是利用React内部Schedular(调度器)实现的,通过切换优先级,当用户输入的时候,先显示输入的值,把计算值的动作排在优先级后面每次用户修改值react都会计算渲染的值,当用户新输入会打断这个过程,重新按照最新值来跑渲染,达到优化用户体验的功能。

http://www.lryc.cn/news/402645.html

相关文章:

  • FOG Project 文件名命令注入漏洞复现(CVE-2024-39914)
  • JavaScript 表单
  • python程序设定定时任务
  • win10 查看 jks 的公钥
  • 蓝牙模块在智能体育设备中的创新应用
  • 智能家居和智能家电有什么区别?
  • SpringBoot3 + Vue3 学习 Day 1
  • 如何使用在线工具将手机相册中的图片转换为JPG格式
  • C#医学影像管理系统源码(VS2013)
  • Qt Creator 项目Console 项目踩坑日记
  • [MAUI 项目实战] 笔记App(一):程序设计
  • VisualRules-Web案例展示(一)
  • 使用Docker 实现 MySQL 循环复制(三)
  • Spring如何管理Mapper
  • NFS存储、API资源对象StorageClass、Ceph存储-搭建ceph集群和Ceph存储-在k8s里使用ceph(2024-07-16)
  • 「Vue组件化」封装i18n国际化
  • 【Git远程操作】理解分布式管理 | 创建远程仓库
  • OJ-0718
  • python抓包 -- 用wireshark抓包、解析--scapy、PyShark
  • uni-app开发日志:unicloud使用时遇到的问题解决汇总(不断补充)
  • 插入排序算法详解
  • parallel 详细解析 Java 8 Stream API 中的 parallel 方法
  • 不同业务场景下通过mars3d实现绕点旋转效果
  • 重塑水利未来:智慧水利解决方案的探索与实践,从物联网、大数据到人工智能,科技如何赋能水利行业,实现智慧化管理与决策
  • IO、进程、线程03
  • 算法力扣刷题记录 五十二【617.合并二叉树】
  • Java中的ArrayList和LinkedList有什么区别?
  • Linux C++ 058-设计模式之解释器模式
  • MDK5没有DeviceName
  • 在LabVIEW中实现图像矫正