对象数量与有效负载,同时扩展现代Javascript项目哪个更重要?

对象数量与有效负载,同时扩展现代Javascript项目哪个更重要?,javascript,json,performance,reactjs,javascript-objects,Javascript,Json,Performance,Reactjs,Javascript Objects,当然,负载越少,对象的数量就越少,但请阅读下面的全部描述 在现代浏览器上扩展javascript项目时,哪一个更重要?数据有效负载的大小或内存中javascript对象的数量。我有一个巨大的JSON字符串,我正在循环并将这个巨大的字符串分割成不同的对象。JSON字符串包含大量旅行者信息,每个Javascript对象都有很多属性。当JSON中有超过10000名旅行者时,浏览器将难以执行 我带来了很多不必要的属性,如果我能减少属性的数量,显然我的有效载荷会减少,但是,对象的数量可能会保持不变 多个J

当然,负载越少,对象的数量就越少,但请阅读下面的全部描述

在现代浏览器上扩展javascript项目时,哪一个更重要?数据有效负载的大小或内存中javascript对象的数量。我有一个巨大的JSON字符串,我正在循环并将这个巨大的字符串分割成不同的对象。JSON字符串包含大量旅行者信息,每个Javascript对象都有很多属性。当JSON中有超过10000名旅行者时,浏览器将难以执行

我带来了很多不必要的属性,如果我能减少属性的数量,显然我的有效载荷会减少,但是,对象的数量可能会保持不变

多个JS对象与较小的负载相比,哪一个在性能方面更划算


谢谢

我会尽我所能给出最好的答案,因为我的专业领域只涉及这个问题的范围,而没有完全涵盖它

现代计算机有一个内存层次结构:主内存;两级或三级缓存。每个级别的缓存都比它上面的缓存更小,但更接近CPU(实际上速度更快)

因此,就程序运行速度而言,与当前“工作集”(即程序在某一时刻使用的内存部分)相比,它使用的总内存量往往不那么重要

根据您的描述,将大JSON字符串拆分为许多较小的对象在大多数情况下都有助于减小工作集的大小。如果在执行此操作时,留下了大量未使用的属性,那么这可能无关紧要,因为它们可能大部分时间都不在工作集内

让后端过滤掉一些不需要的属性可能是一种有用的技术,因为这将减少传输的数据量。然而,你需要仔细考虑这将如何缩放;这可能会给服务器带来太多负载

可能有一些方法可以通过重新评估您编写的算法和使用的库(方法)来加速您的程序。可能有一些特定于典型现代JavaScript引擎的技术;恐怕这超出了我的专业范围

在应用程序中引入一些新概念可能会有所帮助。通过采用启发式(系统性猜测)或降低准确性来减少处理是否可以接受

例如,用户可以根据仅使用部分数据的第一次传递获得临时结果。可以使用微调器(或消息)提醒用户正在进行更多处理。处理完完整数据集后,将其呈现给用户

或者,让用户选择“快速”或“深入”结果;深度结果可能会在后端计算(并且可能会分配给HTTP或数据库服务器以外的机器)


祝你好运

JavaScript对象的数量很可能是场景中的瓶颈。您可以制作一些简单的控件,例如检查操作系统是否处于交换状态。下面我粘贴了一个MacOs活动监视器屏幕截图,您可以在其中检查交换使用情况。同样的信息也存在于Linux和Windows操作系统中


另一种控制方法是,检查对数据进行的过滤/映射/减少/每次操作的数量。如果您做了很多这样的操作,那么代码被大量对象卡住的可能性就会增加。尝试减少对象的数量(您已经知道)或减少重复迭代对象的需要(例如,如果您反复找到相同的信息,请将其存储到中间对象中)。

对象中的每个属性本身就是一个对象。Javascript这样很有趣

范例

这里有一个“Object”
myObject
,它继承了
对象
原型,并携带了对象的所有开销。此对象包含一个属性,
prop1
,它是一个字符串。字符串继承自
字符串
,该字符串继承自
对象
。因此,您的字符串也承载着对象的所有开销。因此,在内存使用方面,拥有更多属性应该与拥有更多对象大致相同

我带来了很多不必要的属性如果我能减少属性的数量显然我的有效载荷会减少,但是,对象的数量可能会保持不变

多个JS对象与较小的负载相比,哪一个在性能方面更划算

我不知道你到底是什么意思,但听起来你的意思是,你肯定需要所有10000名旅行者,但如果每个旅行者都有20处房产而不是100处,那就好了

对!!那样做。更少的数据意味着要在内存中跟踪的数据更少,要通过更小的堆栈再次查找数据,等等。10000*20比10000*100好得多

但是,我仍然鼓励您重新思考将这么多数据点引入浏览器是否有意义。我想不出有多少用例可以在哪里显示所有这些。最好让您的服务器更多地处理数据,然后只发送您可以在屏幕上实际容纳的小子集


服务器可以用它的cpu时间将数据转换成有用的小块,而浏览器则用它的cpu时间让用户体验丝般流畅。

您可以尝试将数据写入IndexedDB,然后查询您实际需要的数据,我怀疑您是否需要一次显示所有10k对象。这样你就不会有太多的钱了
myObject {
    prop1: 'hello',
}
function consumeString(s) {
    if(s.length == 0)
        return;
    var sep = s.indexOf("\n");
    if(sep < 0)
        sep = s.length;
    try {
        var obj = JSON.parse(s.slice(0, sep));
        console.log("processed:", obj);
    } catch {
        console.log("Failed... not valid JSON?:");
    }
    // schedule the next slice for later processing.
    setTimeout(consumeString, 0, s.slice(sep + 1));
}


var text = '{ "employees" : [' + // JSON1
'{ "firstName":"John 1" , "lastName":"Doe 1" },' +
'{ "firstName":"Anna 1" , "lastName":"Smith 1" },' +
'{ "firstName":"Peter 1" , "lastName":"Jones 1" } ]}' + // END JSON1
"\n" +
'{ "employees" : [' + // JSON2
'{ "firstName":"John 2" , "lastName":"Doe 2" },' +
'{ "firstName":"Anna 2" , "lastName":"Smith 2" },' +
'{ "firstName":"Peter 2" , "lastName":"Jones 2" } ]}';

consumeString(text);
while(...) {
  // this will create a new instance of fullStr in memory every iteration
  fullStr = fullStr + 'str1';
}