在Ext JS包示例目錄的ux目錄下有一個Ext.ux.GroupTabPanel組件，可實現左側分組顯示菜單。這個組件有個小問題，就是在第一次渲染的時候，會把所有標簽頁都渲染了。這對有很多標簽頁的應用程序很不利，第一渲染的時間成本太高。 在Ext.ux.GroupTabPanel內部是使用卡片（Card）布局來實現標簽頁的切換的，但是作者在定義卡片布局的時候，并沒有設置為可以延遲渲染，而是使用了默認了非延遲渲染，因而，修改的基本思路就是改變布局的設置。 在GroupTabPanel.js文件的initComponent方法內，在items內定義兩個一個樹面板和一個容器，其中的容器就是用來顯示標簽頁的，但它的布局定義如下： ~~~ layout: 'card' ~~~ 這是造成沒有延遲渲染的原因，因為卡片布局默認是不延遲渲染的。因而，要修改的地方就是這里，首先，是在initComponent方法之上添加一個屬性deferredRender，然后在使用時，可通過該屬性控制卡片布局是否使用延遲渲染，默認值為true，也就是使用延時渲染，代碼如下： ~~~ deferredRender : true, ~~~ 然后，將容器的布局修改為： ~~~ layout: { type:'card', deferredRender:me.deferredRender }, ~~~ 這樣，就可以通過deferredRender來控制是否采用延遲渲染了。 現在，修改examples\grouptabs目錄下的grouptabs.js文件，在“activeGroup: 0,”下添加“deferredRender:false,”，現在是沒有延遲渲染的，在Firebug的HTML面板中會看到如下圖所示的情況，所有的標簽都已經渲染出來了，只是沒有顯示而已（display:none）。  把“deferredRender:false,”屏蔽掉，會在Firebug的HTML面板中看到下圖所示的情況，現在只渲染了活動標簽頁，其他標簽頁還沒渲染。