I am using vaadin 7.1.10 and I am having table inside a tabsheet tab. At a time i create multiple tabs and execute different queries and it returns results on each of the tabs. when i switch between tabs i see the whole content getting reload/rerender as if it is loading for the first time. This gives a bad user experience.
In the tabsheet i have implement selectedTabChangeListener and have the below method
public void selectedTabChange(SelectedTabChangeEvent event) {
//inside i just hide/show a layout nothing related to this table or tab
}
I am not able to figure out if this is an issue with tabsheet or tab or anything else. could you please help?
looks like the setselectedtab which holds the logic of makeasdirty in setselectedtab of tabsheet causes the issue. is there anyway i can work through it?
public void setSelectedTab(Component c) {
if (c != null && components.contains(c) && !c.equals(selected)) {
setSelected(c);
updateSelection();
fireSelectedTabChange();
markAsDirty();
getRpcProxy(TabsheetClientRpc.class).revertToSharedStateSelection();
}
}
Ok. I’m not completely sure but tabsheet renders tab content every time. Table is the most complex component to render. More then one on the page, makes it’s heavy.
So, until Vaadin 7.4 (Grid) only workaround which I know it’s works:
drop TabSheet
add button bar
add all tables in invisible state
when user clicked on selected button, show one table visible for an user
This workaround is heavy to render first time, but after that render speed will be acceptable.
In Vaadin 7, a TabSheet does keep only the visible tab contents in memory instead of trying to cache previously seen tabs like Vaadin 6 did. Otherwise, especially when using server push, updates would potentially need to be calculated and sent for all the tabs the user might have seen, which can have a performance impact both on the server and on the client. Caching them on the client can also have a big impact on client side memory usage, and the content of the other tabs may change completely in some applications based on what the user does on the current tab so the cache might not be valid anyway.
For Vaadin 6, there is an add-on
DetachedTabs that takes an approach similar to what you did - a separate button bar themed like a tab bar to switch views. While there is no Vaadin 7 version of the add-on, the idea should be easy to copy. You could use some lazy rendering add-on if you want to pre-render all the tables so that the initial load time does not suffer too much.
Hi Henri. I know that this post is old, but I’m in trouble with this behavior of TabSheet. I need exactly the opposite, cache the client-side state because I have some client-side widgets that are very expensive to load, and I can’t load it on every tab change. Is possible to hack this tabsheet behavior, to keep state at least for specific tables to avoid reload everything?
that did not help. i upgraded it to 7.2.4 of vaadin.