Databases Reference
In-Depth Information
As shown in the preceding snippet, the property file defines a key-value kind of
structure. The key is the name of the individual image file. The value contains the
width, height, and top
y
coordinate of the individual image in pixels. Liferay tag
libraries take image names as an input. With the use of this property file, they can
load individual images from
_sprite.png
. As mentioned earlier, Liferay Portal
also generates
_sprite.gif
, which is used for old browsers.
This feature of Liferay Portal can be easily disabled or enabled. By default this
feature is enabled. During the development phase, developers may want to
disable this feature. It can be disabled by adding the following property in
portal-ext.properties
:
theme.images.fast.load=false
It is recommended to keep this property set to
true
in the production environment.
We looked at how CSS image sprites work for built-in features. We can also use Liferay
tag libraries in custom portlets to load images from a theme. To load an image from an
image sprite, we can simple use the
icon
tag of the
liferay-ui
tag library. Here is an
example code snippet from a custom portlet that is loading an image from a theme:
<%@ taglib uri="http://liferay.com/tld/theme" prefix="liferay-theme"
%>
<liferay-ui:icon src='<%= themeDisplay.getTheme().
getContextPath()+"/"+ themeDisplay.getTheme().getImagesPath() + "/
common/activate.png" %>' />
As shown in the preceding code snippet, we loaded an image from the theme.
We just provided the path of the image. Internally, depending upon the value of
the
theme.images.fast.load
property, Liferay loads the individual image or
sprite image.
Minifying JavaScript files
Minification is a technique to reduce the number of characters from JavaScript files
without affecting the functionality. With this technique, we can reduce the size of
JavaScript files and improve the response time. It is recommended to use minified
JavaScript files in the production environment.
Once JavaScript files are minified, it becomes difficult to read, debug, or modify
them. Hence, it is a best practice to keep both minified and nonminified files in a
version control system. In the production environment, only the minified version of
JavaScript files should be deployed. In order to make sure all the JavaScript files are
minified, it is recommended to automate the minification of the files through build
scripts. This can be easily done by adding a target in an ANT build script.