ReactJS通过道具传递对象或每次从数据库中读取性能更高的

如何解决ReactJS通过道具传递对象或每次从数据库中读取性能更高的

我有一个ReactJS项目，我想知道什么是性能更高的

假设我有一个索引页面，其中有3个组件，每个组件都需要数据库中的数据才能显示和编辑。我可以执行以下任一操作。

选项1

pages/index.js: pass primary key to component1,component2,component3
component1: read data from database with primary key
component2: read data from database with primary key and some additional joins
component3: read data from database with primary key and use only part of the data

选项2

pages/index.js: read data from database with primary key (and some additional joins)
component1: pass data via props
component2: pass joined data via props
component3: pass part of data via props

您认为哪个选项可以提高性能？还是有更好的选择？

我认为第一个在运行时会更快，但是会产生额外的数据库请求费用。第二个在数据库上较轻，但不确定可以通过props传递的对象的最大大小是多少。我的假设正确吗？

解决方法

同时测量两者，看看哪个性能更好。我认为第二个选择是传递道具要快得多。我敢肯定，由多个数据库命中创建的瓶颈不可能与javascript对象的大小相提并论。

简而言之，选择第二个选项。

,

我认为选项2会更快。在选项1中，您提出了很多要求，这使服务器（数据库）的性能降低。正如您所说的，您可以使用react-redux。从数据库获取数据并将其存储在redux存储中。现在您可以在项目中的任何地方使用它。