前端如何去快速处理比较大的数据? 头发都快薅光了

[getBugTOyou]

现在有这么个需求, 在一个 josn 中找到 name 所在位置

[
  {
    大量各种其他不相关属性,
    children: [
      {
        name: '',
        大量各种其他不相关属性
      }
    ]
  },
  ...
]

怎么去通过模糊匹配 name 去获得这两层的 index

1. 数据很大, 有几 M;
2. 第一层与第二层可能都 0 有几百条;
3. 实时更新的, 所以无法通过先初始化一个 hash 表来查 Index;

怎么让获得 index 的时间尽量短? 因为需要查找的 name 是通过 input 输入的, 一边输入, 一边不停去匹配查找!

目前已经掉了很多头发, 请各位帮帮我埼玉!

ps: 如果需求没有表达明确, 请帮忙指正哦

感谢各位的帮助, 最后选择了 https://fusejs.io/ 这个库, 2.9M 的数据, 查找也只需要 52ms

[AreYou0k]

webWoker 好像可以

[getBugTOyou]

@AreYou0k webWorker 只是提供了个线程呀, 关键是计算耗时!

[napsterwu]

用了 map 和 reduce ？

[zachgenius]

大量数据交给前端处理....总觉得是后端偷懒呢...

[oatw]

貌似是一道算法题呀。输入的事件用 setTimeout 处理，几百条乘以几百条那就是最大 10 万条？！

先快速排序再二分查找？

[wszgrcy]

上堆，(嗯，应该没错)尽量别递归

[rain0002009]

所以你们服务端是把所有的数据都给你了 然后叫你自己做模糊搜索？
你们服务端 666 啊
搜了一下 还真有模糊搜索的轮子
https://fusejs.io/

[yhxx]

转成字符串，然后查相邻的{}或者[]的 index ？

[loading]

这是一个 js 的题目，node.js 后端也会遇到。

[TrickWu]

按照我个人理解，这种上 M 的数据应该是后端检索来做的，前端浏览器的速度怎么可能跟服务器比呢。

[nigelvon]

没毛病确实应该后端做，数据量不大后端可以翻转一下把 name 的值变成 key 这样速度比较快，如果很大可以借助其他工具做索引来搜索。

[nondanee]

应该要 parse 的吧？那可以用 reviver 建个索引
```
let mapping = {}
JSON.parse(responseText, (k, v) => {
if(!isNaN(k)){
v.i = k
}
if(typeof(v) == "object" && 'children' in v){
v.children.forEach((child, i) => mapping[child.name] = v.i + '-' + i)
}
return v
})
```

[ChefIsAwesome]

“因为需要查找的 name 是通过 input 输入的, 一边输入, 一边不停去匹配查找!”
这肯定后端搞啊，前端搞这个直接卡死了。

[ipwx]

前端对数据建树或其他合适的数据结构，后端新的数据增量给出，那么前端后续就能更新这个数据结构而不是全部重建。数据结构请查询各种模糊匹配算法

[ipwx]

我觉得这个前段做挺有道理的，减轻服务器压力。反正和数据安全性关系不大

[getBugTOyou]

@rain0002009 感谢, 很好用! 开始用这个库了