JSF Richfaces前端性能调优

Question

I've developed a web application using MyFaces 1.2.6 and Richfaces 3.3.1GA (just upgrated). Despite the ease of use, I found out that Richfaces components are very slow.

I also found out that they didn't really take advantage of the browser caching mechanism, they keep sending some lousy JS file every request and other things. I really would like to apply some rules described in the "High PErformance WEbsites" book, but I can't change de generated js and HTML code.

Does anyone have some tips for frontend performance tuning using Richfaces?

Thanks.

Answer 1

Have a read of this article .

Are you using Firebug + YSlow to check what is being stored in the cache? Using the web.xml org.richfaces.LoadScriptStrategy setting, you can tell Richfaces to either:

• Load all script in one file.
• Load no scripts (you do it yourself instead - eg. in the manner prescribed by your book).
• Load scripts when needed (the default).

But some basic principles :

• Never put logic into your getters. They are called multiple times and should only return something already populated by another method. For example if you are chaining drop-downs together use an a4j:support tag on the first one with an action attribute that loads the data which is then retrieved when you reRender the second one.

• Use the ajaxSingle="true" unless you actually want to send the whole form back to the server.

• Don't use a rich component if you only need a normal one. For example don't use rich:dataTable unless you are making use of some of the features that it has over and above h:dataTable .

Answer 2

You can use: org.ajax4jsf.DEFAULT_EXPIRE 31536000

So that all js, css files (generated by richfaces) are cached for 1 year on the browser. This really improved speed in our project.

Also, we do not need to worry about if we change richfaces version as when we change richfaces version it will generate different files.

Answer 3

To add on to Damo, you can also add a small filter to cache such js or images to improve the performance. But exert caution in doing this, if files intended to cach involve frequent updates.

private void cacheImages(HttpServletRequest request, 
        HttpServletResponse response) {
        try {
              String requestPath = request.getRequestURI();
              if (requestPath != null) {
                    if (requestPath.contains("/images/")
                                || requestPath.contains("/scripts/")
                                || requestPath.endsWith(".js")
                                || requestPath.endsWith(".gif")) {
                          response.setHeader("Cache-Control", "max-age=36000");
                    }
              }
        } catch (RuntimeException e) {
              // do nothing except log
              Log.error(this, e);
        }
  }