Question

我在我的网络应用程序中使用了JSF 2.2，PrimeFaces 6和Spring Framework 4.3 用户登录后会被重定向到主页。在主页中会加载一些图表，表格等。它们显示了一些实时信息，加载主页需要一些时间。我不希望用户在登录页面等待太久。所以我使用以下代码在页面加载后加载图表，如here：

中所述

<h:form id="hiddenForm" style="display: none;">
    <p:remoteCommand name="onload" actionListener="#{homeMB.onload}"
        update=":firstChartForm :secondChartForm :thirdChartForm" global="false"/>
</h:form>

这是支持bean的onload方法：

public void onload() {
    fillFirstChart(); //Takes 5 seconds
    fillSecondChart(); //Takes 1 second
    fillThirdChart(); // Takes 3 seconds.
}

图表由这些方法填充，并在update的{{1}}参数的帮助下更新，但需要9秒。我希望同时运行这些方法，并在加载数据后立即使用相应方法提供的数据更新每个图表。

我的意思是，用户应该在点击登录按钮后立即被重定向到主页，并且在主页中首先应该在1秒内填充/更新SecondChart，并在2秒后填写/更新ThirdChart，最后2秒以后应该填写/更新FirstChart。所以总共需要5秒钟。

修改 This answer对我不起作用，因为当我异步加载图表时，JSF等待最慢的更新它们。好吧，总共需要5秒而不是9秒，但正如我所述“在主页上首先应该在1秒内填充/更新SecondChart，2秒后填充/更新ThirdChart，最后2秒后应填写FirstChart /更新”。但如果我按照第一个答案中描述的方式应用，它们都会在5秒内更新

This answer可能会被应用。我的意思是，只要用户点击登录按钮，服务器就可以收集数据并将数据推送到图表，并且可以通过p:remoteCommand按照here从支持bean更新数据。但我认为可能有一些更简单的方法，因为我认为很多人可能在此之前遇到过类似的问题。

感谢。

Answer 1

在用户请求时，不要做那么多繁重的工作，阻止UI ......至少在没有启动异步Ajax调用的情况下也是如此。使用带有async="true"的远程命令（在p:remoteCommand上），并让用户了解正在发生的事情（例如，使用p:poll）并添加某种形式的缓存。或者，接受订单，让预定的工作在后台处理订单，并在完成后向用户报告。

另见：

如何同时加载/更新JSF / PrimeFaces组件？

1 个答案: