A new method for hosting and sharing MATLAB Web App

MATLAB App Designer

The visual application design of MATLAB is usually achieved using GUIDE¹ or MATLAB App Designer². GUIDE is the main early development platform for users. It is based on Java Swing development with ActiveX control support, and it can be used to easily build a fully functional and modern application. However, Oracle is no longer investing in its development and its architecture is not conducive to Web workflows. Hence, MathWorks launched MATLAB App Designer as not only a new upgrade but also a replacement for GUIDE in 2016. MATLAB App Designer has a richer graphical user interface (GUI) visualization component and it provides a more stable way for programming app behavior compared to GUIDE. The HTML-based components significantly increase the scalability of the applications and facilitate the development of Web-based workflow services, while the new interactive programming approach allows writing of more reliable callback functions and sharing of data between different parts of the application.

Currently, MATLAB App Designer is widely used in the development of MATLAB Web App, which is packaged and compiled into Component Technology File (CTF) format using MATLAB Compiler and deployed on MATLAB Web App Server. Related work includes an electric vehicle performance simulation platform developed by N. Hinovet al.³ and an optical experiment virtual simulation system developed by YU Xinjie et al.⁴. All these studies have been conducted on the basis of App Designer and can be deployed to the cloud through the Web App server. However, there are some problems, such as compatibility and slow loading. Meanwhile, Bao Cong⁵, Yu Pan⁶, etc., investigated a combination of Java and MATLAB. They used JAVA interface programming technology and the WebFigure tag in JSP to realize the effect of calling the MATLAB GUI graphical form on the web side; however, the loading speed of the graphical form is extremely low. Li Jingyu⁷, Cui Peng⁸, etc. independently designed the dynamic link library for Simulink invocation and simulation. However, this method is not suitable for the black-box compilation of App Designer. Liu Y⁹ used the sh file to call the system compiler in order to compile the MATLAB file and present it on the web through Python. However, this approach is more about a MATLAB online solution.

Current issues

At present, although the infrastructure for developing, hosting, and sharing based on MATLAB App Designer is well established, many problems persist, and they must be addressed.

Chromium 49 kernel browser is not supported

Chromium is an open-source browser kernel that has the largest market share, and it is used by nearly all major browsers (Microsoft Edge, Opera, etc.). In our tests, we found that many apps are not fully functional or they do not display complete information for Chromium versions below 49. In general, applications with MATLAB 2020a suffer from missing components, whereas applications with versions 2020b and above do not display properly. In many countries, owing to the accumulation of historical problems, the equipment update iteration is extremely slow. In the multi-point office environment based on MATLAB, Chromium49 is the highest version of the Chrome browser supported by the Windows XP system, and its incompatibility will become the main obstacle to the project. As shown in Fig. 1, the virtual signal simulation application of MATLAB 2020a is considered as an example. The blue box part is not fully displayed in the browser test on Chrome 49 and Chrome 99.

MATLAB Web App loads slowly on the browser

We found that applications of MATLAB Web App load extremely slowly after deployment. The average loading time is around 12–16 s on some old computers and around 6–8 s on some new models. In particular, systems with Intel processors are generally slower than those with AMD processors.

Here, a loading test is conducted for blank components, single components, and apps composed of multiple components in MATLAB App Designer. Among them, ctf is the file format supported when the application is service-oriented, and mlapp is the file packaged by the app designer that can be run locally. When different components are loaded, the number of requests sent for the first time is roughly the same, and the first run time is relatively long. The deployment data obtained after several rounds of control loading tests and comparisons are summarized in Table 1 (Detailed data can be obtained from supplementary information).

Closed-source packaging and compilation of applications makes it difficult to study their kernel functionality and optimize them

The MATLAB Compiler tool compiles the code in the M-file on a C/C +  + interface and executes it by calling the MATLAB Compiler Runtime (MCR) runtime library component resource. This process is encrypted using an Advanced Encryption Standard (AES) key, and the resulting CTF compresses the archived file to secure the application source code, making it difficult for users to explore the internal implementation principle and optimize it.

Custom component process is complex

