Discussions
Categories
- 196.7K All Categories
- 2.2K Data
- 235 Big Data Appliance
- 1.9K Data Science
- 449.9K Databases
- 221.6K General Database Discussions
- 3.8K Java and JavaScript in the Database
- 31 Multilingual Engine
- 549 MySQL Community Space
- 478 NoSQL Database
- 7.9K Oracle Database Express Edition (XE)
- 3K ORDS, SODA & JSON in the Database
- 532 SQLcl
- 4K SQL Developer Data Modeler
- 186.9K SQL & PL/SQL
- 21.3K SQL Developer
- 295.4K Development
- 17 Developer Projects
- 138 Programming Languages
- 292.1K Development Tools
- 104 DevOps
- 3.1K QA/Testing
- 645.9K Java
- 28 Java Learning Subscription
- 37K Database Connectivity
- 153 Java Community Process
- 105 Java 25
- 22.1K Java APIs
- 138.1K Java Development Tools
- 165.3K Java EE (Java Enterprise Edition)
- 17 Java Essentials
- 158 Java 8 Questions
- 85.9K Java Programming
- 79 Java Puzzle Ball
- 65.1K New To Java
- 1.7K Training / Learning / Certification
- 13.8K Java HotSpot Virtual Machine
- 94.2K Java SE
- 13.8K Java Security
- 203 Java User Groups
- 24 JavaScript - Nashorn
- Programs
- 398 LiveLabs
- 37 Workshops
- 10.2K Software
- 6.7K Berkeley DB Family
- 3.5K JHeadstart
- 5.6K Other Languages
- 2.3K Chinese
- 170 Deutsche Oracle Community
- 1.1K Español
- 1.9K Japanese
- 230 Portuguese
Oracle Jet View Models - Is bundling possible?

Hi All!
I've been working with a larger scale OJet project - and despite my efforts - have been unable to successfully bundle my view Model JS files together.
Technicality aside, Yes or No, is this a supported feature within OJet currently? I've taken a look into the current support minification process for OJet: `ojet serve/build --release`. But upon investigating the dist
folder, nothing appears to be bundled or minified (Outside the components).
Thanks for the help on this - performance has become an issue on this project, hence bundling and minification has jumped up in priority for this. My solution so far has been to use terser and minify the View Models via bash. Bundling would be the biggest time save here.
Answers
-
I do not think JET CLI does this out of the box, but you can experiment with the 'include' option of r.js optimizer: https://requirejs.org/docs/optimization.html
-
Here's a generic before_optimize hook (/scripts/hooks/before_optimize.js) that will automatically find the modules that you are using (based on the default location of views and viewModels) and include them into the bundle configuration.
With this in place all the modules will be read from the bundle.js rather than being loading separately on first access - you may need to amend this if your structure is different but it shows the idea.
/**
Copyright (c) 2015, 2022, Oracle and/or its affiliates.
Licensed under The Universal Permissive License (UPL), Version 1.0
as shown at https://oss.oracle.com/licenses/upl/
*/
const fs = require('fs-extra');
const path = require('path');
'use strict';
/*
* before_build hook to automatically include JET module implementations into
* the main program bundle
*/
module.exports = function (configObj) {
return new Promise((resolve, reject) => {
console.log("Before Optimize - retreiving module list");
//Read the oraclejetconfig.json to locate the correct output folder to read
const jetConfigName = 'oraclejetconfig.json'; //will be in the root
if (fs.pathExistsSync(jetConfigName)) {
const jetConfig = fs.readJSONSync(jetConfigName);
const webFolder = jetConfig.paths.staging.web;
const viewImplFolder = path.join(webFolder, 'js', 'viewModels');
const viewModels = getIncludeFiles(viewImplFolder);
const viewFolder = path.join(webFolder, 'js', 'views');
const views = getIncludeFiles(viewFolder);
const includeFiles = [...viewModels, ...views];
//Add the retrieved list of extra files to the optimizer configuration
console.log(`Before Optimize - Adding ${includeFiles.length} files to optimizer list`);
configObj.requireJs.include = includeFiles; //The key configuration step!
}
else {
console.error('\tERROR: Unable to read oraclejetconfig.json');
}
resolve(configObj);
});
};
/*
* Function to gather the names of all the files in the target folder
* This could be enhanced to recurse through sub-folders if required
* The only trickery here is to return the paths to the files relative to
* the root that the optimization process will be based on - hence the use
* of reducedRoot below
*/
function getIncludeFiles(inFolder) {
const foundFiles = [];
const reducedRoot = inFolder.split(path.sep).slice(2).join(path.sep);
fs.readdirSync(inFolder).forEach((fileOrDirectory) => {
const fullPath = path.join(inFolder, fileOrDirectory);
if (!fs.statSync(fullPath).isDirectory()) {
if (path.extname(fileOrDirectory) === '.js') {
//strip the extension as that is not needed for js files
const withoutExt = path.basename(fileOrDirectory,'.js');
foundFiles.push(path.join(reducedRoot, withoutExt));
}
else {
//html and json files will be loaded via the text! plugin and
//need to retain the extension.
foundFiles.push('text!' + path.join(reducedRoot, fileOrDirectory));
}
}
});
return foundFiles;
}
-
Here's a more complete write up:
https://blogs.oracle.com/groundside/post/oracle-jet-application-optimization---bundling-modules