Embedded Vaadin page loads 5X slower than non-embedded

All of our HTML pages with Vaadin embedded forms take 5 times longer to load than if the same Vaadin form is loaded directly.

Attached is login-embedded.html which will load a simple login form. The static page elements load in < 1 second. The Vaadin component takes almost 6 seconds to load. See the attached login-page-load.png image from chrome which shows the breakdown. According to the element load times, the slow-to-load components are:

loading-indicator-delay.gif 1.97s
loading-indicator-wait.gif 4.93s
error.png 5.92
bg.png 5.92s
bg-default.png 5.92s

The attached login-direct.html is fully vaadin generated with no static page wrapped around it like login-embedded.html. It loads in < 1 second.

You can see the pages live yourself using these URLs:

http://ideadomodev.elasticbeanstalk.com/action/login.html (Embedded)
http://ideadomodev.elasticbeanstalk.com/app/screen=login (Direct)

I’ve tried tweaking the embeded html page to be as close as possible to the direct (vaadin generated) html page but nothing seems to make a difference.

In the embedded page I did notice

standalone : true,

I tried setting this to ‘false’ but saw no difference.

I’m pretty stuck on this so would appreciate any help anyone might be able to suggest.

12623.html (3.8 KB)
12624.html (2.69 KB)

I never figured this one out so I changed over to putting the vaadin app inside an iframe. Performance is amazing, but the side effects of iframes make this a poor workaround.

  • mike

Fascinating. I have no idea what could be the problem. My
embedding example
isn’t as complex as your case, but I don’t see any such effect. Your login.html page loads in 2.8 seconds for me and the app/screen=login in 2.0 seconds. (Firefox 15.0.1 Kubuntu) Hmm…with Chrome the page load takes 6.4s, apparently loading the loading-indicator takes a rather long time.

Anyhow, you might want to implement the login form using the
static login form
pattern instead of a login form with Vaadin components. I don’t know if you used LoginForm, but its username and password storage&completion in browsers works only in Firefox, not in IE, etc. That’s the reason why LoginForm is actually deprecated in Vaadin 7. If you used regular Vaadin components for the form, you might want to consider the static login form for the same reason, you get the storage & completion which are quite user-friendly.

Hi Marko,

The login form I gave is just one simple example. The same problem occurs with all of our vaadin forms/displays.

We see the same delay in Firefox and IE as well.

The live URLs given in my original post now point at the iframe versions so will load very quickly and therefor don’t represent the original problem.

  • mike