如何在Primefaces轮播中动态加载图像

Question

我目前正在使用Primefaces开发一个应用程序。在我的应用程序中，我有一个显示人物图像的轮播。现在，图像数量可以在1到n之间变化。随着图像的增加，当然，流量也会增加，UI加载所需的时间也会增加。我的代码如下：

<h:panelGroup style="width: auto; float: center;" layout="block">
                    <p:carousel id="mycarousel" styleClass="carouselSelector"
                        value="#{travellerMB.faceResponse.biometricIdentities}"
                        var="trvdoc" responsive="true" numVisible="1">
                        <p:lightBox id="lightBox">
                            <h:outputLink
                                value="data:image/jpeg;base64,#{trvdoc.imageBase64}">
                                <h:graphicImage
                                    value="data:image/jpeg;base64,#{trvdoc.imageBase64}"
                                    style="height:170px;width:auto;border:0px" />
                            </h:outputLink>
                        </p:lightBox>
                    </p:carousel>
                </h:panelGroup>

我现在要做的是，从Web服务中获取所有图像，将其存储在一个会话中，但是每3个图像都要进行一次延迟加载，以减少负载。

根据我阅读的文章，素面中的轮播不支持延迟加载。 我使用轮播仅显示图像，然后使用灯箱放大图像。如何使用素面的任何其他组件（也支持延迟加载）获得相似的结果。 按照我的说法，我知道数据表可以用于延迟加载，但是我无法提出一种在我的方案中使用它的方法。