9 Replies Latest reply on Aug 28, 2007 7:15 AM by Ilya Shaikovsky

    modalPanel performance issue

    vivian hu Novice

      I have a main page with a <rich:table>, and a few link at the tool bar above the table. and when you click on a "add" link, it pop up a wizard implemented with ModalPanel. What I found is, when I navigate from step 1 to step 2 in the wizard (the navigation is by adding navigation rule in faces-config.xml, the <rich:table> gets reloaded and the tabe data is refetched. Fetch a large table takes quite some time.

      Any way to avoid the datatable reloading but just modify the wizard?

      Main page:

      <h:form id="desktopForm">
       <div class="sample-container" >
      
       <!-- The values from the dropdown will be copied into these hidden fields when the form is submitted -->
       <h:inputHidden id="filterId" value="#{allDesktopBean.filterId}" />
       <h:inputHidden id="filterType" value="#{allDesktopBean.filterType}" />
       <h:inputHidden id="filterIdLabel" value="#{allDesktopBean.filterIdLabel}" />
       <h:inputHidden id="filterTypeLabel" value="#{allDesktopBean.filterTypeLabel}" />
       <h:inputHidden id="filterBothLabel" value="#{allDesktopBean.filterBothLabel}" />
      
       <table>
       <tr align="left">
       <td>
       <rich:toolBar styleClass="filterToolbar" id="toolbarId">
       <rich:toolBarGroup styleClass="filterToolbarGroup">
       <h:outputLink id="addDesktop" value="#"
       onclick="Richfaces.showModalPanel('addDesktopMp',{width:700,height:500, top:50});selectType();">
       <h:outputText value="#{bundle.Add}"/>
       </h:outputLink>
       <a4j:commandLink id="editDesktop"
       actionListener="#{desktopBean.populateData}"
       oncomplete="Richfaces.showModalPanel('addDesktopMp',{width:700,height:500, top:50});selectType();"
       reRender="addDesktopMp">
       <h:outputText value="#{bundle.Edit}"/>
       </a4j:commandLink>
       <a4j:commandLink id="entitle"
       oncomplete="Richfaces.showModalPanel('entitleMp',{width:400,height:520, top:50})"
       reRender="entitleMp" >
       <h:outputText value="#{bundle.Entitle}"/>
       </a4j:commandLink>
       <a4j:commandLink id="deleteDesktop"
       reRender="deleteDesktopMp"
       oncomplete="Richfaces.showModalPanel('deleteDesktopMp',{width:400,height:300, top:50});initializeDeleteRadioGroups()">
       <h:outputText value="#{bundle.DeleteDesktop}"/>
       </a4j:commandLink>
       </rich:toolBarGroup>
       <rich:toolBarGroup styleClass="filterToolbarGroup" location="right">
       <h:outputText id="filterFields" value="" />
       <h:graphicImage value="/images/downarrow.gif" style="cursor:pointer" onclick="toggleDropDown('desktopForm:filterFields','dropdownMenuFilter')"/>
       <h:inputText id="filterText" styleClass="barsearch" value="#{allDesktopBean.searchString}" />
       <a4j:commandButton id="goButton" styleClass="barsearchbutton" reRender="filterText,myTable" value="#{bundle.Go}" />
       <a4j:commandButton id="clearButton" styleClass="barsearchbutton"
       actionListener="#{allDesktopBean.clearFilter}"
       reRender="filterText,myTable"
       oncomplete="initializeCheckboxes();"
       value="#{bundle.Clear}" />
       </rich:toolBarGroup>
       </rich:toolBar>
       </td>
       </tr>
       <tr>
       <td>
       <rich:dataTable
       id="myTable"
       rows="20"
       onRowMouseOver="richTableRowMouseOver('desktopForm:myTable', this)"
       onRowMouseOut="richTableRowMouseOut('desktopForm:myTable', this)"
       onRowClick="richTableRowClick('desktopForm:myTable', this)"
       cellpadding="0" cellspacing="0" width="700" border="0"
       var="desktop"
       value="#{allDesktopBean.list}">
       <f:facet name="header">
       <rich:columnGroup>
       <rich:column>
       <a4j:commandLink value="#{bundle.DesktopId}" action="#{tableBean.sortColumn}" reRender="myTable">
       <f:param name="sortColumn" value="0"></f:param>
       </a4j:commandLink>
       </rich:column>
      
       <rich:column>
       <a4j:commandLink value="#{bundle.Type}" action="#{tableBean.sortColumn}" reRender="myTable" >
       <f:param name="sortColumn" value="1"></f:param>
       </a4j:commandLink>
       </rich:column>
       <rich:column>
       <a4j:commandLink value="#{bundle.Entitled}" action="#{tableBean.sortColumn}" reRender="myTable" >
       <f:param name="sortColumn" value="2"></f:param>
       </a4j:commandLink>
       </rich:column>
       <rich:column>
       <a4j:commandLink value="#{bundle.VirtualMachines}" action="#{tableBean.sortColumn}" reRender="myTable" >
       <f:param name="sortColumn" value="2"></f:param>
       </a4j:commandLink>
       </rich:column>
       <rich:column>
       <a4j:commandLink value="#{bundle.ActiveSessions}" action="#{tableBean.sortColumn}" reRender="myTable" >
       <f:param name="sortColumn" value="2"></f:param>
       </a4j:commandLink>
       </rich:column>
       </rich:columnGroup>
       </f:facet>
       <rich:column>
       <h:graphicImage value="/images/desktop-indiv.gif" rendered="#{desktop.indivitualType}"/>
       <h:graphicImage value="/images/desktop-pools_np.gif" rendered="#{desktop.nonPersistentType}"/>
       <h:graphicImage value="/images/desktop-pools-p.gif" rendered="#{desktop.persistentType}"/>
       <rich:spacer width="5px"></rich:spacer>
       <h:outputText value="#{desktop.id}" />
       </rich:column>
       <rich:column>
       <h:outputText value="#{desktop.type}" />
       </rich:column>
       <rich:column styleClass="cell-centered">
       <h:graphicImage value="/images/checkmark.gif" rendered="#{desktop.entitled}"/>
       </rich:column>
       <rich:column>
       <h:outputText value="#{desktop.vmCount}" />
       </rich:column>
       <rich:column>
       <h:outputText value="#{desktop.sessionCount}" />
       </rich:column>
       <rich:column style="display:none">
       <h:outputText value="#{desktop.id}" />
       </rich:column>
       </rich:dataTable>
       </td></tr>
       </table>
       <h:inputHidden id="selectedIdHidden" value="#{desktopBean.selectedId}"/>
       </div>
       </h:form>
      
       <rich:modalPanel id="addDesktopMp" minHeight="280" minWidth="300"
       height="400" width="1000" zindex="2000">
       <f:facet id="modalHeader" name="header">
       <h:outputText id="modalTitle" value="#{bundle.AddDesktop}" />
       </f:facet>
       <a4j:outputPanel id="wizard">
       <a4j:include id="includeId"
       viewId="/pages/desktop/addDesktopType.xhtml" />
       </a4j:outputPanel>
       </rich:modalPanel>
      


      First step in the wizard:
      <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
       xmlns:ui="http://java.sun.com/jsf/facelets"
       xmlns:h="http://java.sun.com/jsf/html"
       xmlns:f="http://java.sun.com/jsf/core"
       xmlns:rich="http://richfaces.ajax4jsf.org/rich"
       xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
       xmlns:c="http://java.sun.com/jstl/core">
      <f:loadBundle basename="com.vmware.vdi.admin.ui.messages.MessageBundle" var="bundle"/>
      <h:form id="typeForm">
       <rich:tree style="width:300px; display:none"
       value="#{desktopBean.dummyRoot}"
       var="item" nodeFace="leaf" ajaxSubmitSelection="true">
      
       <rich:treeNode type="leaf" >
       <h:outputText value="#{item.name}"/>
       <h:outputText value="#{item.id}" style="display:none"/>
       </rich:treeNode>
       </rich:tree>
      
       <a4j:keepAlive beanName="desktopBean" />
      
       <table>
       <tr>
       <td colspan="2" align="left">
       <h:outputText value="#{bundle.DesktopType}"/>
       </td>
       </tr>
       <tr>
       <td colspan="2" align="left">
       <h:outputText value="#{bundle.SelectDesktopType}"/>
       </td>
       </tr>
       <tr>
       <td colspan="2">
       <rich:spacer height="10px">
       </rich:spacer>
       </td>
       </tr>
       <tr>
       <td>
       <input type="radio" id="manualRadio" name="desktopTypeRadio" value="0"/>
       </td>
       <td>
       <h:outputText value="#{bundle.ManuallyProvisioned}"/>
       </td>
       </tr>
       <tr>
       <td></td>
       <td><h:outputText value="#{bundle.ManuallyProvDesc}"/></td>
       </tr>
       <tr>
       <td colspan="2">
       <rich:spacer height="10px">
       </rich:spacer>
       </td>
       </tr>
       <tr>
       <td>
       <input type="radio" id="stickyRadio" name="desktopTypeRadio" value="1"/>
       </td>
       <td>
       <h:outputText value="#{bundle.AutoProvSticky}"/>
       </td>
       </tr>
       <tr>
       <td></td>
       <td><h:outputText value="#{bundle.AutoProvStickyDesc}"/></td>
       </tr>
       <tr>
       <td colspan="2">
       <rich:spacer height="10px">
       </rich:spacer>
       </td>
       </tr>
       <tr>
       <td>
       <input type="radio" id="nonStickyRadio" name="desktopTypeRadio" value="2"/>
       </td>
       <td>
       <h:outputText value="#{bundle.AutoProvNonSticky}"/>
       </td>
       </tr>
       <tr>
       <td></td>
       <td><h:outputText value="#{bundle.AutoProvNonStickyDesc}"/></td>
       </tr>
       <tr>
       <td colspan="2">
       <rich:spacer height="20px">
       </rich:spacer>
       </td>
       </tr>
       <tr>
       <td colspan="2" align="center">
       <h:graphicImage id="progress" value="/images/indicator.gif" style="display:none"/>
       <a4j:commandButton value="#{bundle.Next}"
       action="next"
       onclick="showComponent('includeId:typeForm:progress','inline');saveRadioSelection();"
       reRender="wizard"/>
       <rich:spacer width="5px">
       </rich:spacer>
       <a4j:commandButton
       action="cancel"
       actionListener="#{desktopBean.cancel}"
       value="#{bundle.Cancel}"
       oncomplete="Richfaces.hideModalPanel('addDesktopMp');"
       reRender="wizard"/>
       </td>
       </tr>
       </table>
       <h:inputHidden id="selectedType" value="#{desktopBean.type}"/>
       <h:inputHidden id="editingId" value="#{desktopBean.id}"/>
       <script>
       selectType();
       disableWhenEditing();
      
       function disableWhenEditing() {
       var stickyRadio = document.getElementById("stickyRadio");
       var nonStickyRadio = document.getElementById("nonStickyRadio");
       var manualRadio = document.getElementById("manualRadio");
       var editingId = document.getElementById("includeId:typeForm:editingId").value;
       if (!isEmpty(editingId)) {
       stickyRadio.disabled = true;
       nonStickyRadio.disabled = true;
       manualRadio.disabled = true;
       } else {
       stickyRadio.disabled = false;
       nonStickyRadio.disabled = false;
       manualRadio.disabled = false;
       }
       }
       </script>
      </h:form>
      </jsp:root>
      


      navigation rule in richFaces-cofig.xml
       <navigation-rule>
       <from-view-id>/pages/desktop/addDesktopType.xhtml</from-view-id>
       <navigation-case>
       <from-action>next</from-action>
       <to-view-id>/pages/desktop/addDesktopName.xhtml</to-view-id>
       </navigation-case>
       <navigation-case>
       <from-action>cancel</from-action>
       <to-view-id>/pages/desktop/addDesktopType.xhtml</to-view-id>
       </navigation-case>
       </navigation-rule>
      


        • 1. Re: modalPanel performance issue
          Ilya Shaikovsky Master

          Did you mean that the table on the parent page getting updated? try to wrap your a4j:include to the a4j:region.

          And b.t.w. from the 1.1.1 a4j version - it isn't nesessary to wrap the include and rerender the parent. Just use the navigation as always.

          • 2. Re: modalPanel performance issue
            vivian hu Novice

            adding a a4j:region did help. I can't tell if the parent table is reRender or not but I see it is calling my backend bean to fetch the list for the table.
            Please help, this is a big performance issue for us now.

            • 3. Re: modalPanel performance issue
              Igor Shabalov Apprentice

              Pls post your new page (with region). Look on which phases your list was called (stack trace will be helpful).

              • 4. Re: modalPanel performance issue
                vivian hu Novice

                Here is the stack trace.

                Thread [http-8080-Processor23] (Suspended (breakpoint at line 41 in AllDesktopBean))
                 AllDesktopBean.getList() line: 41
                 GeneratedMethodAccessor60.invoke(Object, Object[]) line: not available
                 DelegatingMethodAccessorImpl.invoke(Object, Object[]) line: 25
                 Method.invoke(Object, Object...) line: 597
                 PropertyResolverImpl.getValue(Object, Object) line: 79
                 LegacyELContext$LegacyELResolver.getValue(ELContext, Object, Object) line: 141
                 AstValue.getValue(EvaluationContext) line: 117
                 ValueExpressionImpl.getValue(ELContext) line: 192
                 TagValueExpression.getValue(ELContext) line: 71
                 ForEachHandler.apply(FaceletContext, UIComponent) line: 120
                 CompositeFaceletHandler.apply(FaceletContext, UIComponent) line: 47
                 ChooseWhenHandler.apply(FaceletContext, UIComponent) line: 45
                 ChooseHandler.apply(FaceletContext, UIComponent) line: 68
                 CompositeFaceletHandler.apply(FaceletContext, UIComponent) line: 47
                 NamespaceHandler.apply(FaceletContext, UIComponent) line: 49
                 EncodingHandler.apply(FaceletContext, UIComponent) line: 25
                 DefaultFacelet.include(DefaultFaceletContext, UIComponent) line: 248
                 DefaultFacelet.include(DefaultFaceletContext, UIComponent, URL) line: 294
                 DefaultFacelet.include(DefaultFaceletContext, UIComponent, String) line: 273
                 DefaultFaceletContext.includeFacelet(UIComponent, String) line: 143
                 IncludeHandler.applyNextHandler(FaceletContext, UIComponent) line: 85
                 IncludeHandler(ComponentHandler).apply(FaceletContext, UIComponent) line: 165
                 ComponentHandler.applyNextHandler(FaceletContext, UIComponent) line: 295
                 ComponentHandler.apply(FaceletContext, UIComponent) line: 165
                 CompositeFaceletHandler.apply(FaceletContext, UIComponent) line: 47
                 NamespaceHandler.apply(FaceletContext, UIComponent) line: 49
                 CompositeFaceletHandler.apply(FaceletContext, UIComponent) line: 47
                 EncodingHandler.apply(FaceletContext, UIComponent) line: 25
                 DefaultFacelet.apply(FacesContext, UIComponent) line: 95
                 FaceletViewHandler.buildView(FacesContext, UIViewRoot) line: 510
                 FaceletViewHandler.renderView(FacesContext, UIViewRoot) line: 553
                 AjaxViewHandler(ViewHandlerWrapper).renderView(FacesContext, UIViewRoot) line: 108
                 AjaxViewHandler.renderView(FacesContext, UIViewRoot) line: 233
                 RenderResponsePhase.execute(FacesContext) line: 87
                 LifecycleImpl.phase(PhaseId, Phase, FacesContext) line: 200
                 LifecycleImpl.render(FacesContext) line: 117
                 FacesServlet.service(ServletRequest, ServletResponse) line: 198
                 ApplicationFilterChain.internalDoFilter(ServletRequest, ServletResponse) line: 252
                 ApplicationFilterChain.doFilter(ServletRequest, ServletResponse) line: 173
                 TidyXMLFilter(BaseXMLFilter).doXmlFilter(FilterChain, HttpServletRequest, HttpServletResponse) line: 127
                 Filter(BaseFilter).doFilter(ServletRequest, ServletResponse, FilterChain) line: 277
                 ApplicationFilterChain.internalDoFilter(ServletRequest, ServletResponse) line: 202
                 ApplicationFilterChain.doFilter(ServletRequest, ServletResponse) line: 173
                 LoginFilter.doFilter(ServletRequest, ServletResponse, FilterChain) line: 41
                 ApplicationFilterChain.internalDoFilter(ServletRequest, ServletResponse) line: 202
                 ApplicationFilterChain.doFilter(ServletRequest, ServletResponse) line: 173
                 StandardWrapperValve.invoke(Request, Response) line: 213
                 StandardContextValve.invoke(Request, Response) line: 178
                 StandardHostValve.invoke(Request, Response) line: 126
                 ErrorReportValve.invoke(Request, Response) line: 105
                 StandardEngineValve.invoke(Request, Response) line: 107
                 CoyoteAdapter.service(Request, Response) line: 148
                 Http11Processor.process(InputStream, OutputStream) line: 869
                 Http11Protocol$JmxHttp11ConnectionHandler(Http11BaseProtocol$Http11ConnectionHandler).processConnection(TcpConnection, Object[]) line: 664
                 PoolTcpEndpoint.processSocket(Socket, TcpConnection, Object[]) line: 527
                 LeaderFollowerWorkerThread.runIt(Object[]) line: 80
                 ThreadPool$ControlRunnable.run() line: 684
                 ThreadWithAttributes(Thread).run() line: 619
                
                


                Here is the main page.
                <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
                 xmlns:ui="http://java.sun.com/jsf/facelets"
                 xmlns:h="http://java.sun.com/jsf/html"
                 xmlns:f="http://java.sun.com/jsf/core"
                 xmlns:rich="http://richfaces.ajax4jsf.org/rich"
                 xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
                 xmlns:c="http://java.sun.com/jstl/core">
                
                 <f:loadBundle basename="com.vmware.vdi.admin.ui.messages.MessageBundle" var="bundle"/>
                
                 <h:form id="desktopForm">
                 <div class="sample-container" >
                
                 <!-- The values from the dropdown will be copied into these hidden fields when the form is submitted -->
                 <h:inputHidden id="filterId" value="#{allDesktopBean.filterId}" />
                 <h:inputHidden id="filterType" value="#{allDesktopBean.filterType}" />
                 <h:inputHidden id="filterIdLabel" value="#{allDesktopBean.filterIdLabel}" />
                 <h:inputHidden id="filterTypeLabel" value="#{allDesktopBean.filterTypeLabel}" />
                 <h:inputHidden id="filterBothLabel" value="#{allDesktopBean.filterBothLabel}" />
                
                 <table>
                 <tr align="left">
                 <td>
                 <rich:toolBar styleClass="filterToolbar" id="toolbarId">
                 <rich:toolBarGroup styleClass="filterToolbarGroup">
                 <h:outputLink id="addDesktop" value="#"
                 onclick="Richfaces.showModalPanel('addDesktopMp',{width:700,height:500, top:50});selectType();">
                 <h:outputText value="#{bundle.Add}"/>
                 </h:outputLink>
                 <a4j:commandLink id="editDesktop"
                 ignoreDupResponses="true"
                 actionListener="#{desktopBean.populateData}"
                 oncomplete="Richfaces.showModalPanel('addDesktopMp',{width:700,height:500, top:50});selectType();"
                 reRender="addDesktopMp">
                 <h:outputText value="#{bundle.Edit}"/>
                 </a4j:commandLink>
                 <a4j:commandLink id="entitle"
                 ignoreDupResponses="true"
                 oncomplete="Richfaces.showModalPanel('entitleMp',{width:400,height:520, top:50})"
                 reRender="entitleMp" >
                 <h:outputText value="#{bundle.Entitle}"/>
                 </a4j:commandLink>
                 <a4j:commandLink id="deleteDesktop"
                 ignoreDupResponses="true"
                 reRender="deleteDesktopMp"
                 oncomplete="Richfaces.showModalPanel('deleteDesktopMp',{width:400,height:300, top:50});initializeDeleteRadioGroups()">
                 <h:outputText value="#{bundle.DeleteDesktop}"/>
                 </a4j:commandLink>
                 </rich:toolBarGroup>
                 <rich:toolBarGroup styleClass="filterToolbarGroup" location="right">
                 <h:outputText id="filterFields" value="" />
                 <h:graphicImage value="/images/downarrow.gif" style="cursor:pointer" onclick="toggleDropDown('desktopForm:filterFields','dropdownMenuFilter')"/>
                 <h:inputText id="filterText" styleClass="barsearch" value="#{allDesktopBean.searchString}" />
                 <a4j:commandButton id="goButton" styleClass="barsearchbutton" reRender="filterText,myTable" value="#{bundle.Go}" />
                 <a4j:commandButton id="clearButton" styleClass="barsearchbutton"
                 actionListener="#{allDesktopBean.clearFilter}"
                 reRender="filterText,myTable"
                 oncomplete="initializeCheckboxes();"
                 value="#{bundle.Clear}" />
                 </rich:toolBarGroup>
                 </rich:toolBar>
                 </td>
                 </tr>
                 <tr>
                 <td>
                 <rich:dataTable
                 id="myTable"
                 rows="20"
                 onRowMouseOver="richTableRowMouseOver('desktopForm:myTable', this)"
                 onRowMouseOut="richTableRowMouseOut('desktopForm:myTable', this)"
                 onRowClick="richTableRowClick('desktopForm:myTable', this)"
                 cellpadding="0" cellspacing="0" width="700" border="0"
                 var="desktop"
                 value="#{allDesktopBean.list}">
                 <f:facet name="header">
                 <rich:columnGroup>
                 <rich:column>
                 <h:outputText value="#{bundle.DesktopId}" />
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{bundle.Type}" />
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{bundle.Entitled}" />
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{bundle.VirtualMachines}" />
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{bundle.ActiveSessions}" />
                 </rich:column>
                 </rich:columnGroup>
                 </f:facet>
                 <rich:column>
                 <h:graphicImage value="/images/desktop-indiv.gif" rendered="#{desktop.indivitualType}"/>
                 <h:graphicImage value="/images/desktop-pools_np.gif" rendered="#{desktop.nonPersistentType}"/>
                 <h:graphicImage value="/images/desktop-pools-p.gif" rendered="#{desktop.persistentType}"/>
                 <rich:spacer width="5px"></rich:spacer>
                 <h:outputText value="#{desktop.id}" />
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{desktop.type}" />
                 </rich:column>
                 <rich:column styleClass="cell-centered">
                 <h:graphicImage value="/images/checkmark.gif" rendered="#{desktop.entitled}"/>
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{desktop.vmCount}" />
                 </rich:column>
                 <rich:column>
                 <h:outputText value="#{desktop.sessionCount}" />
                 </rich:column>
                 <rich:column style="display:none">
                 <h:outputText value="#{desktop.id}" />
                 </rich:column>
                 </rich:dataTable>
                 </td></tr>
                 </table>
                 <h:inputHidden id="selectedIdHidden" value="#{desktopBean.selectedId}"/>
                 </div>
                 </h:form>
                 <a4j:region>
                 <rich:modalPanel id="addDesktopMp" minHeight="280" minWidth="300"
                 height="400" width="1000" zindex="2000">
                 <f:facet id="modalHeader" name="header">
                 <h:outputText id="modalTitle" value="#{bundle.AddDesktop}" />
                 </f:facet>
                 <a4j:outputPanel id="wizard">
                 <a4j:include id="includeId"
                 viewId="/pages/desktop/addDesktopType.xhtml" />
                 </a4j:outputPanel>
                 </rich:modalPanel>
                 </a4j:region>
                .............
                


                • 5. Re: modalPanel performance issue
                  vivian hu Novice

                  The problem is still, when I click on "Next" on the first step of the wizard, my bean getList() is called, the list is to show the table entries in the main page, which I think it is not rendered, so getList() shouldn't be called.

                  • 7. Re: modalPanel performance issue
                    Sergey Smirnov Master

                    My answer will be pretty useless, I guess. However,
                    do you believe somebody can compile, debug this huge amount of code in his mind and find the problem while you cannot do it siting in front of your computer using the modern JDK twelve days long?

                    • 8. Re: modalPanel performance issue
                      vivian hu Novice

                      OK. Here is a simple test case, you should be able to reproduce it. Is it a bug? If so, it is a bad bug.

                      using a4j 1.1.1, RichFaces3.0.1

                      main page.

                      <html xmlns="http://www.w3.org/1999/xhtml"
                       xmlns:ui="http://java.sun.com/jsf/facelets"
                       xmlns:h="http://java.sun.com/jsf/html"
                       xmlns:f="http://java.sun.com/jsf/core"
                       xmlns:rich="http://richfaces.ajax4jsf.org/rich"
                       xmlns:a4j="https://ajax4jsf.dev.java.net/ajax">
                      <head>
                       <meta http-equiv="Content-Type" content="text/xhtml; charset=UTF-8" />
                      </head>
                      <body id="public">
                       <div id="content">
                       <h:form id="loginForm">
                       <h:outputLink id="addDesktop" value="#"
                       onclick="Richfaces.showModalPanel('addDesktopMp',{width:700,height:500, top:50});">
                       <h:outputText value="add"/>
                       </h:outputLink>
                      
                       <rich:dataTable
                       id="myTable"
                       rows="20"
                       cellpadding="0" cellspacing="0" width="700" border="0"
                       var="desktop"
                       value="#{testBean.list}">
                       <f:facet name="header">
                       <rich:columnGroup>
                       <rich:column>
                       <h:outputText value="name" />
                       </rich:column>
                       </rich:columnGroup>
                       </f:facet>
                       <rich:column>
                       <h:outputText value="#{desktop}" />
                       </rich:column>
                       </rich:dataTable>
                       </h:form>
                      
                       <rich:modalPanel id="addDesktopMp" minHeight="280" minWidth="300"
                       height="400" width="1000" zindex="2000">
                       <a4j:outputPanel id="wizard">
                       <a4j:include id="includeId"
                       viewId="/pages/desktop/step1.xhtml" />
                       </a4j:outputPanel>
                       </rich:modalPanel>
                       </div>
                      </body>
                      </html>
                      
                      


                      wizard step 1
                      <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
                       xmlns:ui="http://java.sun.com/jsf/facelets"
                       xmlns:h="http://java.sun.com/jsf/html"
                       xmlns:f="http://java.sun.com/jsf/core"
                       xmlns:rich="http://richfaces.ajax4jsf.org/rich"
                       xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
                       xmlns:c="http://java.sun.com/jstl/core">
                      <h:form id="step1Form">
                       <div>
                       this is the step 1 of wizard.
                       </div>
                       <br></br>
                       <a4j:commandButton value="Next"
                       id="nextBtn"
                       action="next"
                       reRender="wizard"/>
                      </h:form>
                      </jsp:root>
                      


                      wizard step 2.
                      <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
                       xmlns:ui="http://java.sun.com/jsf/facelets"
                       xmlns:h="http://java.sun.com/jsf/html"
                       xmlns:f="http://java.sun.com/jsf/core"
                       xmlns:rich="http://richfaces.ajax4jsf.org/rich"
                       xmlns:a4j="https://ajax4jsf.dev.java.net/ajax"
                       xmlns:c="http://java.sun.com/jstl/core">
                      <h:form id="step2Form">
                       <div>
                       this is the step 2 of wizard.
                       </div>
                      </h:form>
                      </jsp:root>
                      


                      bean
                      package com.vmware.vdi.admin.ui;
                      
                      import java.util.ArrayList;
                      
                      /**
                       * @author vivian
                       * This class support the display of all desktop.
                       */
                      public class TestBean {
                       public TestBean() {
                       System.out.println("a new bean is created.");
                       }
                      
                       public ArrayList<String> getList() {
                       ArrayList<String> list = new ArrayList<String>();
                       for (int i=0; i<40; i++) {
                       list.add("name" + i);
                       }
                       return list;
                       }
                      
                      
                      }
                      


                      • 9. Re: modalPanel performance issue
                        Ilya Shaikovsky Master

                        A few perfomance issues was solved before 3.1.0 RC3.. So just check it.