Pessoal tenho uma página de cadastro de usuários que tem o componente <p:tree> do primefaces porem essa página esta lenta para abrir, alguem sabe o motivo abaixo vou postar o código da página:
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:f="http://java.sun.com/jsf/core">
<h:head>
<link rel="stylesheet" type="text/css" href="#{facesContext.externalContext.request.contextPath}/resources/css/cadastros.css"/>
<h:outputScript name="jquery.js" library="js" target="head"/>
</h:head>
<h:body>
<ui:composition template="/WEB-INF/template.xhtml">
<ui:define name="conteudoPrincipal">
<!-- Formulário para exibição dos dados-->
<h:form id="formGerenciamentoUser">
<p:growl id="growl"/>
<p:dataTable id="tableUsuarios" var="usuarios" value="#{gerenciamentoUserMB.usuarios}"
paginator="true" rows="10"
rowKey="#{usuarios.idUsuario}"
selection="#{gerenciamentoUserMB.usuario}"
selectionMode="single"
resizableColumns="true"
emptyMessage="Nenhum registro encontrado na base de dados"
scrollable="true"
styleClass="rodape"
scrollHeight="500"
paginatorTemplate="{FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
rowsPerPageTemplate="5,10,15,20,30,40,50,60"
paginatorPosition="bottom">
<!-- Evento disparado para o servidor toda vez que uma linha for selecionada na datatable -->
<p:ajax event="rowSelect" update=":formGerenciamentoUser:btnEditar :formGerenciamentoUser:btnExcluir :formGerenciamentoUser:btnVisualizar" listener="#{gerenciamentoUserMB.onRowSelect}"/>
<!-- Evento disparado para o servidor toda vez que ocorrer uma paginção na datatable -->
<p:ajax event="page" update=":formGerenciamentoUser:tableUsuarios :formGerenciamentoUser:btnEditar :formGerenciamentoUser:btnExcluir :formGerenciamentoUser:btnVisualizar" listener="#{gerenciamentoUserMB.pageEvent}"/>
<f:facet name="header">
Gerenciamento de Usuários
</f:facet>
<p:column headerText="Id" rendered="false" >
#{usuarios.idUsuario}
</p:column>
<p:column headerText="Senha" rendered="false" >
#{usuarios.senha}
</p:column>
<p:column headerText="Login" width="350">
#{usuarios.login}
</p:column>
<p:column headerText="Nome" width="350">
#{usuarios.nome}
</p:column>
<p:column headerText="Telefone" width="400">
#{usuarios.telefone}
</p:column>
</p:dataTable>
<p:separator/>
<fieldset id="barraBotoes" style="float: right; border: none;">
<p:commandButton id="btnCadastrar" value="Cadastrar" disabled="false" oncomplete="dlgCadUser.show();" style="margin: 5px;"/>
<p:commandButton id="btnEditar" value="Editar" disabled="#{gerenciamentoUserMB.btnEditar}" update=":formEditUser:dialogEditUser" oncomplete="dlgEditUser.show();" style="margin: 5px;"/>
<p:commandButton id="btnExcluir" value="Excluir" disabled="#{gerenciamentoUserMB.btnExluir}" update=":formExcluirUser:confirmDialogExluirUser" oncomplete="confirExclusaoUser.show();" style="margin: 5px;"/>
<p:commandButton id="btnVisualizar" value="Visualizar" disabled="#{gerenciamentoUserMB.btnVisualizar}" update=":formVisuUser:pngVisualizar" oncomplete="dlgVisuUser.show();" style="margin: 5px;"/>
</fieldset>
</h:form>
<!-- Formulário onde o usuário podera visualizar os detalhes de um determinado
usuário-->
<h:form id="formVisuUser">
<p:dialog header="Visualizar Detalhes do Usuário" widgetVar="dlgVisuUser" resizable="false" id="dlgVisuUser" modal="true">
<h:inputHidden value="#{gerenciamentoUserMB.usuario.senha}" id="idSenha"/>
<h:panelGrid id="pngVisualizar" columns="2" cellpadding="4" >
<h:outputLabel value="Login:" style="float: right;"/>
<p:inputText value="#{gerenciamentoUserMB.usuario.login}" disabled="true" style="width: 220px;font-weight:bold; "/>
<h:outputLabel value="Senha:" style="float: right;"/>
<p:password value="#{gerenciamentoUserMB.usuario.senha}" redisplay="true" disabled="true" style="width: 220px;font-weight:bold; "/>
<h:outputLabel value="Nome:" style="float: right;"/>
<p:inputText value="#{gerenciamentoUserMB.usuario.nome}" disabled="true" style="width: 220px;font-weight:bold; "/>
<h:outputLabel value="Telefone:" style="float: right;"/>
<p:inputMask value="#{gerenciamentoUserMB.usuario.telefone}" disabled="true" mask="([telefone removido]" style="width: 220px;font-weight:bold; "/>
</h:panelGrid>
<p:separator/>
<p:commandButton value="Ok" disabled="true" />
<p:commandButton value="Cancelar" onclick="dlgVisuUser.hide();"/>
</p:dialog>
</h:form>
<!-- Formulário onde o usuário poderá cadastrar um determinado usuário-->
<h:form id="formCadUser">
<p:dialog header="Cadastrar Usuário" widgetVar="dlgCadUser" resizable="false" id="dialogCadUser" modal="true">
<p:messages id="msgTelaCadUser" autoUpdate="true"/>
<h:panelGrid id="pngEdit" columns="2" cellpadding="4">
<h:outputLabel value="Login:" style="float: left; font-weight: bold"/>
<p:inputText value="#{gerenciamentoUserMB.usuario.login}" required="true" requiredMessage="O campo Login é obrigatório" disabled="false" style="width: 395px;font-weight:bold; "/>
<h:outputLabel value="Senha:" style="float: left;font-weight: bold"/>
<p:password value="#{gerenciamentoUserMB.usuario.senha}" redisplay="true" required="true" requiredMessage="O campo Senha é obrigatório" disabled="false" feedback="true" promptLabel="Senha" weakLabel="Fraca" goodLabel="Boa" strongLabel="Excelente" style="width: 395px;font-weight:bold; "/>
<h:outputLabel value="Nome:" style="float: left;font-weight: bold"/>
<p:inputText value="#{gerenciamentoUserMB.usuario.nome}" required="true" requiredMessage="O campo Nome é obrigatório" disabled="false" style="width: 395px;font-weight:bold; "/>
<h:outputLabel value="Telefone:" style="float: left;font-weight: bold"/>
<p:inputMask value="#{gerenciamentoUserMB.usuario.telefone}" disabled="false" mask="([telefone removido]" style="width: 395px; font-weight:bold; "/>
</h:panelGrid>
<p:separator/>
<h:panelGrid columns="2">
<p:fieldset legend="Grupos">
<p:pickList id="pListPermissoes" value="#{gerenciamentoUserMB.userGrupos}" var="userGrupos" converter="convertString2Grupo"
itemLabel="#{userGrupos.nome}" itemValue="#{userGrupos.idGrupo}">
</p:pickList>
</p:fieldset>
<p:fieldset legend="Permissões" toggleable="true" style="height: 245px; width: 450px;">
<div id="divPermissoes" style="height: 210px; overflow: auto !important;" >
<p:tree value="#{gerenciamentoUserMB.nodeRoot}" var="node" id="checkboxTree"
selectionMode="checkbox"
selection="#{gerenciamentoUserMB.selectedNodes}"
style="overflow: auto !important; width: 95%; margin: 0 auto;">
<p:treeNode>
<h:outputText value="#{node}" />
</p:treeNode>
</p:tree>
</div>
</p:fieldset>
</h:panelGrid>
<p:separator/>
<p:commandButton value="OK" action="#{gerenciamentoUserMB.salvar}" update="formCadUser:dialogCadUser" oncomplete="handleCadUserRequest(xhr, status, args);" style="width: 100px !important; margin-left: 2px;"/>
<p:commandButton value="Cancelar" onclick="dlgCadUser.hide();" style="width: 100px !important; margin-left: 20px;"/>
</p:dialog>
<script type="text/javascript">
function handleCadUserRequest(xhr, status, args) {
if (args.validationFailed || !args.FECHAR || args.FECHAR == undefined) {
dlgCadUser.show();
} else {
dlgCadUser.hide();
}
}
</script>
</h:form>
<!-- Formulário onde o usuário podera editar os detalhes de um determinado
usuário-->
<h:form id="formEditUser">
<p:dialog header="Editar Usuário" widgetVar="dlgEditUser" resizable="false" id="dialogEditUser" modal="true" >
<p:messages id="msgTeladitUser" autoUpdate="true"/>
<h:inputHidden value="#{gerenciamentoUserMB.usuario.idUsuario}" id="idUser"/>
<h:inputHidden value="#{gerenciamentoUserMB.usuario.senha}" id="idSenha"/>
<h:panelGrid id="pngEdit" columns="2" cellpadding="4" >
<h:outputLabel value="Login:" style="float: right;"/>
<p:inputText value="#{gerenciamentoUserMB.usuario.login}" required="true" requiredMessage="O campo Login é obrigatório" disabled="false" style="width: 220px;font-weight:bold; "/>
<h:outputLabel value="Senha:" style="float: right;"/>
<p:password value="#{gerenciamentoUserMB.usuario.senha}" redisplay="true" required="true" requiredMessage="O campo Senha é obrigatório" disabled="false" feedback="true" promptLabel="Senha" weakLabel="Fraca" goodLabel="Boa" strongLabel="Excelente" style="width: 220px;font-weight:bold; "/>
<h:outputLabel value="Nome:" style="float: right;"/>
<p:inputText value="#{gerenciamentoUserMB.usuario.nome}" required="true" requiredMessage="O campo Nome é obrigatório" disabled="false" style="width: 220px;font-weight:bold; "/>
<h:outputLabel value="Telefone:" style="float: right;"/>
<p:inputMask value="#{gerenciamentoUserMB.usuario.telefone}" disabled="false" mask="([telefone removido]" style="width: 220px;font-weight:bold; "/>
</h:panelGrid>
<p:separator/>
<p:fieldset legend="Grupos">
<p:pickList id="pListPermissoes" value="#{gerenciamentoUserMB.userGrupos}" var="userGrupos" converter="convertString2Grupo"
itemLabel="#{userGrupos.nome}" itemValue="#{userGrupos.idGrupo}">
</p:pickList>
</p:fieldset>
<p:separator/>
<p:commandButton value="OK" action="#{gerenciamentoUserMB.editar}" oncomplete="handleEditUserRequest(xhr, status, args);"/>
<p:commandButton value="Cancelar" action="#{gerenciamentoUserMB.cancela}" oncomplete="handleEditUserRequest(xhr, status, args);"/>
</p:dialog>
<script type="text/javascript">
function handleEditUserRequest(xhr, status, args) {
if (args.validationFailed || !args.FECHAR || args.FECHAR == undefined) {
dlgEditUser.show();
} else {
dlgEditUser.hide();
}
}
</script>
</h:form>
<!-- Dialog para confirmação de exclusão de um determindo usuário-->
<h:form id="formExcluirUser">
<p:confirmDialog id="confirmDialogExluirUser" message="Deseja realmente excluir o usuário #{gerenciamentoUserMB.usuario.nome}?"
header="Excluir Usuário" severity="alert" widgetVar="confirExclusaoUser">
<h:inputHidden value="#{gerenciamentoUserMB.usuario.idUsuario}"/>
<p:commandButton id="confirm" value="Sim" update=":formGerenciamentoUser:tableUsuarios :formGerenciamentoUser:btnEditar :formGerenciamentoUser:btnExcluir :formGerenciamentoUser:btnVisualizar :formGerenciamentoUser:growl" oncomplete="confirExclusaoUser.hide();"
actionListener="#{gerenciamentoUserMB.deletar(gerenciamentoUserMB.usuario.idUsuario)}" />
<p:commandButton id="decline" value="Não" onclick="confirExclusaoUser.hide();" type="button" />
</p:confirmDialog>
</h:form>
</ui:define>
</ui:composition>
</h:body>
</html>