程序员经验分享-hwhale

React createElement 与 CloneElement

2024-02-08

谁能告诉我如果使用cloneElement（在现有元素实例上）或createElement（在react Element类上）哪一个在性能方面更好？

有时克隆某些东西比创建新实例更快。 请告诉我。谢谢


Using cloneElement通常会更快，因为您只需要实例化一个初始组件。

This jsperf测试 https://jsperf.com/react-createelement-vs-react-cloneelement shows cloneElement速度几乎是两倍createElement对于 Linux 上的 Chromium 45：

  • cloneElement~1.7m 操作/秒
  • createElement~0.85m 操作/秒

如果您有一个无需更改即可克隆的基本组件，那么使用cloneElement无论是在语义上还是在性能方面，都是一个明确的选择。

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

javascript

ReactJS

clone

React createElement 与 CloneElement 的相关文章

  • 如何创建一个多重过滤函数来过滤掉多个属性？

    我有一个要过滤的对象数组 name Apple age 24 model Android status Under development name Roboto age 24 model Apple status Running 我需要使

  • React 不响应按键事件

    我正在尝试实现一些非常基本的按键检测 但我根本无法让它工作 我有一个裸露的组件 应该在onKeyDown事件 但控制台中没有任何内容被注销 class App extends React Component constructor prop

  • Access-Control-Allow-Headers 不允许请求标头字段 Access-Control-Allow-Headers

    我试图通过发布请求将文件发送到我的服务器 但是当它发送时会导致错误 Access Control Allow Headers 不允许请求标头字段 Content Type 所以我用谷歌搜索了错误并添加了标题 http post rootSc

  • mouseover 和 mouseout 事件在子进程上触发

    代码 div div div div 如果我将鼠标悬停在Navigation the Drop Downdiv 向下滑动 如果我将鼠标移开 它会向上滑动 问题是如果我将鼠标悬停在孩子上Drop Downdiv它也向上滑 动 有谁知道我该如何

  • 覆盖函数（例如“警报”）并调用原始函数？

    我想用调用原始版本的新版本覆盖 Javascript 内置函数 类似于用调用的版本覆盖类上的方法 super有多种语言版本 我怎样才能做到这一点 例如 window alert function str do something addit

  • Backbone 中的加载栏

    我想显示加载消息 图标 直到列表中的所有项目都已呈现 这是我的示例中的 jsfiddle http jsfiddle net 9R9zU 58 http jsfiddle net 9R9zU 58 我尝试在 Feed 部分添加一个带有加载栏

  • 将上部字符转换为下部字符，将下部字符转换为上部字符（反之亦然）[重复]

    这个问题在这里已经有答案了 我需要将某些字符串中的所有较低字符转换为较高字符 并将所有较高字符转换为较低字符 例如 var testString heLLoWorld 应该 HEllOwORLD 转换后 在不保存临时字符串的情况下实现此目的

  • 嵌套辅助函数和性能

    嵌套辅助函数对于使代码更易于理解非常有用 谷歌甚至建议在他们的应用程序中使用嵌套函数时尚指南 https google styleguide googlecode com svn trunk javascriptguide xml Nest

  • Javascript 正则表达式来匹配正则表达式

    我正在研究一个特殊的正则表达式来匹配 javascript 正则表达式 现在我有这个正则表达式工作 i g m 例如 foo match i g m gt foo foo undefined foo i match i g m gt foo

  • Angular 2 runOutsideAngular 仍然改变 UI

    从我的理解来看runOutsideAngular https angular io docs ts latest api core index NgZone class html runOutsideAngular anchor 如果我需要

  • jQuery 在 Chrome 下发现错误元素

    我使用 jQuery 迭代 HTML 表 并动态填充每行的行号 通过在文本框中填充行号 function updateRowNums myTable find tr each function index this find input i

  • 有没有好的 JQuery twitter 小部件可以循环推文？

    我想知道是否有任何 JQuery 小部件提供了循环加载推文的功能 例如在官方小部件中http twitter com about resources widgets widget profile http twitter com about

  • 水平平滑滚动 100px

    Heyjo problem 一周以来我一直在寻找 javascript 或 jQuery 代码 以便在我的网站上实现滚动按钮 我失败的那一刻是按钮应该多次工作的时候 他的任务不是滚动到专用元素 而是应该向左滚动 例如 100px 此外 滚动

  • 如何设置在浏览器的新选项卡（_blank）中打开的pdf文件的标题

    这是我的尝试 是否在新选项卡上打开 但它总是显示test pdf如题 function titlepath path name alert path alert name document title name window open pa

  • D3v6 嵌套图 - 嵌套 join()？

    我想可视化每个节点的 孩子 洞察力 我猜 D3v6 join 函数可以嵌套 不幸的是我找不到任何例子 下面的代码片段包含一个具有 3 个节点和子节点作为属性的outerGraph 到目前为止 这些孩子还没有被使用 相反 innerGraph

  • ExpressJS - DELETE 请求后 res.redirect

    我一直在寻找如何执行此操作 我正在尝试在发出删除请求后重定向 这是我正在使用的代码没有重定向 exports remove function req res var postId req params id Post remove id p

  • Three.js WebGL 从着色器绘制圆形自定义填充和边框颜色

    我将 Three js 与 WebGLRenderer 一起使用 我试图找出或查看如何使用 CircleGeometry 绘制圆圈的示例 并能够从顶点或片段着色器控制其填充和边框颜色 如果不使用图像作为纹理 这是否可能 抱歉 如果这真的很简

  • 渲染作为 Prop 传入的 Component

    我怎样才能渲染一个StyledComponent它是作为道具传入的吗 我正在传递一个Spinner组件到我的BarComponent作为渲染的道具 我尝试使用 this props icon in my BarComponent在下面的示例

  • WooCommerce 使用 AJAX 设置购物车数量？

    我已经为此绞尽脑汁好几天了 需要一些指导 我正在为 WooCommerce 网站完全从头开始制作自定义主题 现在我正在尝试让购物车功能正常工作 我一直试图使用按钮 来更新购物车中产品的数量 对我来说问题似乎是WC 我在functions p

  • 利用重力效果拖动元素

    我想完成类似于 photoshop com 和此网站的功能 http mrdoob com projects chromeexperiments google gravity http mrdoob com projects chromee

