We just released FOEX 4.0 – Here’s a sneak peek on what’s new

We are excited to announce the public availability of FOEX 4.0 – the newest version for the FOEX Plugin Framework. This is the 17th release for the FOEX Plugin Framework and our 4th major version. One of the most important parts of this release focuses on performance improvements, as we did a lot of work on reducing initial page load times as much as possible.

Let’s dive into the most important changes & features of FOEX 4.0:

1. Performance Improvements – Page build times have been reduced from anywhere between 20-60%, depending on the number of regions, items & dynamic actions that you have on the page.
2. Content Loading into the current page i.e. TRUE Single Page Application support
3. Theme Roller Integration – customize your FOEX apps using the APEX Theme Roller
4. New Triton Compact / Mini themes
5. Grid / Tree 2-way Data Binding
6. Other Improvements

 

1. Performance Improvements

The type of applications and pages we encourage people to create with our plugins are much more complex than your typical APEX pages. This results in more regions, items, and dynamic actions and more overhead when dynamically generating the page.

Normally, this overhead is mitigated once the page is rendered since we provide a single page style application design which will load and save data without needing to reload the page (100% AJAX based). It means that we can keep the page open without needing to re-render it.

The downside is that you have the up front cost of the first page load. The upside is that subsequent interactions are faster than traditional APEX pages, since you keep many open at the same time, and thus context is kept when saving or moving between tabs i.e. the place where the user currently is on the screen doesn’t change.

In this release we have focused on reducing this initial page load time as much as possible by optimizing PLJSON, the third party library which we use for JSON generation and parsing. We have also been performing extensive R&D on 12.2c Native JSON types and working out how we can seamlessly switch to this type without changing our code in our next version. In our initial tests the results we have achieved look really promising: 20-40% reductions are possible and in some cases even more.

Note: These improvements coupled with lazy loading, lazy rendering, caching, and other code optimization that we have worked on over the years are meant to help developers build & run applications faster, without compromising on functionality.

 

2. Content Loading into the current page

By definition this is how single page applications are designed. In previous versions we have mimicked this design by using iFrames to ensure that you can include regular APEX functionality and FOEX together and rely on the APEX rendering engine to do everything for us.

However, this approach presented a series of drawbacks:

• iFrames cost close to 1 second to add to the DOM;
• all scripts and CSS need to be (re)loaded and executed;
• the Ext JS framework itself accounts for 3-4 seconds on page load to initialize and render the page.

In order improve performance, whilst making it easier to link components across pages, we have decided to no longer use iFrames to load new pages into existing ones. By using this method we now provide a 50%+ reduction in page generation / rendering times and support all FOEX regions (except for the FOEX Desktop plugin), page items and all regular APEX & FOEX dynamic actions.

In addition:

• all processes defined ‘Before Header’ will be executed
• inline CSS & JavaScript defined in the Page Definition will be included
• a transparent fallback to iFrame mode is also provided

 

Note: This new approach will start with some restrictions as we will only support FOEX plugins currently. Moving beyond FOEX 4.0 we hope to extend this functionality to support regular APEX as well. This is an exciting step for us, one that is long overdue and that will tick the box for a direct comparison with React / Angular / Vaadin applications.

 

3. Theme Roller Integration

With the introduction of the theme roller & universal theme in APEX 5.0, it has been super easy to customize the look and feel of your applications to satisfy corporate UI styling requirements.

Our goal over the coming releases is to increase our integration into APEX and to encourage developers to mix and match components. The theme roller integration in FOEX 4.0 is the first step which will allow you to provide a consistent styling across both your APEX and FOEX pages/components.

The integration itself is actually rather simple – you simply need to use our less file which includes the defined rules for FOEX components. You can achieve a completely different look with just a colour change at the global level. There are cascading rules that will vary all lighten/darken colours below to varying degrees.

There are two options on how to include the file in your application:

• Copy the FOEX Template Application as the base for your application – the less file will be included automatically and you will not need to do anything else

– OR –

• Include FoexVita.less in your application: set the path to the file in your application’s theme’s styles’ Theme Roller Attributes (Shared Components -> Themes -> Universal Theme -> THEME -> Input Parameter File URLs field)

FOEX 4.0 –  APEX Theme Roller integration

 

4. New Triton Compact / Mini themes

For customers which prefer a more data intensive and compact view or those who still use the classic themes we are providing two new variations of the Triton theme: Compact and Mini.

We have removed all the previous Ext JS themes we provide except for the Triton theme, which is now our ow Universal theme so to speak. The compact version is to satisfy the data density that the Neptune theme had and the mini reflects the density of the classic theme.

We will automatically switch all our users to switch to the Triton theme when creating new / upgrading old FOEX applications,. This theme was designed for both desktop and mobile devices, and also is the only theme we provide theme roller integration for.

 

FOEX 4.0 –  Triton Compact & Triton Mini

 

Note: We consider the Triton theme to be our own Universal Theme.

 

5. Grid / Tree 2-way Data Binding

We are including a new dynamic action “FOEX Row Select Bind Page Items” that will allow you to perform 2-way data binding by linking FOEX grid and tree grid plugin regions (in edit mode) with FOEX page items.

Direct changes to the selected grid row are propagated to the bound page items, and direct changes to the page items are propagated to the selected grid row. The grid/tree grid will be responsible for saving the changes back to the database.

Additionally you will be able to also bind plugin configuration settings to region row selections e.g. region title, tooltips, button badges. Make sure to check out the FOEX documentation for more information and examples.

FOEX 4.0 Grid – Form Data Binding example

 

6. Other improvements

FOEX 4.0 comes with a bunch of other improvements as well. One of the most notable ones is the upgrade of the Sencha Ext JS library from 6.2.1 to 6.5.3. We took this decision since there were a number of issues with Windows 10 with touch interfaces which were resolved in this new version of Ext JS.

Other enhancements available in this release are:

• Data binding for all row/item selectable plugins e.g. tree, grid, list view, big number
• Navigation plugin search
• Grid column help text support added
• Switch APEX Theme Style Dynamic Action
• New Tree Grid Hide/Show Root Dynamic Action
• New Tree Gird Before/After Root Load events
• Improvement to the Slider Page Item to Permanently Show Labels
• Grid Set Row Values Dynamic Action
• Grid Reject Changes Dynamic Action

 

All in all, FOEX 4.0 delivers performance improvements that should make your applications run faster / smoother than before. Moving forward, we’ll continue to improve on functionality, giving you more flexibility when developing applications using our components, but we’ll also aim for a stronger integration with APEX, so you can leverage what’s best of both.

So head over to your FOEX trial workspace, or sign up for a new one and take FOEX 4.0 for a spin. We’re eager to receive your feedback!