Javascript 防止从firebase获取数据的延迟时间（请检查详细信息以确保清晰）

注:

firebase的异步特性在这里已经讨论了数千次，但我的低声誉数字不允许对现有问题发表评论。这就是我问这个问题的原因

我是一个noob，所以请帮助我以一种易于理解的方式理解实现

实施步骤：

用户在HTML输入框中输入一个值

在firebase db中搜索输入值（showMessage（）被调用）

根据步骤2中的搜索结果显示适当的结果

面临的问题： 步骤3中显示的消息几乎平均需要1.75秒才能显示。这种体验对用户不友好。我希望尽快显示消息，即希望缩短提取时间

可能的根本原因：

要么我从firebase dB获取数据的方法不正确（我仍然不明白如何遵守承诺：（）

或者搜索和显示机制不正确

var全名；
函数showMessage（）{
提取数据（）；
}
函数extractData（）{
测试（功能（返回值）{
自定义消息=搜索消息（返回值）；
var container=document.querySelector（“#占位符”）；
var para=document.createElement（'p'）；
var custom_message=“快乐，巴德！”；
para.innerHTML=自定义消息；
para.className=“消息”；
容器.儿童（第6段）；
});
}
函数测试（回调）{
var ref=firebase.database（）.ref（）；
参考on（值），功能（快照）{
var data=snapshot.val（）；
回调（数据）；
}，函数（错误）{
日志（“错误：+Error.code”）；
});
}
功能搜索消息（数据）{
对于（变量i=0；i}

读取操作所需的时间取决于：

连接到Firebase服务器的延迟

您正在读取的数据量

连接的带宽

Firebase处理请求所需的时间

在大多数情况下，Firebase花费的时间只占总时间的一小部分，实际上大部分时间用于数据传输，这完全取决于带宽和数据量。如果这是您第一次在页面中从Firebase读取数据，延迟也更重要，因为Firebase必须建立连接在上，这需要几次往返

您当前的代码是从数据库下载所有数据，然后在JavaScript代码中搜索与特定值匹配的子节点。减少所需时间的最佳方法（除了升级到快速连接之外）就是传输更少的数据，这可以通过使用Firebase的查询机制在服务器上进行过滤来实现

您可以非常接近：

var ref = firebase.database().ref();
var query = ref.orderByChild().startAt(firstName).endAt(firstName+"~");
query.once('value', function(snapshot) {
  var data = snapshot.val();
  callback(data);

这将大大减少传输的数据量。不过需要注意以下几点：

查询只返回具有您要查找的名字的人。它尚未筛选姓氏，因此您仍需要在客户端代码中筛选姓氏

为了进一步优化这一点，请将全名（您现在在客户端代码中编写）存储在数据库中，以便您可以查询全名并进一步减少数据传输

FialBASE查询是区分大小写的，因此查询只返回在该情况下完全匹配的数据。如果您想查询不同的情况，请考虑在数据库中存储<代码> ToOrrCase]（< /代码>值）。< /LI>

确保在

firstName

上定义索引，否则Firebase数据库仍将向客户端发送所有数据，SDK将执行客户端过滤

---

请告诉我们你是如何发明了一种超快无延迟技术的。我们洗耳恭听。你为什么不使用firebase查询API来获取你想要的特定数据？@Darkrum[没有讽刺]我不是要求立即完成。我只是觉得所花费的时间太长，无法如此明显地观察到。因为我是一个新手，我想确认当前的方法是否正确，我是否需要做些其他事情来加快速度。@HayTran好的。让我检查一下。你的意思是通过查询获取数据会减少总体时间吗？你认为呢我认为我当前的代码实现是获取用户数据、基于用户数据进行搜索并返回的正确方式吗？首先，感谢您抽出时间回答我的基本问题。这对我来说意义重大。其次，我将编写一个查询并进行建议的更改。让我在晚上之前回复。第三，我不明白第4点。如果我将db字段更改为全名而不是保留姓名，那么我是否仍需要执行您要求的操作？对于#4，请参阅上的Firebase文档。是的，这始终是确保Firebase在服务器上执行筛选所必需的，这是消除将所有数据发送到客户端的需要的唯一方法。When我使用了“ref.orderByChild（'fullName'）.equalTo（fNameLower）。on（'value'，gotData，errorData）；”，我得到了一个数组（大小为2），其中也包含proto。我如何才能得到匹配的记录？例如，1:{firstName:'olivia'，fullName:'olivia parker'，lastName:'parker'，message:“Teacher”}长度：2 proto:array（0）

proto

只是JavaScript控制台显示对象的一部分。如果您想查看实际的JSON，请执行

console.log（JSON.stringify（snapshot.val（））；