Previously, users used the java-component function on the GUIDE platform to add custom components and enrich the interactive functionality with undocumented java-frame properties. This process requires engineers to have a high level of experience and technical skills. Currently, users configure the metadata of the App Designer tool by specifying the UI component classes for a class file on the App Designer platform. However, the complex design aspects and limited operational space restrict the user’s ability to extend the functionality.

Deployment tools have poor scalability, security risks, and various deficiencies

MATLAB Web App Server uses industry-standard authentication and access control protocols to protect users’ Web applications and data. In addition, it provides support for cross-version development of Web applications for most application scenarios. However, it does not provide an external extension interface, and some complex scenarios such as the need to divide the deployment zone according to specific people in the physically isolated network space cannot be implemented directly. Meanwhile, it is recommended that the server be run only in a trusted intranet environment and not be open to the extranet; otherwise, it would be prone to risks such as code injection. Finally, the tool has many deficiencies, such as the possibility of mutual interference when users and programs access each other at the same time. In addition, the server restart process is often accompanied by a service error message, typically “NET HELPMSG 2244”, which can be resolved by removing redundant user registration information. In terms of server compatibility with multiple versions of Runtime, the server tends to work only on the first MATLAB Runtime path in the configuration list.

Research on application packaging and compilation mechanism

The applications supported by MATLAB Compiler¹⁰ mainly include independent applications, C/C +  + shared libraries, Excel plug-ins, and various types of .COM and .NET objects. Their dependencies are analyzed in turn, and code is generated with C/C +  + interfaces. Subsequently, the code is encrypted using AES and an archived CFT file is created. Finally, the aforementioned processes are closed for execution. During this process, the CFT file will extract resources in the MCR, decompress them (keys, etc.), and generate some M files related to DICOM reading and writing in the toolbox folder, which are presented in an unintelligible form in MATLAB Editor. It is extremely difficult to improve the application loading speed from this perspective.

Research on MATLAB Web App slow loading problem

We found that the following are the likely factors that affect the loading speed of MATLAB Web App: the invalid overloading of the MCR runtime components, the forced updating of static resources by the server, and the lack of a session management function of the web server.

MCR runtime library components

In our tests, we found that single-function applications made a similar number of requests, while complex applications required additional requests because they needed to load additional MCR component resources. By preloading the commonly used component resources to the browser in advance, one can avoid the invalid reloading of the same component resources, and the application loading speed will be improved considerably. However, the wrapper in App Designer is a black box that does not allow one to explore how it compiles, which makes it difficult to optimize the loading of the runtime components.

Static cache resources

In the statistics of the load time of the application components, we found that for the same application, when the page is refreshed within a short period of time, the load time of the application is shorter, and when the page is refreshed after a certain period of time, the load time of the application is restored to the same as that of the first load. This is because for a short time, the browser caches the static resources of the application in order to facilitate the second access, and MATLAB Web App Server defaults to update the static resources; after a certain period of time, these static resources need to be re-requested. By consulting numerous official documents under the installation path of MATLAB Runtime, one can limit some cache updates by modifying the configuration file named webapps.config. However, the improvement of this method is very limited.

Session manager

In Web App service requests, we found that the server took a long time to respond to session requests from the browser, and in most cases, reloading the application updated the sessionID. Specifically, when the application is loaded for the first time and refreshed within a short period of time, it initiates a command request to establish a newSession, which takes a long time to respond to the session. When the application interface is refreshed after a certain period of time, the command request is displayed as trackSession, indicating that the session is still maintained. This indicates that MATLAB Web App Server does not have session management capabilities. This is also confirmed by looking at the server process ctfxlancher.exe. We use cross-domain technology to build a session management system based on Spring Boot + Vue, and we store the session information in the local database so that the application can use the original parameters to connect to the server background and achieve a speed-up effect.

Pull the mirror image of Mysql, Redis, and Nginx on Docker, and complete the deployment of the front and back ends. The session information management page of the session management system is shown in Fig. 2, it contains the session id, connection id, and user information stored by the user. The scheduled task management log is shown in Fig. 3. The parameter of the scheduled end process is 32, which is the maximum number of processes allowed by the server, and the execution rule of process management is the crontab expression. This method can effectively improve the loading efficiency of the application; however, it is not flexible in the long run.

Investigating previous methods for implementing similar App Designer functions

