Why modular jsf.js includes, there is one jsf.js file, right?
Since the beginning of the introduction of jsf.js in JSF there has been only one jsf.js file which serves all Ajax needs.
However, at least for Apache MyFaces there have been a lot of extensions added such as:
- iframe ajax fileupload
- html5 form detection
- client side i18n message support for various languages (including chinese)
- legacy browser support down to blackberry 4.7 and winmobile 6.5 and ie6
- browser optimisations for browsers supporting dom level3
- queue control for the ajax request queue
- timeout handling
- better error handling
- delay handling
- modular structure which can be changed at runtime to replace it with your own implementation of subparts
- clear distinction between api and impl on codelevel
Most of those extensions will make it one way or the other into the official jsf spec. However different scenarii have different needs.
While most legacy mobile browsers are now slowly phased out (and is seen as deprecated) ie6 for the time being is still supported with a burden of legacy code.
However in a pure modern mobile environment for instance you need smaller files and no legacy code at all. Many users are also perfectly happy with a pure implementation of jsf.js according to the spec without any extra features. Other users only need a subset of those features and want to leave out the other (i18n support for instance)
The advantage of dropping code is smaller filesizes, faster code due to less lines which have to be processed and less fallbacks which have to be prechecked. Something worthwhile to explore given modern mobile browser environments and situations where you simply want to be as lean as possible.
So what is the solution for all this
The MyFaces jsf.js Modular Includes
As of MyFaces 2.1.4 a modular include system will be added. Simply by adding following parameter to your web.xml you will be able to determine what will be included
With the parameter
and the allowed values of
Following image shows the version of each file and the extra functionality:
|Modular include parts|
As you you can see you can stack and mix all the modules you need by simply choosing a base jsf.js and then you are able to stack the extra functionality needed by adding a separate include.
That way you have the choice between filesize, number of includes and features according to your needs.
Example on how to Enable the Modular Includes with Additional Features
The following example will include the minimal-modern jsf.js and will stack all the extra functionality on top of it.
in your page template
As you can see all you need to to is to reference the correct js file additionally which is hosted under the resource module myfaces and you are ready to go.