Class CriticalStylesheet

All Implemented Interfaces:
PartialStateHolder, StateHolder, TransientStateHolder, ComponentSystemEventListener, FacesListener, SystemEventListenerHolder, EventListener

public class CriticalStylesheet extends StylesheetFamily

The <o:criticalStylesheet> is a component based on the standard <h:outputStylesheet> which renders a <link rel="preload" as="style"> instead of <link rel="stylesheet"> and automatically changes the rel="preload" to rel="stylesheet" during window load event. Additionally, it will automatically be moved to the very top of the head.

Usage

Just use it the same way as a <h:outputStylesheet>, with a library and name.

 <o:criticalStylesheet library="yourlibrary" name="scripts/filename.js" />
 

You can even explicitly configure third-party stylesheet resources to be loaded this way, such as PrimeFaces stylesheets.

 <o:criticalStylesheet library="primefaces" name="components.css" />
 <o:criticalStylesheet library="primefaces" name="layout.css" />
 
Since:
4.5
Author:
Bauke Scholtz
See Also: