React基础教程(一):React简介

news2024/10/5 23:41:32

React基础教程(一):React简介

1、React是什么?

在这里插入图片描述

  1. 发生请求获取数据
  2. 处理数据(过滤,整理格式等)
  3. 操作DOM呈现页面

2、谁开发的

  1. 由Facebook的软件工程师 Jordan Walke创建
  2. 于2011年部署于Facebook的newsfeed
  3. 随后在2012年部署于Ins
  4. 2013年5月宣布开源

3、为什么学React

  • 原生JS操作DOM繁琐、效率低(DOM-API操作UI
  • 使用JS直接操作DOM,浏览器会进行大量的重绘重排
  • 原生JS没有组件化编码方案,代码重用率低。

4、React特点

  1. 采用组件化模式,声明式编码,提高开发效率及组件复用率。
  2. 在ReactNative中可以使用React语法进行移动端开发
  3. 使用虚拟DOM+优秀的Diffing算法,尽量减少与真实DOM的交互。

JS当实例化DOM的时候,会抛弃之前的DOM,尽管再次绘制的DOM和之前一样,也会把之前的摒弃,那么当数据量大的时候,重复数据多的时候,就会很大影响效率。

在这里插入图片描述
React会使用虚拟DOM,React会比较,发现有两个虚拟DOM001和002和之前的一样,那么页面就会拿到页面的真实DOM鹿晗和李现,只会重新实例化DOM肖战,当数据量大的时候,这样就大大提高了效率。
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/648497.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

一本书让你彻底搞懂安卓系统性能优化

🤵‍♂️ 个人主页:艾派森的个人主页 ✍🏻作者简介:Python学习者 🐋 希望大家多多支持,我们一起进步!😄 如果文章对你有帮助的话, 欢迎评论 💬点赞&#x1f4…

Transformer详解,中文版架构图

2.2.1 “编码器-解码器”架构 Seq2Seq 思想就是将网络的输入输出分别看作不同的序列,然后实现序列到序列 的映射,其经典实现结构就是“编码器-解码器”框架。编码器-解码器框架如图 2.7 所 示。 图2.7 编码器-解码器的基本框架 在 Seq2Seq 思想应用于自然…

机器鸟实现摆动尾巴功能

1. 功能说明 本文示例将实现R329样机机器鸟摆动尾巴的功能。 2. 电子硬件 在这个示例中,我们采用了以下硬件,请大家参考: 主控板 Basra主控板(兼容Arduino Uno)‍ 扩展板 Bigfish2.1扩展板‍ 电池7.4V锂电池 电路连接…

新的挑战:WebGL

这段时间一直在死磕 Chromium 的 8K 高清视频播放,虽然之前写过一些关键技术的实现,主要难点差不多攻破,但投入到产品中,依然还要解决很多实际中的问题,比如卡顿、格式支持、音视频不同步等等。前期的相关文章&#xf…

RocketMQ基础API使用以及基本原理探究

文章目录 同步发送异步发送单向发送拉模式随机获取一个queue的消息指定一个queue的消息 顺序消息广播消息延迟消息批量消息过滤消息Tag过滤sql过滤 事务消息RocketMQ常见问题RocketMQ如何保证消息不丢失?RocketMQ的消息持久化机制RocketMQ如何保证消息顺序RocketMQ事…

Day07 Python函数详解

文章目录 第四章 Python函数使用4.1. 函数介绍4.2. 函数的定义与使用4.2.1. 函数的定义4.2.2. 调用 4.3. 函数的参数4.4. 函数的返回值4.4.1. 返回值介绍4.4.2. None类型 4.5. 函数说明4.5.1. 函数注释4.5.2. 函数的4中定义方式4.5.3. 函数的调用 4.6. 函数的嵌套调用4.7. 函数…

哪款 IMG BXS GPU 适合您的汽车?

Imagination 是汽车行业领先的图形处理器供应商。Imagination 的 GPU IP 经过了九代更新迭代,为车辆提供了舒适性和安全性,在汽车行业的总出货量接近 5 亿。通过将响应迅速的 HMI(人机界面)与功能日益强大的高级驾驶员辅助系统相结…

Linux:主机状态监控

查看系统的资源占用 可以通过top命令,查看系统CPU、内存使用情况 top命令内容详解: 第一行:top:命令名称,10.49.16:当前系统时间,up 4:40:启动了4小时40分,4 users&#…

Aspose.Pdf使用教程:为PDF文件添加swf注释

Aspose.PDF 是一款高级PDF处理API,可以在跨平台应用程序中轻松生成,修改,转换,呈现,保护和打印文档。无需使用Adobe Acrobat。此外,API提供压缩选项,表创建和处理,图形和图像功能&am…

STL之priority_queue与仿函数

目录 一.仿函数1.介绍2.示例 二.priority_queue1.介绍2.成员函数3.模拟实现4.使用 三.其他1.typename Container::value_type 一.仿函数 1.介绍 函数对象,又称仿函数,是可以像函数一样使用的对象,其原理就是重载了函数调用符:()…

浅谈数据中台之标签管理平台

在现如今的大数据时代,相信大家一定了解或者听说过下列几个场景: 购物APP:千人千面,意思不同用户使用相关的产品感觉是不一样的,不同用户看到的购物APP首页推荐内容和其他相关推荐流信息可能是完全不同的。 社交APP&…

实例:使用网络分析仪进行电缆测试

本应用测试针对非标称50Ω的线缆,包括同轴、双绞线、差分高速数据线的测试,包括阻抗参数、S参数(插损、驻波、Smith图等等),也可以绘制眼图。 根据电缆的性能,如频率范围、长度、是否差分,设置…

Linux:root用户

root用户对Linux系统拥有最大的操作权限。 普通用户的权限一般都在home目录下,超过home目录后,普通用户在很多地方只有只读和执行的权限,但没有修改权限。 1、su命令:切换到root用户的命令语法: su -root “-”符号是可…

精密空调监控:不会这个技巧,千万不要尝试

随着科技的不断进步和信息化的发展,精密空调设备被广泛应用于数据中心、通信基站、医疗设施、实验室等对温度和湿度要求严格的环境中,以保证设备的正常运行和数据的安全性。 借助动环监控系统,精密空调可以实时了解设备的运行状态、温湿度的变…

数据库迁移 | Oracle数据迁移方案之技术两三点

今年Oracle似乎又火了,火得要下掉,目前中国大概有240数据库企业,在国产信创的大趋势下,一片欣欣向荣,国库之春已然来临。到今天为止,Oracle依旧是市场份额最大的数据库,天下苦秦久矣&#xff0c…

关于使用keil瑞萨RA4M2踩过的坑

一、之前在rasc添加的组件不能删除。 下面在rasc添加ThreadX,不只是RTOS,其他组件也出现这种情况。 当去掉组件不使用,重新配置。但是组件还是显示在软件包,导致编译出错。 解决方式,自己琢磨发现: 找到工…

腾讯视频技术团队偷懒了?!

👉腾小云导读 PC Web 端、手机 H5 端、小程序端、App 安卓端、App iOS 端......在多端时代,一个应用往往需要支持多端。若每个端都独立开发一套系统来支持,将消耗巨大的人力和经费!腾讯视频团队想到一个“偷懒”的方法——能不能只…

共建智慧工厂物联网平台方案 | 6.10 IoTDB X EMQ 主题 Meetup 回顾

6 月 10 日,IoTDB X EMQ 智慧工厂主题 Meetup 在深圳成功举办。工业物联网时序数据库研发商天谋科技、物联网数据基础设施软件供应商 EMQ 的两位技术大牛,针对多行业制造流程中数据传输、故障感知、决策执行等常见难题,通过数据基础设施平台的…

更智能、更强大:OpenAI发布升级版gpt-3.5-turbo-0613/16k速度提升,长度飙升4倍

OpenAI开发者平台最近推出了两个引人注目的GPT升级版本:gpt-3.5-turbo-0613和gpt-3.5-turbo-16k。这些新版本带来了一系列令人兴奋的功能和增强,为开发者提供了更加灵活和强大的自然语言处理工具。本文将为您介绍这两个版本的主要特点和优势。 gpt-3.5-t…

vue使用外部字体自定义LCD字体(晶管体)

大屏监控中常用到液晶字体效果,如下图所示: 一、下载字体格式 1、下载地址【Techno > LCD fonts | dafont.com】 二、解压字体 1、下载后,解压后都是.ttf文件,在Font Squirrel (这个地址打开,直接可以…