Troubleshooting - Resource Optimization

You may experience several issues when adopting resource optimization feature (called resource mapping or resource loading strategies in 3.x/4.1).

 

All of the issues you should be able to detect with using browser’s developer tools like Firebug or Chrome developer tools.

 

 

All resource are not loaded in Servlets 2.5 and lower environments

 

Symptoms: components are not loaded properly -  they do not work as expected or they look broken.

 

Indication: open developer tools and look for network issues (in Console or Network or Resources view) - if you open one of CSS resources, you will see File not found (404) error.

 

Problem: If you are using container supporting Servlets API < 3.0, RichFaces is unable to automatically register ResourceServlet needed to server optimized resources.

 

Fix: register ResourceServlet manually in web.xml

 

<servlet>
    <servlet-name>Resource Servlet</servlet-name>
    <servlet-class>org.richfaces.webapp.ResourceServlet</servlet-class>
    <load-on-startup>1</load-on-startup>
</servlet>
 <servlet-mapping>
    <servlet-name>Resource Servlet</servlet-name>
    <url-pattern>/org.richfaces.resources/*</url-pattern>
</servlet-mapping>

 

 

 

CSS resources are not loaded when using custom skin

 

Symptoms: components works fine, but they are not skinned

 

Indication: open developer tools and look for network issues (in Console or Network or Resources view) - if you open one of CSS resources, you will see File not found (404) error

 

Problem: Custom skins are not currently supported with resource optimization.

 

Fix: You have two options here currently:

 

  • Package/Compress only scripts (they are not resource dependent).
    • RichFaces uses resource mapping feature to map standard resources to packaged/compressed ones.
  • Pre-generate  packaged/compressed resources for custom skin

 

But in each case be sure to vote on feature request!

 

 

JavaScript errors due to wrong resource loading order

 

Symptoms: JavaScript errors occurs when you turned on optimization (e.g. “jsf is not defined”, “jQuery is not defined”)

 

Indication: open the development tools and look to error console - you will see JavaScript errors there.

 

Problem: Packaged resource (packed.js) depends on jsf.js and jquery.js. When you accidently request loading of resource, which is packaged in packed.js before the jsf.js or jquery.js are requested, you are getting conflict. These issues may come up when you are using external library or when you manually request some resources like jquery.js.

 

Fix: Use <h:outputScript name=”javax.faces:jsf.js” /> and <h:outputScript name=”jquery.js” /> in the header.