随机推荐

  • Android 中已弃用的 AbsoluteLayout 有什么替代方案？

    我有一个 Xamarin 项目 我为 IOS Android 和 UWP 进行开发 在我的应用程序中 我有 UI 元素的手动布局逻辑 在 IOS 中 我可以使用frame 属性来设置视图的渲染位置 我可以在 UWP 中执行相同的操作 方法是

  • 从 favicon.ico 中删除 Etag

    在项目上使用 yslow 我遇到了一个无法解决的 问题 伊斯洛不断抱怨 有 1 个组件的 ETag 配置错误http www domain com favicon ico http www domain com favicon ico 我的

  • 如何为 .net core MVC Web 应用程序创建和显示 PDF 文件？

    我有一个能够创建和显示 PDF 文件的 asp 应用程序 我需要为 net core 应用程序复制相同的功能 我对 net core MVC 不太有经验 所以我不知道如何实现这一点 DisplayPDF aspx cs public par

  • 在 Swift 中读取 UIApplicationLaunchOptionsURLKey

    只是想阅读 Swift 中的启动选项 这是我的旧 obj C 代码 运行良好 BOOL application UIApplication application didFinishLaunchingWithOptions NSDictio

  • 什么是回车、换行和换页？

    以下控制字符的含义是什么 回车符 换行 换页 回车符表示返回当前行的开头而不向下前进 这个名字来自打印机的托架 因为在创造这个名字时显示器还很少见 这通常被转义为 r 缩写为 CR 并且具有 ASCII 值 13 或 0xD Linefee

  • 如何在 MS Word 中使用 win32com.client.constants？

    这段代码有什么问题吗 为什么 win32com client constants 没有属性 wdWindowStateMinimize gt gt gt import win32com client gt gt gt w win32com

  • Git - 无法推送 - “！[远程拒绝] master -> master（工作目录有未暂存的更改）”

    我正在尝试为具有本地版本 临时版本和生产版本的 Wordpress 安装设置一个 简单 git 工作流程 我想做的就是在本地进行更改 然后从本地推送到登台 从本地推送到生产 起初我认为这将是一个简单的任务 我已经能够初始化存储库 添加两个远

  • 获取与 python dict 中的 max(value) 对应的键[重复]

    这个问题在这里已经有答案了 让我们考虑一下 键 值 对的示例字典 如下所示 dict1 a 10 x 44 f 34 h 89 j 90 d 28 g 90 dict2 a 10 x 44 f 34 h 89 j 90 d 28 在字典中的

  • Monad 比 Applicative 更强大？

    我在看过去的讨论 https stackoverflow com questions 23342184 difference between monad and applicative in haskell但不明白为什么任何答案实际上都是正

  • Sierra OSX 更新后 MAMP 无法工作

    我正在使用 MAMP 版本 3 2 和 Sierra OSX v10 12 安装 Sierra 的最新更新后 MAMP 拒绝启动 In the apache error log文件下 Applications MAMP logs 我看到以下

  • java.net.SocketException：没有可用的缓冲区空间（已达到最大连接数？）：JVM_Bind

    Tomcat 在 Windows 下运行一个 Web 应用程序 几天后 在非常低的负载下 标题中提到的异常开始出现在日志中 从那时起无法建立新的连接 唯一的修复方法是重新启动服务器 环境 最新的雄猫 6 Windows Server 200

  • xcode_backend.sh：没有这样的文件或目录。我需要创建这个文件吗？

    我的 Flutter 项目无法在 ios 模拟器上运行并抛出此错误 在 iPhone X 上以调试模式启动 lib main dart 运行 Xcode 构建 Xcode 构建完成 7 6秒 无法构建 iOS 应用程序 Xcode 构建的错

  • Amazon EC2 实例无法更新或使用 yum

    我正在使用亚马逊的教程安装 LAMP 服务器 http docs aws amazon com AWSEC2 latest UserGuide install LAMP html 前几条指令涉及使用yum 但我尝试过的每一种方法都导致了相同

  • JUnit 断言：在浮点数之间进行断言

    我需要比较两个值 一个是字符串 另一个是浮点数 所以我将字符串转换为浮点数然后尝试调用assertEquals val1 val2 但这是未经授权的 我猜assertEquals不接受 float 作为参数 在这种情况下我的解决方案是什么

  • 情节不更新 R 中的第二种颜色

    我正在尝试绘制一个基本的donut情节在R using plotly 然后我将自定义颜色添加到绘图中 现在first颜色更新很好 但是second颜色 即 rgb 255 127 80 没有 我怎样才能解决这个问题 Data Value c

  • 键盘在屏幕上永久可见

    是否可以设置 以便当我打开新屏幕时 键盘打开 键盘将始终可见 我在屏幕上有一个 TextInput 以及一个可供选择的选项 我希望键盘始终可见 无论我们是否单击 输入 或在屏幕上执行其他操作 键盘上有一个按钮 其功能不是 Enter Use

  • `Control.Dispose()` 是否会删除所有事件注册？

    当我打电话时Dispose on a System Windows Forms Control 它会自动删除所有事件注册吗 例如 以下内容就足够了 var button new Button button Click someObject

  • Typescript：TSX 文件在 Chrome 中显示为空白

    当尝试在 Google Chrome 中调试 TypeScript 应用程序时 ts 文件在检查器中正确进行源映射 但 tsx 文件显示完全为空 这并不能真正帮助我调试它们 如何正确地将 tsx 文件获取到源映射 我建议您尝试为使用的 We

  • PYTHON 使用退出键退出时出现问题

    我在使用以下代码时遇到问题 它似乎对退出键有反应 但它冻结得很厉害 我将 pyscripter 与 python 2 7 和 pygame 一起使用 An example implementation of the algorithm de

  • React createElement 与 CloneElement

    谁能告诉我如果使用cloneElement 在现有元素实例上 或createElement 在react Element类上 哪一个在性能方面更好 有时克隆某些东西比创建新实例更快 请告诉我 谢谢 Using cloneElement通常会

热门标签