Previous Next JavaScript must be enabled to correctly display this content

## 10.1 Understanding Oracle JET Integration with Oracle APEX

Oracle APEX includes the Oracle JET (JavaScript Extension Toolkit) library. This section provides information about JET and how it is integrated with APEX.

- About Oracle JET
  Learn about Oracle JET.
- How Oracle JET is integrated with Oracle APEX
  Learn about how Oracle JET is integrated with Oracle APEX.

Parent topic: Managing Application Components

### 10.1.1 About Oracle JET

Learn about Oracle JET.

Oracle JET (JavaScript Extension Toolkit) is a collection of open source JavaScript libraries with a set of Oracle contributed JavaScript libraries. Oracle JET is targeted at intermediate and advanced JavaScript developers and provides a rich set of UI components that can be easily integrated into APEX. Oracle JET is a modular toolkit which enables developers to use as much or as little of the features that they desire.

See Also:

Oracle JET Homepage to learn more about Oracle JET.

Parent topic: Understanding Oracle JET Integration with Oracle APEX

### 10.1.2 How Oracle JET is integrated with Oracle APEX

Learn about how Oracle JET is integrated with Oracle APEX.

Currently APEX integrates some parts of Oracle JET, primarily with Chart region types.

Note:

Although Oracle JET provides two-way data binding (using `knockout.js`), currently APEX does not natively utilize this aspect of the toolkit.

Oracle JET uses a module loader (`RequireJS`) to only load modules that are required for specific functionality to work. This means that you do not have to load the entire Oracle JET library for certain functionality and also enables each module to define its own dependencies. At runtime, when a module is requested, the module loader looks at the module being requested for any dependencies to other modules. If there are any dependencies, these will also be loaded.

Module loader can however result in a large number of additional resources being individually loaded at runtime, which can have a negative performance impact. For this reason, APEX makes use of the `RequireJS Optimization Tool`, which:

- provides a way to determine all the dependencies for modules either at design time or as part of a standard build process
- bundles them up into one combined, minified file

`RequireJS Optimization Tool` is loaded at runtime to avoid the need for all the additional requests.

Find the list of the bundles used for `Chart` native type:

- `jetCommonBundle.min.js`
- `chartBundle.min.js`

jetCommonBundle.min.js

Note:

You can utilize the Common bundle `jetCommonBundle.min.js` in your plug-ins. This Common Bundle gets included on any APEX page as soon as a file is included with your plug-in, which defines the `[require jet]` prefix. This means that any module your plug-in uses that is already included in the common bundle does not need to be refetched by `requireJS`.

- Directory: `/images/libraries/apex/minified/`
- Included when: When a JavaScript file is requested that defines itself as requiring JET, by using the `[require jet]` prefix in APEX, and the page is not in Debug mode

  When debugging, the bundle is not loaded and `requireJS` loads all the individual resources separately.

chartBundle.min.js

- Directory: `/images/libraries/apex/minified/`

- Included when: A JET chart is included on a page (for example, when a `Chart` region, or `Interactive Grid` region is added to a page), and the page is not in debug mode.

  When debugging, the bundle is not loaded and `requireJS` loads all the individual resources separately.

See Also:

- requireJS homepage to learn more about RequireJS
- RequireJS Optimization Tool to learn more about RequireJS Optimization Tool

Parent topic: Understanding Oracle JET Integration with Oracle APEX