Widgetset optimization not working with custom JavaScript components

Hi folks,

I’m using vaadin 7.4.0 and I wrote a small Touchkit application with a custom JavaScript component that extends AbstractJavaScriptComponent. The component requires additional js files loaded via the @JavaScript annotation.

Without widgetset optimization the webapp works fine but it loads more than 700 kb from the server before it gets actually started, which is pretty much for a small smartphone webapp.

That’s why I wanted to optimize the widgetset using the following ConnectorBundleLoaderFactory:

public class OptimizedConnectorBundleLoaderFactory extends ConnectorBundleLoaderFactory {
  private Set<String> eagerConnectors = new HashSet<String>();

   {
    eagerConnectors.add(com.vaadin.client.ui.ui.UIConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.ui.panel.PanelConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.ui.orderedlayout.HorizontalLayoutConnector.class.getName());
    eagerConnectors.add(com.vaadin.addon.touchkit.gwt.client.vcom.navigation.NavigationViewConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.ui.button.ButtonConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.extensions.javascriptmanager.JavaScriptManagerConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.connectors.JavaScriptRendererConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.ui.JavaScriptComponentConnector.class.getName());
    eagerConnectors.add(com.vaadin.client.JavaScriptExtension.class.getName());
    eagerConnectors.add(com.vaadin.client.JavaScriptConnectorHelper.class.getName());
  }
 
  @Override protected LoadStyle getLoadStyle(JClassType connectorType) {
    if (eagerConnectors.contains(connectorType.getQualifiedBinaryName())) {
      return LoadStyle.EAGER;
    } else {
       return LoadStyle.LAZY;
    }
  }
}

The five JavaScript classes in this ConnectorBundleLoaderFactory were not originally proposed by UI connector identificator of the debug mode. I added them just in the hope that it would work afterwards, but it don’t.

With the widgetset optimization all standard vaadin components are loaded correctly. But my JavaScript component works now only after every fifth reload of the application in tomcat manager (in average). Thus there must be some nondeterminism in the application initialisation. I assume that the js files required by my JavaScript component are not loaded in the correct order which might lead to the fact that the JavaScript component is not shown in the end.

Once the JavaScript component works in one webbrowser, it also works in all other webbrowsers and on different devices. So it’s not a browser issue. It’s really something weired in vaadins initialization process.

Does someone discovered similar issues and found a fix for it?
Can one tell vaadin to load external js files in bootstrap in a certain order?

After I deactivated the widgetset optimization I still discovered that my custom JS components doen’t get loaded sometimes (only after around every second reload of the tomcat webapp). So it’s looks like a more general problem with JS components.

Hi everybody,

From this morning I’m trying to integrate Chart.js with Vaadin 7 to display a Pie chart, but without success.

Somebody could help to find a solution about it?

Thanks a lot