Primefaces中Tree組件的性能問題

Question

在我的應用程序中，我需要渲染一棵樹，其中數據存在於層次結構中，並且該樹包含多選復選框。 到目前為止，代碼運行良好，但是出現了一個新的用例，其中需要呈現大量數據。 我已經檢查了客戶端和服務器端消耗的時間。 服務器端代碼花費的時間不到一秒鍾，但是客戶端無法渲染樹，並且服務器發送響應后瀏覽器便停止工作。 我也嘗試過使用TreeTable組件，但是面臨相同的問題。 我認為問題是由於服務器一口氣發送了完整的數據，而與存儲值的層次結構無關。 所需的初始視圖是，在擴展特定數據元素時，僅應顯示頂層數據，並且層次結構中的下一層數據需要顯示。 客戶端是否可能只在第一個匹配中獲取頂級數據，並且每當用戶擴展任何級別時，都應該僅針對該特定父數據獲取下一個數據。

Primefaces是否有其他任何組件可以解決目的？

<p:dialog widgetVar="treeModal" header="Parameter's Values"
        styleClass="ui-dialog-small-mid" resizable="false" modal="true">
        <p:messages id="myMessagePopup" autoUpdate="true" closable="true"
            escape="false" />
        <h:form id="treeModalForm">
            <div class="ui-dialog-inner parameter_dialog dialog-h400">
                <p:tree value="#{bean.dailogGroupInfo.genericUnitTree}"
                    var="node"
                    rendered="#{bean.dailogGroupInfo.genericTreeRendered}"
                    selectionMode="checkbox"
                    selection="#{bean.dailogGroupInfo.selectedGenericUnitNodes}"
                    paginator="true" rows="5">
                    <p:treeNode>
                        <h:outputText value="#{node.valueName}" />
                    </p:treeNode>
                </p:tree>
            </div>
            <div class="button_row">
                <p:commandButton styleClass="btn btn-primary" value="Add"
                    id="addButton"
                    action="#{action.addValuesToGenericTree}">
                </p:commandButton>
                <p:commandButton styleClass="btn" value="Cancel"
                    onclick="scrollUp();" id="cancelButton"
                    oncomplete="PF('treeModal').hide()" required="true" />
            </div>
        </h:form>
</p:dialog>

Java代碼：

List<parameterTO> parameterTOList = bean.getParameterTOlist();
            List<Info> infoTOlist = new ArrayList<Info>();

            for (parameterTO gpTO : parameterTOList) {

                Info info = new Info();
                ParamInitTO paramInitTO = new ParamInitTO();
                paramInitTO.setParameterTO(gpTO);
                serviceRequest.setRequestTO(paramInitTO);
                serviceResponse = facadeRemote.getIntialParamForOrg(serviceRequest);
                genericUnitTOList = (List<GenericUnitTO>) serviceResponse.getResponseTOList();

                info.setParameterTO(gpTO);
                TreeNode genericUnitTree = null;
                if (gpTO.getEntityNameParentLabel() != null) {
                    Map<Integer, List<GenericUnitTO>> genericUnitMap = Helper
                            .converGenericUnitTOIntoMap(genericUnitTOList);
                    genericUnitTree = Helper.convertIntoGenericUnitTree(genericUnitMap, info);
                } else {
                    genericUnitTree = Helper.convertIntoGenericUnitTree(genericUnitTOList, info);
                }
                info.setGenericUnitTree(genericUnitTree);

                infoTOlist.add(groupInfo);
                }
            bean.setInfolist(infoTOlist);

            TreeNode[] selectedGenericNodes = infoTOlist.getSelectedGenericUnitNodes();
            List<valueTO> genericUnitShowList = infoTOlist.getGenricUnitShowList();
            selectedGenericNodes = helper.getActualselectedNodes(selectedGenericNodes, genericUnitShowList);
            infoTOlist.setSelectedGenericUnitNodes(selectedGenericNodes);
            if (selectedGenericNodes != null) {
                helper.SetNodeChecked(infoTOlist.getGenericUnitTree(), infoTOlist.getSelectedGenericUnitNodes());
            }
            bean.setDailogInfo(infoTOlist);

Answer 1

您可以實現延遲加載子節點，以減少加載的數據量：

<p:ajax event="expand" process="@this" listener="#{controller.onNodeExpand}" />

public void onNodeExpand(NodeExpandEvent event)
{
    TreeNode node = event.getTreeNode();
    node.getChildren().clear();
    node.getChildren().add(new ....);
}