Lazy load javascript of addons

Hi,

I use some addons that are only sometimes used. However, the javascript (jquery, addon specific js) is always loaded. Is there a nice way to lazy load the javascript since most users dont even use it?

For this you should be able to use the lazy widgetset compilation.
See
this ticket
and
this wiki article
(part called “Enabling lazy loading of widgets aka CodeSplitting”) to get you started.

thnx for the info!

However, javascript that addons user is still loaded (the widget itself is lazy loaded)

I use the tinymce and mathquill addon and their js (and css) is always loaded.

In that case, that javascript is loaded by the widget itself.
Short of fiddling with their source code I don’t think it is possible.

Addons which load a Javascript library by loading it from the GWT module descriptor (widgetset.gwt.xml) will always load the library when the Vaadin application loads. Making the widget itself load lazily will not make the library load lazily.

Vaadin does not provide a mechanism for changing that easily either.

However, it is possible by using some advanced GWT trickery to change this. Some time ago I wrote a GWT linker
ScriptTagsLinker.
which removes any javascript library which any addon could have added to the module descriptor at compile time.

When that linker is used, the javascript library will not load at vaadin application start, instead you will need to load it manually in your application.

However,
I do not recommend
using that approach if you do not
know what you are doing
.

hi, thnx for the info. I will use this feature because 30% of my initial loading time is because of some libraries that are only used by 5% of the users.

How do I use your ScriptTagsLinker? I copied it to my workspace and recreated my widgetset, but I still have the javascript files in my header. I could not find any info about vaadin and a custom Linker.

I am not surprised you didn’t find any info on that on the Vaadin forums, as I said before this is stuff you normally do not need to do with Vaadin since adding your own linkers to the widgetset compilation process is not really officially supported.

Anyway, if you want to use the linker make sure you put it in the client package in the source code and add the following to your applications widgetset:

<!-- Linker for removing script tags inherited by addons. -->
<define-linker name="RemoveScriptTagsLinker" class="com.vaadin.demo.sampler.gwt.client.ui.RemoveScriptTagsLinker" />
<add-linker name="RemoveScriptTagsLinker" />

Ensure the package matches where the linker is located. After that you shouldn’t see any addon script tags in the header.

thank you! I will take a look at it.

Nice, it works :slight_smile:

I would like to dynamically load that javascript only if certain users log in. Any suggestions?

Currently I load the js with window.executeJavaScript, but its not an ideal solution.

bump

Anyone suggestions for lazy loading javascript? Loading some javascript only when a certain type of user logs in is enough

Hi,

Window#execJavascript is the only method that I am aware of.

Cheers,

Charles.

the problem with that is what to do after a user refreshes. The state is restored, but the javascript is not loaded.

cheers

last bump :grin:

Basically what you need to do is to call Window.executeJavascript() whenever you are switching to a view that uses the addon with a javascript library. This ensures that the library is always loaded.

This approach is not problem free however. If you call Window.executeJavascript() when you load the view then it will take a while for the javascript to load and many libraries will fail when they cannot find the loaded javascript library in the DOM.

What I did to circumvent that issue was to implement a bit of client side magic for the view so that the view waits for the javascript to load before it loads the view. Here is an example of that
VFeatureView.java
. Here is the corresponding server side implementation
FeatureView.java
. The code was really never ment for demo purposes so there are a lot of irrelevant code there.

Anyway, hope this helps.