UX显示方法";“装载”;Firebase云功能完成之前的UI?

UX显示方法";“装载”;Firebase云功能完成之前的UI?,firebase,google-cloud-firestore,google-cloud-functions,Firebase,Google Cloud Firestore,Google Cloud Functions,我有一个用于输入和计算学生评估的angular应用程序,其中所有数据都存储在Firebase Cloud Firestore中。当一个新的评估被添加时,我现在有一个计算学生的更新平均值的角度UI代码,并直接更新学生和整个班级的统计数据 出于许多原因,我想将计算和统计更新移动到Firestore文档的创建/更新事件触发的云函数。我认为这将是相当容易的,但我的UI将几乎立即返回,但实际的统计数据更新将不会发生,直到函数完成,可能是几秒钟后 我的UI当前监视快照更改,因此一旦功能完成,统计更改将自动显

我有一个用于输入和计算学生评估的angular应用程序,其中所有数据都存储在Firebase Cloud Firestore中。当一个新的评估被添加时,我现在有一个计算学生的更新平均值的角度UI代码,并直接更新学生和整个班级的统计数据

出于许多原因,我想将计算和统计更新移动到Firestore文档的创建/更新事件触发的云函数。我认为这将是相当容易的,但我的UI将几乎立即返回,但实际的统计数据更新将不会发生,直到函数完成,可能是几秒钟后

我的UI当前监视快照更改,因此一旦功能完成,统计更改将自动显示。我担心,如果用户输入新的评估但没有立即看到更改,认为他们没有接受或出现问题,可能会让用户感到困惑。但几秒钟后,屏幕上突然显示了最新统计数据的结果


我认为在函数完成并收到新更新的快照之前,最好显示一个加载指示器。我似乎找不到对此的建议方法或模式。在收到下一个快照之前,如何触发更新并显示进度指示器?我是否应该显示指示器,然后在快照代码中查看指示器是否可见并将其删除?

我认为您不应该将UX行为过分复杂化

正如您在问题中所描述的,当您写入Firestore文档触发云功能时,您应该显示一个“加载指示器”,并在快照更改侦听器指示后端中的统计信息已更新时隐藏此加载指示器

在用户体验方面,您可以选择显示阻塞“加载指示器”或非阻塞指示器,具体取决于应用程序的确切功能

非阻塞加载指示器 例如,如果在后端计算统计数据时用户仍然可以在屏幕上工作,则在统计字段附近显示加载指示器(例如,带有简单文本“当前正在更新统计数据”的小微调器)

阻塞负载指示器
相反,如果在统计字段更新之前用户不应该与UI交互,那么您可以以一种强制用户等待的方式显示加载指示器,并清楚地指示应用程序正在后端工作。

IMHO我认为您不应该过度复杂化您的UX行为

正如您在问题中所描述的,当您写入Firestore文档触发云功能时,您应该显示一个“加载指示器”,并在快照更改侦听器指示后端中的统计信息已更新时隐藏此加载指示器

在用户体验方面,您可以选择显示阻塞“加载指示器”或非阻塞指示器,具体取决于应用程序的确切功能

非阻塞加载指示器 例如,如果在后端计算统计数据时用户仍然可以在屏幕上工作,则在统计字段附近显示加载指示器(例如,带有简单文本“当前正在更新统计数据”的小微调器)

阻塞负载指示器
相反,如果在统计字段更新之前用户不应与UI交互,则可以在中显示加载指示器,强制用户等待,并明确指示应用程序正在后端工作。

为什么不在中询问此问题?这是个好主意,但我正在寻找与Firestore更新触发的角度、快照观测和异步云函数相关的代码建议。虽然我认为这可能与处理异步更新的几乎所有可观察到的UI(角度、反应等)有关,但我担心通用UX anwer会提供很多很好的可用性想法,但在这个代码上下文中没有具体说明这将从何处开始或解决。为什么不提出这个问题?这是个好主意,但我正在寻找与Firestore更新触发的角度、快照观测和异步云函数相关的代码建议。虽然我认为这可能与处理异步更新的几乎所有可观察到的UI(角度、反应等)有关,但我担心通用UX anwer会提供很多很好的可用性想法,但在这个代码上下文中没有具体说明这将从何处开始或解决。感谢Renaud,这是我最初的想法,但我不确定触发快照更改是否是一种好的做法。感谢雷诺,这是我最初的想法,但我不确定触发快照更改是否是一种好的做法。