SlideShare a Scribd company logo
1 of 33
25+ Reasons to use OmniFaces in JSF applications
Anghel Leonard
What we will cover ? (I)
• Enable restorable view
• Loading CDN resources
• Loading images as stream/byte array
• OmniFaces converters
• OmniFaces validators
• OmniFaces server-side Cache
• Defer JavaScript loading
• Preserve view/request parameters on post-back
• Execute JSF AJAX request via JavaScript method call
• OmniFaces tree hierarchy
• OmniFaces stateless ViewParam
• Full AJAX exception handler
• Highlight invalid inputs
• OmniFaces boosted messages
What we will cover ? (II)
• Eagerly instantiate scoped beans
• OmniFaces PartialViewContext
• OmniFaces events for Invoke Application
• Auto-generated JSF component IDs
• Extensionless URLs
• Import constants
• Import functions
• Combined resource handler
• Unmapped resource handler
• Injecting cookies and context params
• OmniFaces filters
• OmniFaces ViewScope
• OmniFaces utilities methods
• OmniFaces utilities functions
What is OmniFaces ?
• Well, if this is the first time when you hear about OmniFaces then you have to know
that OmniFaces is a utility library for JSF and a comprehensive compendium of
programming techniques, design patterns and recipes for JSF developers.
• Read before: Introduction to OmniFaces by Anghel Leonard
Enable restorable view
Your application works like a charm, but ViewExpiredException spoil all the
satisfaction ?
OmniFaces fix this problem via a custom tag handler that instructs the view
handler to recreate the entire view whenever the view has been expired. So,
check how easy is to get rid of this exception using
<o:enableRestorableView>.
Loading CDN resources
If you want to use <h:outputScript> and <h:outputStylesheet> to
load external resources from CDNs (e.g. Google Hosted Libraries), then
you know that this is not possible in default JSF ?
OmniFaces comes with the solution via a custom resource handler, named
CDNResourceHandler. This will simply allows you to load resources from
CDNs via <h:outputScript> and <h:outputStylesheet>.
Loading images as stream/byte array
You need to render images that comes as InputStream or byte[] ?
You want to render them as data URI or load SVG files?
OmniFaces provides the <o:graphicImage>, which is an extension of the
<h:graphicImage> dedicated to render JSF resource as data URI,
InputStream/byte[] property as resource, InputStream
/byte[] property as data URI, etc. Just check the OmniFaces Showcase.
OmniFaces converters
JSF custom converters are time consuming, they are called at every request
regardless of whether the submitted value has changed or not, or they need to
do the job based on possibly expensive service/DAO operations, etc.
Just if you read the names of converters provides out of the box by OmniFaces,
you will take into account to check them at your first need to write a custom
converter:
GenericEnumConverter
ListConverter
ListIndexConverter
SelectItemsConverter
SelectItemsIndexConverter
ValueChangeConverter
Read further: OmniFaces Converters by Constantin Alin
OmniFaces validators
Components validation is interdependent ? Need special custom validators to:
- validate if ONLY ONE of the given UIInput components have been filled out ?
- validate if ALL of the given UIInput components have been filled out ?
- validate if ALL of the given UIInput components have the same value ?
- validate if ONLY ONE of the given UIInput components has been filled out or
that NONE of the given UIInput components have been filled out ?
…
If you answered yes, or you think of some other case, then OmniFaces has
a set of 14 special custom validators.
Read further: OmniFaces Validators by Anghel Leonard
OmniFaces server-side Cache
Your page source code contains a lot of markup ? Well, the Render Response
phase is the most time consuming JSF phase, especially in cases when the
rendered markup is consistent.
You can speed up this process with a snap of a finger via the OmniFaces
Cache component. Caching markup will boost the Render Response phase
(check some tests here). The examples provided by OmniFaces Showcase are
very clear and well explained.
Read further: Test OmniFaces Cache for Render Response Phase by Anghel Leonard
Defer JavaScript loading
I know a trendy topic: deferred scripts. I'm pretty sure that you heard about
placing the scripts at the end of </body>, use defer="true“ or async=
"true", but I'm not so sure that you know that these approaches are not really
working as expected.
The OmniFaces, <o:deferredScript> defers the loading of the given script
resource to the window load event (the given script resource is only loaded
when the window is really finished with loading).
Preserve view/request
parameters on post-back
As you know, when we submit JSF forms we simply cannot preserve
view or request parameters in the request URL.
Well, OmniFaces fixes this issue via Form (<o:form>) component, which
extends the standard <h:form> and provides a way to keep view or request
parameters in the request URL after a post-back and offers in combination with
the <o:ignoreValidationFailed> tag on an UICommand component the
possibility to ignore validation failures so that the invoke action phase will be
executed anyway.
Execute JSF AJAX request via
JavaScript method call
As an end-user you may want to execute a JSF AJAX request via a
JavaScript function call. Well, OmniFaces provides the CommandScript
component exactly for this purpose.
The <o:commandScript> is a component based on the standard
<h:commandXxx> which generates a JavaScript function in the global
JavaScript scope which allows the end-user to execute a JSF AJAX request
by just a function call functionName() in the JavaScript context.
OmniFaces tree hierarchy
OmniFaces comes with Tree component.
The <o:tree> allows the developers to have full control over the markup
of a tree hierarchy by declaring the appropriate JSF components or HTML
elements in the markup. The <o:tree> does namely not render any
HTML markup by itself.
Beside the OmniFaces Showcase, you can check some examples here:
Use OmniFaces Tree to render JSON
Expose a path as an OmniFaces tree (<o:tree>)
Building dynamic responsive multi-level menus with plain HTML and OmniFaces
OmniFaces stateless ViewParam
The JSF built-in <f:viewParam> is a stateful artifact. This causes major
issues as Arjan Tijms points on his blog. OmniFaces, comes with a
stateless ViewParam component.
The <o:viewParam> is a component that extends the standard
<f:viewParam> and provides a stateless mode of operation and fixes
the issue wherein null model values are converted to empty string
parameters in query string (e.g. when includeViewParams=true) and
the (bean) validation never being triggered when the parameter is
completely absent in query string, causing e.g. @NotNull to fail.
Full AJAX exception handler
By default, most of AJAX exceptions are invisible to the client. They are
returned to the client, but unfortunately JSF AJAX clients aren't prepared to
deal with arbitrary error messages, so they simply ignore them. But a custom
exception handler is specially created for this task by OmniFaces.
The handler is named FullAjaxExceptionHandler, and the factory is
named FullAjaxExceptionHandlerFactory. This will give to your
AJAX based applications a real boost, because your end users would know
if their actions was successfully performed or not.
Highlight invalid inputs
Beside validation messages, you simply want to highlight the invalid inputs of
a form via some CSS ?
The OmniFaces, <o:highlight> is a helper component which highlights
all invalid UIInput components and the associated labels by adding an
error style class to them. Additionally, it by default focuses the first invalid
UIInput component.
OmniFaces boosted messages
Working with <h:message> and <h:messages> has several important
limitations.
OmniFaces, comes with <o:messages>, which allows us to
specify multiple client IDs space separated in the for attribute, show a single
custom message whenever the component has received any faces message,
HTML escaping and messages iteration markup control.
Eagerly instantiate scoped beans
CDI managed beans doesn’t have the ability to eagerly instantiate application
scoped beans.
OmniFaces fills this void and even goes one step further by
introducing the @Eager annotation that can be applied to @RequestScoped,
@ViewScoped, @SessionScoped and @ApplicationScoped beans.
This causes these beans to be instantiated automatically at the start of each
such scope instead of on demand when a bean is first referenced.
OmniFaces PartialViewContext
Do you need to:
• Execute callback scripts by
PartialResponseWriterstartEval() ?
• Add arguments to AJAX response ?
• Prevents errors about malformed XML caused by tags which
Mojarra and MyFaces has left open after an exception in rendering
of an already committed AJAX response ?
• Fix the no-feedback problem when a ViewExpiredException
occurs during an AJAX request on a page which is restricted by
web.xml <security-constraint> ?
Then you need the OmniFaces, OmniPartialViewContext.
OmniFaces events for Invoke Application
JSF comes with a considerable number of events, but none of them is related
to Invoke Application phase.
OmniFaces fills this void with the InvokeActionEventListener which add
support for the new <f:event> types: preInvokeAction and
postInvokeAction. Those events are published during the beforephase and
afterphase of INVOKE_APPLICATION respectively. This actually offers a better
hook on invoking actions after the <f:viewParam> values been set than the
preRenderView event.
Starting with OmniFaces 2.2, any component will support these two events.
Auto-generated JSF component IDs
As you know, JSF will provide auto-generated IDs for each component
that doesn’t have an explicit ID.
OmniFaces has an view handler, NoAutoGeneratedIdViewHandler
which inspects the rendered output and signal via an
llegalStateException whenever an automatically generated JSF
component ID (j_id...) is encountered in the rendered output.
Extensionless URLs
Do you find the presence of the extension (e.g. .xhtml) inappropriate in
the URL ?
Well, OmniFaces comes with FacesViews, which is a
mechanism to use SEO-friendly extensionless URLs in a JSF
application without the need to enlist individual Facelet source files in
some configuration file.
Instead, Facelets source files can be put into either the special /WEB-
INF/faces-views directory, from where they will be automatically scanned
(no configuration whatsoever required) or an explicit directory can be
configured to be scanned. The web app root is supported as well.
Import constants
By default, constant field values cannot be use in JSF pages.
Well, OmniFaces provides the ImportConstants tag handler that allows
the developer to have a mapping of all constant field values of the given
fully qualified name of a type in the request scope (e.g. declared as,
public static final).
Import functions
By default, functions that are not registered in .taglib.xml file cannot be
use in JSF pages.
Well, OmniFaces comes with the ImportFunctions tag handler which allows
developers to have access to all functions of the given fully qualified name of a
type in the Facelet scope using the usual EL functions syntax without the need
to register them in .taglib.xml file. The functions are those public
static methods with a non-void return type.
Combined resource handler
As you know, for each resource (CSS and JS) we have a separate request.
OmniFaces seriously improve the page loading speed via the
CombinedResourceHandler resource handler.
This will remove all separate script and stylesheet resources which have the
target Attributeset to head from the UIViewRoot and create a combined
one for all scripts and another combined one for all stylesheets.
Unmapped resource handler
When we need to reference relative URLs to images in CSS files we can use
the #{resource} EL expression in images paths. This issue is solved by
OmniFaces via the UnmappedResourceHandler.
This implementation allows the developer to map JSF resources on an URL
pattern of /javax.faces.resource/* without the need for an additional
FacesServlet prefix or suffix URL pattern in the default produced resource
URLs.
Injecting cookies and context params
Need quick access to information stored in cookies and context
parameters ? Preferably via CDI injection ?
Well, OmniFaces provides @Cookie annotation for injecting cookie
data and @ContextParam annotation for injecting context parameters
(the later is available starting with OmniFaces 2.2).
OmniFaces filters
OmniFaces comes with several filters, as follows:
• CacheControlFilter - controls the cache-related headers of
the response
• CharacterEncodingFilter - set the request body character
encoding when not already set by the client
• FacesExceptionFilter - solve 2 problems with exceptions
thrown in JSF methods: Mojarra's FacesFileNotFoundException
needs to be interpreted as 404 and root cause needs to be
unwrapped from FacesException and ELException to utilize
standard Servlet API error page handling.
• GzipResponseFilter - will apply GZIP compression on
responses whenever applicable
• HttpFilter - abstract filter specifically for HTTP requests
OmniFaces ViewScope
OmniFaces comes with a view scope that can be used in JSF 2.0/2.1.
Starting with JSF 2.2, we can use the built-in view scope, but, if we need to
immediately destroy @ViewScoped bean when browser window is unloaded
/closed then we need to come back to OmniFaces solution.
Starting with OmniFaces 2.2, the view scope was improved to immediately
destroy @ViewScoped on a GET navigation, or a close of browser tab
/window. These features are not supported by JSF 2.2.
OmniFaces utilities methods
OmniFaces comes with 300+ utilities methods that are available in
org.omnifaces.util package. We have utility methods based on JSF API
for AJAX, CDI Beans, messages, faces, events, callbacks, renderers, etc.
Most of them are useful to obtain a less verbose code, much easy to
understand, others provides hidden functionalities or simply comes with new
functionalities that are not easy to be achieved in JSF.
Read further: OmniFaces Utilities ZEEF Page by Anghel Leonard
OmniFaces utilities functions
OmniFaces comes with a comprehensive set of utilities functions in
org.omnifaces.el.functions package. These functions allows us to
easy manipulate objects, strings, arrays, dates, numbers, etc directly in page
via EL.
Read further: OmniFaces Utilities ZEEF Page by Anghel Leonard
References
• Bauke Scholtz - http://balusc.omnifaces.org/
• Arjan Tijms - http://arjan-tijms.omnifaces.org/
• JSF ZEEF page - https://jsf.zeef.com/bauke.scholtz
• OmniFaces ZEEF page - https://omnifaces.zeef.com/bauke.scholtz
• OmniFaces Wikipedia - http://en.wikipedia.org/wiki/OmniFaces

More Related Content

What's hot

2. Entity Relationship Model in DBMS
2. Entity Relationship Model in DBMS2. Entity Relationship Model in DBMS
2. Entity Relationship Model in DBMS
koolkampus
 

What's hot (20)

Data foundation for analytics excellence
Data foundation for analytics excellenceData foundation for analytics excellence
Data foundation for analytics excellence
 
Data visualization with R
Data visualization with RData visualization with R
Data visualization with R
 
M. Scanu - Sistema unitario di metadati. Componente relativa ai metadati stru...
M. Scanu - Sistema unitario di metadati. Componente relativa ai metadati stru...M. Scanu - Sistema unitario di metadati. Componente relativa ai metadati stru...
M. Scanu - Sistema unitario di metadati. Componente relativa ai metadati stru...
 
Java Web Services [1/5]: Introduction to Web Services
Java Web Services [1/5]: Introduction to Web ServicesJava Web Services [1/5]: Introduction to Web Services
Java Web Services [1/5]: Introduction to Web Services
 
Fundamentals of Database Design
Fundamentals of Database DesignFundamentals of Database Design
Fundamentals of Database Design
 
The Relational Data Model and Relational Database Constraints Ch5 (Navathe 4t...
The Relational Data Model and Relational Database Constraints Ch5 (Navathe 4t...The Relational Data Model and Relational Database Constraints Ch5 (Navathe 4t...
The Relational Data Model and Relational Database Constraints Ch5 (Navathe 4t...
 
Preparing for Scala 3
Preparing for Scala 3Preparing for Scala 3
Preparing for Scala 3
 
SQL : introduction
SQL : introductionSQL : introduction
SQL : introduction
 
Intro to relational model
Intro to relational modelIntro to relational model
Intro to relational model
 
PowerBI Training
PowerBI Training PowerBI Training
PowerBI Training
 
Scala categorytheory
Scala categorytheoryScala categorytheory
Scala categorytheory
 
الوحدة السابعة - قاعدة البيانات وادارتها
الوحدة السابعة - قاعدة البيانات وادارتهاالوحدة السابعة - قاعدة البيانات وادارتها
الوحدة السابعة - قاعدة البيانات وادارتها
 
Power BI Made Simple
Power BI Made SimplePower BI Made Simple
Power BI Made Simple
 
The Functional Programming Triad of Map, Filter and Fold
The Functional Programming Triad of Map, Filter and FoldThe Functional Programming Triad of Map, Filter and Fold
The Functional Programming Triad of Map, Filter and Fold
 
Data Visualization 101: How to Design Charts and Graphs
Data Visualization 101: How to Design Charts and GraphsData Visualization 101: How to Design Charts and Graphs
Data Visualization 101: How to Design Charts and Graphs
 
Sqlite
SqliteSqlite
Sqlite
 
Data analytics with R
Data analytics with RData analytics with R
Data analytics with R
 
Relational algebra in dbms
Relational algebra in dbmsRelational algebra in dbms
Relational algebra in dbms
 
2. Entity Relationship Model in DBMS
2. Entity Relationship Model in DBMS2. Entity Relationship Model in DBMS
2. Entity Relationship Model in DBMS
 
Data analysis with R
Data analysis with RData analysis with R
Data analysis with R
 

Viewers also liked

DSS-Literally Litter Free
DSS-Literally Litter Free DSS-Literally Litter Free
DSS-Literally Litter Free
Farhan Karim
 

Viewers also liked (17)

JSF Design Patterns
JSF Design PatternsJSF Design Patterns
JSF Design Patterns
 
Mastering OmniFaces - A Problem to Solution Approach
Mastering OmniFaces - A Problem to Solution ApproachMastering OmniFaces - A Problem to Solution Approach
Mastering OmniFaces - A Problem to Solution Approach
 
Practica 2
Practica 2Practica 2
Practica 2
 
PIUSS - Case History
PIUSS - Case HistoryPIUSS - Case History
PIUSS - Case History
 
Sorrow Magazine
Sorrow MagazineSorrow Magazine
Sorrow Magazine
 
детская презентация
детская презентациядетская презентация
детская презентация
 
Nepal earthquake
Nepal earthquakeNepal earthquake
Nepal earthquake
 
งานอังกฤษ
งานอังกฤษงานอังกฤษ
งานอังกฤษ
 
CarolinaCon Presentation on Streaming Analytics
CarolinaCon Presentation on Streaming AnalyticsCarolinaCon Presentation on Streaming Analytics
CarolinaCon Presentation on Streaming Analytics
 
Ejercicios de klapp
Ejercicios de klappEjercicios de klapp
Ejercicios de klapp
 
Tutorial Eclipse 3
Tutorial Eclipse 3Tutorial Eclipse 3
Tutorial Eclipse 3
 
Standards
StandardsStandards
Standards
 
DSS-Literally Litter Free
DSS-Literally Litter Free DSS-Literally Litter Free
DSS-Literally Litter Free
 
Pres professional gaming ipeek foundation pdf
Pres professional gaming ipeek foundation pdfPres professional gaming ipeek foundation pdf
Pres professional gaming ipeek foundation pdf
 
Ishak 009
Ishak 009Ishak 009
Ishak 009
 
Practicas 11 a 15
Practicas 11 a 15Practicas 11 a 15
Practicas 11 a 15
 
Instrumentos y herramientas
Instrumentos y herramientasInstrumentos y herramientas
Instrumentos y herramientas
 

Similar to 25+ Reasons to use OmniFaces in JSF applications

SoCal Code Camp 2011 - ASP.NET MVC 4
SoCal Code Camp 2011 - ASP.NET MVC 4SoCal Code Camp 2011 - ASP.NET MVC 4
SoCal Code Camp 2011 - ASP.NET MVC 4
Jon Galloway
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
dominion
 
Asp.Net Ajax Component Development
Asp.Net Ajax Component DevelopmentAsp.Net Ajax Component Development
Asp.Net Ajax Component Development
Chui-Wen Chiu
 
RichFaces: rich:* component library
RichFaces: rich:* component libraryRichFaces: rich:* component library
RichFaces: rich:* component library
Max Katz
 

Similar to 25+ Reasons to use OmniFaces in JSF applications (20)

Javascript-heavy Salesforce Applications
Javascript-heavy Salesforce ApplicationsJavascript-heavy Salesforce Applications
Javascript-heavy Salesforce Applications
 
SoCal Code Camp 2011 - ASP.NET MVC 4
SoCal Code Camp 2011 - ASP.NET MVC 4SoCal Code Camp 2011 - ASP.NET MVC 4
SoCal Code Camp 2011 - ASP.NET MVC 4
 
C sharp and asp.net interview questions
C sharp and asp.net interview questionsC sharp and asp.net interview questions
C sharp and asp.net interview questions
 
Using Ajax In Domino Web Applications
Using Ajax In Domino Web ApplicationsUsing Ajax In Domino Web Applications
Using Ajax In Domino Web Applications
 
Introduction to ajax
Introduction to ajaxIntroduction to ajax
Introduction to ajax
 
RichFaces 4: Rich Ajax Components For Your JSF Applications
RichFaces 4: Rich Ajax Components For Your JSF ApplicationsRichFaces 4: Rich Ajax Components For Your JSF Applications
RichFaces 4: Rich Ajax Components For Your JSF Applications
 
Asp.Net Ajax Component Development
Asp.Net Ajax Component DevelopmentAsp.Net Ajax Component Development
Asp.Net Ajax Component Development
 
Wwf
WwfWwf
Wwf
 
React & Redux JS
React & Redux JS React & Redux JS
React & Redux JS
 
react-en.pdf
react-en.pdfreact-en.pdf
react-en.pdf
 
AJppt.pptx
AJppt.pptxAJppt.pptx
AJppt.pptx
 
ASP.NET 4.0 Roadmap
ASP.NET 4.0 RoadmapASP.NET 4.0 Roadmap
ASP.NET 4.0 Roadmap
 
Effective JavaFX architecture with FxObjects
Effective JavaFX architecture with FxObjectsEffective JavaFX architecture with FxObjects
Effective JavaFX architecture with FxObjects
 
Using HttpWatch Plug-in with Selenium Automation in Java
Using HttpWatch Plug-in with Selenium Automation in JavaUsing HttpWatch Plug-in with Selenium Automation in Java
Using HttpWatch Plug-in with Selenium Automation in Java
 
Codeception
CodeceptionCodeception
Codeception
 
Dave Orchard - Offline Web Apps with HTML5
Dave Orchard - Offline Web Apps with HTML5Dave Orchard - Offline Web Apps with HTML5
Dave Orchard - Offline Web Apps with HTML5
 
An Introduction to Websphere sMash for PHP Programmers
An Introduction to Websphere sMash for PHP ProgrammersAn Introduction to Websphere sMash for PHP Programmers
An Introduction to Websphere sMash for PHP Programmers
 
RichFaces: rich:* component library
RichFaces: rich:* component libraryRichFaces: rich:* component library
RichFaces: rich:* component library
 
Maxim Salnikov - Service Worker: taking the best from the past experience for...
Maxim Salnikov - Service Worker: taking the best from the past experience for...Maxim Salnikov - Service Worker: taking the best from the past experience for...
Maxim Salnikov - Service Worker: taking the best from the past experience for...
 
Ajax Testing Approach
Ajax Testing ApproachAjax Testing Approach
Ajax Testing Approach
 

Recently uploaded

Recently uploaded (20)

Novo Nordisk: When Knowledge Graphs meet LLMs
Novo Nordisk: When Knowledge Graphs meet LLMsNovo Nordisk: When Knowledge Graphs meet LLMs
Novo Nordisk: When Knowledge Graphs meet LLMs
 
WSO2CON2024 - Why Should You Consider Ballerina for Your Next Integration
WSO2CON2024 - Why Should You Consider Ballerina for Your Next IntegrationWSO2CON2024 - Why Should You Consider Ballerina for Your Next Integration
WSO2CON2024 - Why Should You Consider Ballerina for Your Next Integration
 
What Goes Wrong with Language Definitions and How to Improve the Situation
What Goes Wrong with Language Definitions and How to Improve the SituationWhat Goes Wrong with Language Definitions and How to Improve the Situation
What Goes Wrong with Language Definitions and How to Improve the Situation
 
WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...
WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...
WSO2CON 2024 - IoT Needs CIAM: The Importance of Centralized IAM in a Growing...
 
Evolving Data Governance for the Real-time Streaming and AI Era
Evolving Data Governance for the Real-time Streaming and AI EraEvolving Data Governance for the Real-time Streaming and AI Era
Evolving Data Governance for the Real-time Streaming and AI Era
 
WSO2Con2024 - Enabling Transactional System's Exponential Growth With Simplicity
WSO2Con2024 - Enabling Transactional System's Exponential Growth With SimplicityWSO2Con2024 - Enabling Transactional System's Exponential Growth With Simplicity
WSO2Con2024 - Enabling Transactional System's Exponential Growth With Simplicity
 
WSO2CON 2024 Slides - Unlocking Value with AI
WSO2CON 2024 Slides - Unlocking Value with AIWSO2CON 2024 Slides - Unlocking Value with AI
WSO2CON 2024 Slides - Unlocking Value with AI
 
WSO2CON 2024 - How to Run a Security Program
WSO2CON 2024 - How to Run a Security ProgramWSO2CON 2024 - How to Run a Security Program
WSO2CON 2024 - How to Run a Security Program
 
WSO2Con2024 - Software Delivery in Hybrid Environments
WSO2Con2024 - Software Delivery in Hybrid EnvironmentsWSO2Con2024 - Software Delivery in Hybrid Environments
WSO2Con2024 - Software Delivery in Hybrid Environments
 
WSO2Con2024 - Hello Choreo Presentation - Kanchana
WSO2Con2024 - Hello Choreo Presentation - KanchanaWSO2Con2024 - Hello Choreo Presentation - Kanchana
WSO2Con2024 - Hello Choreo Presentation - Kanchana
 
Driving Innovation: Scania's API Revolution with WSO2
Driving Innovation: Scania's API Revolution with WSO2Driving Innovation: Scania's API Revolution with WSO2
Driving Innovation: Scania's API Revolution with WSO2
 
WSO2Con204 - Hard Rock Presentation - Keynote
WSO2Con204 - Hard Rock Presentation - KeynoteWSO2Con204 - Hard Rock Presentation - Keynote
WSO2Con204 - Hard Rock Presentation - Keynote
 
WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...
WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...
WSO2CON 2024 - Cloud Native Middleware: Domain-Driven Design, Cell-Based Arch...
 
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital TransformationWSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
WSO2Con2024 - WSO2's IAM Vision: Identity-Led Digital Transformation
 
WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...
WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...
WSO2CON 2024 - Building the API First Enterprise – Running an API Program, fr...
 
WSO2CON 2024 - Does Open Source Still Matter?
WSO2CON 2024 - Does Open Source Still Matter?WSO2CON 2024 - Does Open Source Still Matter?
WSO2CON 2024 - Does Open Source Still Matter?
 
[GeeCON2024] How I learned to stop worrying and love the dark silicon apocalypse
[GeeCON2024] How I learned to stop worrying and love the dark silicon apocalypse[GeeCON2024] How I learned to stop worrying and love the dark silicon apocalypse
[GeeCON2024] How I learned to stop worrying and love the dark silicon apocalypse
 
WSO2CON2024 - It's time to go Platformless
WSO2CON2024 - It's time to go PlatformlessWSO2CON2024 - It's time to go Platformless
WSO2CON2024 - It's time to go Platformless
 
WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!
WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!
WSO2CON 2024 - Not Just Microservices: Rightsize Your Services!
 
WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...
WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...
WSO2Con2024 - GitOps in Action: Navigating Application Deployment in the Plat...
 

25+ Reasons to use OmniFaces in JSF applications

  • 1. 25+ Reasons to use OmniFaces in JSF applications Anghel Leonard
  • 2. What we will cover ? (I) • Enable restorable view • Loading CDN resources • Loading images as stream/byte array • OmniFaces converters • OmniFaces validators • OmniFaces server-side Cache • Defer JavaScript loading • Preserve view/request parameters on post-back • Execute JSF AJAX request via JavaScript method call • OmniFaces tree hierarchy • OmniFaces stateless ViewParam • Full AJAX exception handler • Highlight invalid inputs • OmniFaces boosted messages
  • 3. What we will cover ? (II) • Eagerly instantiate scoped beans • OmniFaces PartialViewContext • OmniFaces events for Invoke Application • Auto-generated JSF component IDs • Extensionless URLs • Import constants • Import functions • Combined resource handler • Unmapped resource handler • Injecting cookies and context params • OmniFaces filters • OmniFaces ViewScope • OmniFaces utilities methods • OmniFaces utilities functions
  • 4. What is OmniFaces ? • Well, if this is the first time when you hear about OmniFaces then you have to know that OmniFaces is a utility library for JSF and a comprehensive compendium of programming techniques, design patterns and recipes for JSF developers. • Read before: Introduction to OmniFaces by Anghel Leonard
  • 5. Enable restorable view Your application works like a charm, but ViewExpiredException spoil all the satisfaction ? OmniFaces fix this problem via a custom tag handler that instructs the view handler to recreate the entire view whenever the view has been expired. So, check how easy is to get rid of this exception using <o:enableRestorableView>.
  • 6. Loading CDN resources If you want to use <h:outputScript> and <h:outputStylesheet> to load external resources from CDNs (e.g. Google Hosted Libraries), then you know that this is not possible in default JSF ? OmniFaces comes with the solution via a custom resource handler, named CDNResourceHandler. This will simply allows you to load resources from CDNs via <h:outputScript> and <h:outputStylesheet>.
  • 7. Loading images as stream/byte array You need to render images that comes as InputStream or byte[] ? You want to render them as data URI or load SVG files? OmniFaces provides the <o:graphicImage>, which is an extension of the <h:graphicImage> dedicated to render JSF resource as data URI, InputStream/byte[] property as resource, InputStream /byte[] property as data URI, etc. Just check the OmniFaces Showcase.
  • 8. OmniFaces converters JSF custom converters are time consuming, they are called at every request regardless of whether the submitted value has changed or not, or they need to do the job based on possibly expensive service/DAO operations, etc. Just if you read the names of converters provides out of the box by OmniFaces, you will take into account to check them at your first need to write a custom converter: GenericEnumConverter ListConverter ListIndexConverter SelectItemsConverter SelectItemsIndexConverter ValueChangeConverter Read further: OmniFaces Converters by Constantin Alin
  • 9. OmniFaces validators Components validation is interdependent ? Need special custom validators to: - validate if ONLY ONE of the given UIInput components have been filled out ? - validate if ALL of the given UIInput components have been filled out ? - validate if ALL of the given UIInput components have the same value ? - validate if ONLY ONE of the given UIInput components has been filled out or that NONE of the given UIInput components have been filled out ? … If you answered yes, or you think of some other case, then OmniFaces has a set of 14 special custom validators. Read further: OmniFaces Validators by Anghel Leonard
  • 10. OmniFaces server-side Cache Your page source code contains a lot of markup ? Well, the Render Response phase is the most time consuming JSF phase, especially in cases when the rendered markup is consistent. You can speed up this process with a snap of a finger via the OmniFaces Cache component. Caching markup will boost the Render Response phase (check some tests here). The examples provided by OmniFaces Showcase are very clear and well explained. Read further: Test OmniFaces Cache for Render Response Phase by Anghel Leonard
  • 11. Defer JavaScript loading I know a trendy topic: deferred scripts. I'm pretty sure that you heard about placing the scripts at the end of </body>, use defer="true“ or async= "true", but I'm not so sure that you know that these approaches are not really working as expected. The OmniFaces, <o:deferredScript> defers the loading of the given script resource to the window load event (the given script resource is only loaded when the window is really finished with loading).
  • 12. Preserve view/request parameters on post-back As you know, when we submit JSF forms we simply cannot preserve view or request parameters in the request URL. Well, OmniFaces fixes this issue via Form (<o:form>) component, which extends the standard <h:form> and provides a way to keep view or request parameters in the request URL after a post-back and offers in combination with the <o:ignoreValidationFailed> tag on an UICommand component the possibility to ignore validation failures so that the invoke action phase will be executed anyway.
  • 13. Execute JSF AJAX request via JavaScript method call As an end-user you may want to execute a JSF AJAX request via a JavaScript function call. Well, OmniFaces provides the CommandScript component exactly for this purpose. The <o:commandScript> is a component based on the standard <h:commandXxx> which generates a JavaScript function in the global JavaScript scope which allows the end-user to execute a JSF AJAX request by just a function call functionName() in the JavaScript context.
  • 14. OmniFaces tree hierarchy OmniFaces comes with Tree component. The <o:tree> allows the developers to have full control over the markup of a tree hierarchy by declaring the appropriate JSF components or HTML elements in the markup. The <o:tree> does namely not render any HTML markup by itself. Beside the OmniFaces Showcase, you can check some examples here: Use OmniFaces Tree to render JSON Expose a path as an OmniFaces tree (<o:tree>) Building dynamic responsive multi-level menus with plain HTML and OmniFaces
  • 15. OmniFaces stateless ViewParam The JSF built-in <f:viewParam> is a stateful artifact. This causes major issues as Arjan Tijms points on his blog. OmniFaces, comes with a stateless ViewParam component. The <o:viewParam> is a component that extends the standard <f:viewParam> and provides a stateless mode of operation and fixes the issue wherein null model values are converted to empty string parameters in query string (e.g. when includeViewParams=true) and the (bean) validation never being triggered when the parameter is completely absent in query string, causing e.g. @NotNull to fail.
  • 16. Full AJAX exception handler By default, most of AJAX exceptions are invisible to the client. They are returned to the client, but unfortunately JSF AJAX clients aren't prepared to deal with arbitrary error messages, so they simply ignore them. But a custom exception handler is specially created for this task by OmniFaces. The handler is named FullAjaxExceptionHandler, and the factory is named FullAjaxExceptionHandlerFactory. This will give to your AJAX based applications a real boost, because your end users would know if their actions was successfully performed or not.
  • 17. Highlight invalid inputs Beside validation messages, you simply want to highlight the invalid inputs of a form via some CSS ? The OmniFaces, <o:highlight> is a helper component which highlights all invalid UIInput components and the associated labels by adding an error style class to them. Additionally, it by default focuses the first invalid UIInput component.
  • 18. OmniFaces boosted messages Working with <h:message> and <h:messages> has several important limitations. OmniFaces, comes with <o:messages>, which allows us to specify multiple client IDs space separated in the for attribute, show a single custom message whenever the component has received any faces message, HTML escaping and messages iteration markup control.
  • 19. Eagerly instantiate scoped beans CDI managed beans doesn’t have the ability to eagerly instantiate application scoped beans. OmniFaces fills this void and even goes one step further by introducing the @Eager annotation that can be applied to @RequestScoped, @ViewScoped, @SessionScoped and @ApplicationScoped beans. This causes these beans to be instantiated automatically at the start of each such scope instead of on demand when a bean is first referenced.
  • 20. OmniFaces PartialViewContext Do you need to: • Execute callback scripts by PartialResponseWriterstartEval() ? • Add arguments to AJAX response ? • Prevents errors about malformed XML caused by tags which Mojarra and MyFaces has left open after an exception in rendering of an already committed AJAX response ? • Fix the no-feedback problem when a ViewExpiredException occurs during an AJAX request on a page which is restricted by web.xml <security-constraint> ? Then you need the OmniFaces, OmniPartialViewContext.
  • 21. OmniFaces events for Invoke Application JSF comes with a considerable number of events, but none of them is related to Invoke Application phase. OmniFaces fills this void with the InvokeActionEventListener which add support for the new <f:event> types: preInvokeAction and postInvokeAction. Those events are published during the beforephase and afterphase of INVOKE_APPLICATION respectively. This actually offers a better hook on invoking actions after the <f:viewParam> values been set than the preRenderView event. Starting with OmniFaces 2.2, any component will support these two events.
  • 22. Auto-generated JSF component IDs As you know, JSF will provide auto-generated IDs for each component that doesn’t have an explicit ID. OmniFaces has an view handler, NoAutoGeneratedIdViewHandler which inspects the rendered output and signal via an llegalStateException whenever an automatically generated JSF component ID (j_id...) is encountered in the rendered output.
  • 23. Extensionless URLs Do you find the presence of the extension (e.g. .xhtml) inappropriate in the URL ? Well, OmniFaces comes with FacesViews, which is a mechanism to use SEO-friendly extensionless URLs in a JSF application without the need to enlist individual Facelet source files in some configuration file. Instead, Facelets source files can be put into either the special /WEB- INF/faces-views directory, from where they will be automatically scanned (no configuration whatsoever required) or an explicit directory can be configured to be scanned. The web app root is supported as well.
  • 24. Import constants By default, constant field values cannot be use in JSF pages. Well, OmniFaces provides the ImportConstants tag handler that allows the developer to have a mapping of all constant field values of the given fully qualified name of a type in the request scope (e.g. declared as, public static final).
  • 25. Import functions By default, functions that are not registered in .taglib.xml file cannot be use in JSF pages. Well, OmniFaces comes with the ImportFunctions tag handler which allows developers to have access to all functions of the given fully qualified name of a type in the Facelet scope using the usual EL functions syntax without the need to register them in .taglib.xml file. The functions are those public static methods with a non-void return type.
  • 26. Combined resource handler As you know, for each resource (CSS and JS) we have a separate request. OmniFaces seriously improve the page loading speed via the CombinedResourceHandler resource handler. This will remove all separate script and stylesheet resources which have the target Attributeset to head from the UIViewRoot and create a combined one for all scripts and another combined one for all stylesheets.
  • 27. Unmapped resource handler When we need to reference relative URLs to images in CSS files we can use the #{resource} EL expression in images paths. This issue is solved by OmniFaces via the UnmappedResourceHandler. This implementation allows the developer to map JSF resources on an URL pattern of /javax.faces.resource/* without the need for an additional FacesServlet prefix or suffix URL pattern in the default produced resource URLs.
  • 28. Injecting cookies and context params Need quick access to information stored in cookies and context parameters ? Preferably via CDI injection ? Well, OmniFaces provides @Cookie annotation for injecting cookie data and @ContextParam annotation for injecting context parameters (the later is available starting with OmniFaces 2.2).
  • 29. OmniFaces filters OmniFaces comes with several filters, as follows: • CacheControlFilter - controls the cache-related headers of the response • CharacterEncodingFilter - set the request body character encoding when not already set by the client • FacesExceptionFilter - solve 2 problems with exceptions thrown in JSF methods: Mojarra's FacesFileNotFoundException needs to be interpreted as 404 and root cause needs to be unwrapped from FacesException and ELException to utilize standard Servlet API error page handling. • GzipResponseFilter - will apply GZIP compression on responses whenever applicable • HttpFilter - abstract filter specifically for HTTP requests
  • 30. OmniFaces ViewScope OmniFaces comes with a view scope that can be used in JSF 2.0/2.1. Starting with JSF 2.2, we can use the built-in view scope, but, if we need to immediately destroy @ViewScoped bean when browser window is unloaded /closed then we need to come back to OmniFaces solution. Starting with OmniFaces 2.2, the view scope was improved to immediately destroy @ViewScoped on a GET navigation, or a close of browser tab /window. These features are not supported by JSF 2.2.
  • 31. OmniFaces utilities methods OmniFaces comes with 300+ utilities methods that are available in org.omnifaces.util package. We have utility methods based on JSF API for AJAX, CDI Beans, messages, faces, events, callbacks, renderers, etc. Most of them are useful to obtain a less verbose code, much easy to understand, others provides hidden functionalities or simply comes with new functionalities that are not easy to be achieved in JSF. Read further: OmniFaces Utilities ZEEF Page by Anghel Leonard
  • 32. OmniFaces utilities functions OmniFaces comes with a comprehensive set of utilities functions in org.omnifaces.el.functions package. These functions allows us to easy manipulate objects, strings, arrays, dates, numbers, etc directly in page via EL. Read further: OmniFaces Utilities ZEEF Page by Anghel Leonard
  • 33. References • Bauke Scholtz - http://balusc.omnifaces.org/ • Arjan Tijms - http://arjan-tijms.omnifaces.org/ • JSF ZEEF page - https://jsf.zeef.com/bauke.scholtz • OmniFaces ZEEF page - https://omnifaces.zeef.com/bauke.scholtz • OmniFaces Wikipedia - http://en.wikipedia.org/wiki/OmniFaces