Databases Reference
In-Depth Information
These are some best practices for JavaScript and CSS:
•
Use the APEX JavaScript APIs when appropriate. Because jQuery is now included
with APEX, it may be tempting to use the
val()
function to set the value of an
element on the page. However, the
$v
and
$s
functions, part of the JavaScript APIs
included with APEX, were created to work with APEX items specifically so they
handle things like LOVs correctly. Newer, properly namespaced APIs are available
as well. For example,
apex.item('PX ITEM').getValue()
can be used in place of
$v('PX ITEM')
. It's a bit more verbose, but by using only the functions in the APEX
namespace, you can prevent issues that could result from collisions with other
JavaScript libraries.
•
Trigger events when appropriate. A number of events were introduced with APEX
4.0, such as
apexbeforerefresh
and
apexafterrefresh
. Ensuring that your plug-ins
trigger these events when they apply allows plug-in users to create dynamic
actions on top of them. Also, depending on the plug-in, you may want to consider
triggering custom events and registering them with the plug-in so that they are
available via Dynamic Actions.
•
Compress your JavaScript and CSS code. The JavaScript and CSS code used in
your plug-ins will add to the overall page weight in APEX. To minimize the impact
on performance, make sure to compress the code before deploying the plug-in. A
great tool for this is YUI Compressor from Yahoo. Make sure to keep the original
files safe for future development as compressed files are not very usable.
•
Use files accessible via the file system of the web server. The APEX plug-in
framework makes it very easy to “bundle” files with plug-ins by uploading them
directly as part of the plug-in. This is very convenient for both installation and
deployments, as the files go with the plug-in. However, the files are stored in the
database, which adds a little overhead when the browsers go to retrieve them.
Using files on the file system avoids this overhead but requires additional
installation and deployment steps. Try to design your plug-ins in such a way that
plug-in files are bundled by default but switching to file system files requires little
effort.
•
Protect references to the
$
object for jQuery. Now that jQuery and jQuery UI are
included with APEX, you may want to take advantage of them in your plug-ins.
Many people who already use jQuery are familiar with referring to the jQuery
object as
$
. While convenient, this practice can cause problems if another
JavaScript library is using the
$
as well. See the “jQuery UI Widget Factory” section
for a working example of how to protect references to the
$
object.
•
Use debug/logging code in your code. Debug code is code that is added to code to
provide insight into how the code is (or is not) working. Debug code can be useful
to plug-in developers as well as plug-in users. For JavaScript code, plug-in
developers can output debug information to the console on browsers that support
it. Martin D'Souza has written a simple console wrapper that makes console
logging in APEX very simple. Learn more at
http://code.google.com/p/js-
console-wrapper/
.