Considering the issue of optimizing the loading speed of MATLAB Web App, we actively explored technologies and methods that can implement App-Designer-like functions, in addition to identifying breakthroughs in the MATLAB application itself.

Modelit Webservice Toolbox for MATLAB

The Modelit toolkit is used for deploying MATLAB code as a Web service in a simple manner and at the lowest possible cost. Its core is a servlet that redirects incoming Web requests to MATLAB callback functions, enabling tasks such as encapsulating MATLAB graphics in HTML, converting JSON strings to MATLAB, and parallelizing Web services through asynchronous calls. In practice, although the toolkit used to create Web services implementing GUI callbacks have a great advantage in terms of the page loading efficiency, the complex configuration of the environment and the lack of official follow-up support are serious obstacles.

Octave Web-interface

The Octave Web interface¹¹ is a browser interface for the open-source MATLAB clone GNU Octave (in combination with GNU plot). It has the characteristics of high compatibility with MATLAB programs, small size, and a rich community. We tried to mount the MATLAB Web App to its service and found that the application could not implement Simulink functionality; the code was particularly inefficient. In addition, Octave has no alternative to App Designer or GUI compared to MATLAB, and the ability to create standalone applications is limited.

Existing related technology research

Can MATLAB be combined with front-end and back-end architectures?

MathWorks provides users with various means to run MATLAB products in the cloud, such as using MATLAB Online to run MATLAB and Simulink applications online, accessing parallel computing clusters in Amazon Web Services (AWS) through MathWorks Cloud Center, and building Docker container images to deploy MATLAB in cloud and server environments. These cases comprehensively demonstrate the feasibility of combining MATLAB with front-end and back-end architectures.

Furthermore, MATLAB deployment tools provide REST APIs for synchronously or asynchronously executing application functions as well as for monitoring the server operation status, which are fully consistent with the current mainstream Web architecture style. In addition, MATLAB can be combined with front-end and back-end architectures using Ajax to handle asynchronous requests, separating the front-end and back-end, and optimizing the server performance through API specification design¹².

Research on front-end implementation methods

A low-code platform¹³ is one of the most intriguing technologies in the current science and technology industry. It can rapidly realize digital applications by means of graphics and drag-and-drop, thereby reducing the threshold of application development considerably. Moreover, it has equally satisfactory results compared to App Designer. To a certain extent, we believe that it can meet most functions of App Designer. To this end, we investigated more than 200 mainstream low-code platforms (Obtained in supplementary information) in the current market and selected Vue-Layout, Luban H5, and web_designer for development according to whether the code is open source, whether it can customize the components, and whether it can add requests and responses to the controls. However, in practice, nearly all these platforms have problems such as unstable service and incomplete function, and their creators are independent developers; hence, it is difficult to guarantee follow-up maintenance of the platforms.

Compared with the lack of a low-code platform, it is advisable to directly use a mature front-end UI framework and Vue to rapidly build a fully functional application view. This method has a high degree of freedom. The project can add user management, cache optimization, exception handling, and other functions according to the requirements.

Research on back-end implementation methods

MATLAB Production Server is an official enterprise production application that integrates MATLAB applications into Web and database services. It runs on a dedicated server or cloud, and it has most of the functions of MATLAB Web App Server with stronger data integration and features such as management and monitoring. However, it also has some disadvantages, i.e., it is expensive and incompatible with MATLAB Web applications, e.g., it is unable to interactively run the applications intuitively.

As MATLAB itself provides external language interfaces¹⁴ such as C/C +, Java, Fortran, and Python, it supports mixed programming among multiple languages. Hence, it is possible to build a MATLAB application hosting platform with external languages. Considering the simplicity and efficiency of Python, and as some Web frameworks such as FastAPI have extremely high performance comparable to Go and NodeJS, it is more practical to select Python¹⁵ to build the back-end server.

Final program determination

Considering the factors discussed above, we finally selected FastAPI as the back-end framework to write the application hosting application. Further, we used the Vue front-end framework to create a REST API to connect with the back-end, and we combined it with the Nginx server to complete the sharing. This method is simple and efficient, avoids the problem of MATLAB black-box encapsulation, and has a mature framework and rich community resources that provide effective support for the continuous development of the project.