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 ....);
}

Primefaces中的Tree组件的性能问题

1 个答案: