javascript - 为 JavaScript 客户端编码/解码大量数据的最佳方式?

标签 javascript json

我正在使用 Spine、Node.js 等编写一个独立的 javascript 应用程序(如果您有兴趣,可以使用 Here is an earlier incarnation)。基本上,该应用程序是一个交互式“数字属性”浏览器。这个想法是您可以选择任何数字,并查看它拥有的属性。它是素数还是三 Angular 形等?其他具有相同属性的数字在哪里?那种事。

目前我可以很容易地显示数字 1-10k,但我想显示数字 1-million,甚至更好的 1-billion 的属性。

我希望我的客户端下载一组静态数据文件,然后使用它们将信息呈现给用户。我不想写服务器后端。

目前我正在为数据文件使用 JSON。对于一些数据,我知道一个简单的算法来导出我在客户端寻找的信息,我使用它(即,它是均匀的吗?)。对于较难的数字,我预先计算它们,然后将值存储在 JSON 可解析数据文件中。我对整个事情有点过分了 - I implemented纯 JavaScript bloom filter当素数没有扩展到 100 万时,我尝试使用 CONCISE bitmaps在下面(这没有帮助)。最终我意识到,如果我将数据表示为 JSON,那么如何“压缩”我的数据并不重要。

所以问题是 - 我想为每个数字显示 30 个属性,并且我想显示一百万个数字......大约有 3000 万个数据点。我希望 javascript 应用程序下载此数据并将其呈现给用户,但我不希望用户必须下载数兆字节的信息才能使用该应用程序...

我有哪些选择可以有效地将这些大型数据集发送到我的纯 JavaScript 解决方案?

我可以转换成二进制然后在客户端读取二进制吗?请举例!

最佳答案

在客户端计算这些数据点怎么样?

你会省去很多头痛的事情。您可以预先计算索引图表,并仅在用户选择特定数字时才处理其余数据点。

对于按数字显示的属性。现代桌面上的纯 JavaScript 快得令人眼花缭乱(如果你远离 DOM),我认为你会发现算法与预先计算的 JSON 解决方案之间的处理速度差异可以忽略不计,你会为自己省去很多痛苦和不必要的带宽使用情况。

至于初始索引图表,它只显示每个数字的属性数,并且可以作为数组传输:

'[18,12,9,11,9,7,8,2,6,1,4, ...]'

或在 JSON 中:

{"i": [18,12,9,11,9,7,8,2,6,1,4, ...]}

请注意,这对于对数标度同样有效,因为无论哪种方式,您一次只能将一个值附加到屏幕上的 1 个点。您只需相应地满足数组的内容(通过在 1-2K 大小的数组上按顺序返回对数值)。

您甚至可以使用 DEFLATE 算法进一步压缩它,但由于您只能在屏幕上显示有限数量的数字(桌面上 <1-2K 像素),我建议您围绕这个事实创建解决方案,因为例如,通过检查您是否可以随时随地计算 2K *30 = 60K 属性且影响最小,这可能比此时请求服务器给您一些 JSON 更快。

2012 年 1 月 10 日更新

我刚刚看到您关于用户能够点击特定属性并获得显示该属性的数字列表的评论。

我认为上面的属性数量的初始传输可以被简化为包括初始负载中的所有属性,请记住,您只想传输以您希望显示的初始对数标度显示的数字的值(这意味着如果用户首次加载页面或单击属性时它们不会在屏幕上显示,您可以跳过数字)。可以在客户端计算超出初始有效负载的任何内容。

{ 
  "n": [18,12,9,11,9,7,8,2,6,1,4, ...] // number of properties x 1-2K
  "p": [1,2,3,5,7,13,...] // prime numbers x 1-2K
  "f": [1,2,6, ...] // factorials x 1-2K
}

我的猜测是像这样的 JSON 对象大约有 30-60K,但您可以通过删除其算法不是递归的属性并让客户端在本地计算这些属性来进一步减少它。

如果您想要一种替代方法来在遇到大量数字时压缩这些数组,您可以将数组格式化为 VECTOR 而不是数字列表,存储一个数字与下一个数字之间的差异 ,当您处理大量数据(> 1000)时,这将减少空间。上面使用向量的 JSON 示例如下:

{ 
  "n": [18,-6,-3,2,-2,-2,1,-6,4,-5,-1, ...] // vectorised no of properties x 1-2K
  "p": [1,1,2,2,2,6,...] // vectorised prime numbers x 1-2K
  "f": [1,1,4, ...] // vectorised factorials x 1-2K
}

关于javascript - 为 JavaScript 客户端编码/解码大量数据的最佳方式?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8790296/

相关文章:

javascript - 以 Angular 获取模态组件中的路由参数

java - JPA:可以使用 "long fooId"而不是 "Foo foo"作为 @JoinColumn (对于 JSON 兼容)?

javascript - 将 select 标签的选项的 json 数据存储在变量中

java - 同时发出 JSON 请求

javascript - 使用 Javascript 编写 cookie 时,它​​是同步存储还是异步存储?

Javascript 日期正则表达式 例如。 2010-06-03

javascript - 如何使用 Angular JS 将 javascript 对象从 View 传递到 Controller ?

javascript - 如何调整通过 ajax 添加的图像的大小以适应特定尺寸,同时使用 JQuery/CSS 保持纵横比?

javascript - 如何读取本地json文件并将其存储在变量中?

json - 如何使用 Powershell 遍历 JSON 属性