Vaadin loading and refresh very slow

Hi,

I am developing an application with Vaadin 7.

I noticed that it is very slow to load the first page and every refresh (about 10 seconds).

I have a vertical layout with some simple components (my tables are empty now and I use CustomLayouts) and I used the @PreserveOnRefresh annotation.

Why is so slow? Vaadin 6 is faster on the same configurations.

Are you using a custom Sass/SCSS theme? We’re seeing slowdowns of 10s-100s when developing a custom SCSS theme and running the server in Debug mode.

Workarounds for the issue currently include running the server in normal mode, disabling JRebel or cleaning your local .m2 repository.

We’re looking into what is causing the Sass compiler to behave like this, which is most likely the problem, since if you view the network request for the page, the styles.css is the one blocking the page rendering.

Correct me if I’m wrong, and if this is not the source for your problem.

Yes, I’m new in V7 and I am using the default way to use a custom theme, so it is Sass/SCSS and I run the server in debug mode.

I think you got the point.

Can I use a default CSS theme for V7? How?

Just remove the @Theme annotation from your UI class to use the default Reindeer theme (or replace your custom theme with either Runo or Chameleon).

Another option is to run the Sass compiler separately to precompile your custom theme into the styles.css in your theme folder. That way the Sass compiler isn’t invoked when the application is loaded. There’s the SassCompiler class you can use, just pass it two parameters, the paths for the input styles.scss and the output styles.css.

I think I will remove the annotation and use old setTheme function.

I will try, thank you.

EDIT:

Uhm I noticed that there is no more the setTheme function.
How can I do to use my custom theme in plain css?

EDIT2:

I think I figured out:
delete the scss file in the theme
create a new styles.css file
import @import “…/reindeer/legacy-styles.css”; and override the classes

I got the same problem, after install JRebel over my Eclipse.

I uninstalled it (JRebel) and everything back to normal again!

How is the progress to solve this issue ?

The original ticket was
11604
, but that was marked as fixed, and another issue was split from it:
11724

Please test with Vaadin 7.0.6 and see if it helps in your case. Theme compilation should not take more than a few seconds. If not, let me know here (ideally with information about the environment and a minimal sample theme exhibiting the problem) and I’ll get back to digging deeper into this.

I have still seen some slowdowns in some environments (not in mine), but I am unsure whether the fixes have been in use in those environments.

[i]
I had the same problem and it turned out (as Roberto pointed out) that JRebel was the problem; once uninstalled all is normal.

Thanks

Jan
[/i]

Alternatively, configure your (Eclipse?) JRebel integration to use the old debugger integration, which doesn’t have the slowdown issue here. See
this ticket
for the workaround.

Hi,
Just now I have started using Vaadin 7 .I am also facing the same issue.
I have done the same step told by you above but still its loading page very slow.

I am using Eclipse and Tomcat as server.

Vaadin 6.8.x… simple totally SIMPLE an primitive UI.
http://befriendlier.com/X/NowaPrawica.html

VADDIN is so FREAKING SLOW it it so the point of USELSS, on top of this the session expired under MINOR traffic like it was HEAVY traffic…
any ideas guys?

Hi Peter,

Since you’re using Vaadin 6, the slowness isn’t caused by the same issue that was discussed in this topic (the Sass compiler).

Nonetheless, the app starts quite slow, yes. I poked around the JS and DOM a bit, and it looks like you’ve compiled the GWT widgetset using the “pretty” mode or some other configuration than obfuscated. This will cause the script size to increase and slow down the parser also. You also have, what looks to me, a couple of unnecessary HorizontalLayouts in there that will slow down the rendering (at least in older browsers, modern browsers you probably won’t see a difference).

You would also remove any unused components from the widgetset to make it even smaller. It seems like you’re not using the Table or Tree components for instance. The same can be done for the theme/CSS as well, but that requires some copy-n-pasting from the original source files.

For the session expiration, can’t really say what’s causing that. Heavy load shouldn’t cause that, unless for some reason the server is dropping older sessions when the memory starts filling up, or for some reason new sessions cause the other ones to invalidate for some reason?

Edit: Just checked the size of you widgetset: it’s
6.21 MB
– no wonder it takes forever to start. You should also enable gzip on your server if you can, to compress it during transfer (it looks gzip isn’t enabled).

Jouni, thank you for your excellent and constructive answer.
0. I have no moved to 7 yet as eclipse and move from 6 to 7 has some bizairre issues in my eclipse deployment.

  1. You might be right, my omission caused by the fact eclipse hangs uo when I just do full build, so I have to always to manual build and it only takes effect when I trigger some change in Pretty/Obfuscated etc modes for the widgetset compiler.
    Thank you for noticing the additional bloat in code.
  2. I need to have 3 rows so I added 3 HorizontalPanel I guess your suggestion would be Table. Good idea. I should probably try it, even though if 3 HorizontalPanel can be that heavy…I think their use should be banned entirely :slight_smile:
  3. The session expirations with the red window flas have been hunting many of us in vaadin since we ever built ANY app…
    in this widget it is not actually that bad.
  4. I am enabling gzip compression for tomcat now