JSOPT: A Framework for Optimization of JavaScript on Web Browsers

In the current era where multi-core technologies are very common in use, the existing web browsers are unable to fully utilize the capability of multi-core processors.The web browsers execute the JavaScript code locally in order to produce an efficient response of web pages. This responsiveness is however limited by the fact that the JavaScript code is uni-threaded, and consequently, the efficiency of the code degrades if it involves a large number of computations. In this paper, we propose a framework called JSOPT (JavaScript Optimizer) which generates an efficient JavaScript code to effectively utilize multi-core architectures. The framework uses a template containing constructs for communication & synchronization, and subsequently generates optimized code to be executed on the multi-core architectures. Multiple instances of templates are then generated with different implementations of the code and the best instance is selected to be incorporated in the library. With the optimized code generated using JSOPT, our results show a significant improvement in the performance of several benchmarks involving intensive computations based matrix operations on the Mozilla Firefox web browser.


INTRODUCTION
J avaScript is the most popular scripting language and is supported by almost all of the modern web browsers. It is used to leverage the websites by allowing dead web pages to interact with users, thereby improving the response time and interactivity. In contrast to Java, the JavaScript code is embedded inside HTML (Hyper Text Markup Language) [1]. The web browsers are required to run the HTML applications, thereby constraining the execution of the JavaScript code inside a single thread created for their execution [2].
In recent years, the hardware technology has evolved as well from a single processing unit to multiple processing units within a system. The shared memory systems, in this regard, contain tightly coupled processing units so that the memory can be shared among these units. Despite these advancements, the JavaScript code is far away from exploiting the parallelism and gaining performance improvement with multiple processing units [3]. This limitation arises from the fact that the execution of the JavaScript code is totally browser dependent which often becomes unresponsive. Most of the web browsers get into an such a state because of two basic reasons: The entire workload is transferred to a single processing unit whereas the rest of the processing units remain idle.
Consequently, the performance efficiency of the code deteriorates. Unfortunately, most of the web browsers and the applications executing on them are not set to exploit the multi-core architectures despite the usage of heavy JavaScript code.
Although the functions such as setTimeout and setInterval [4] may be used in JavaScript in an asynchronous manner to simulate a parallel execution, the execution of JavaScript still remains inside a single thread. Multi-threaded execution of JavaScript, in contrast, means dividing the script into small segments and treating each segment as an independent thread. Each thread has its own resources as well apart from the UI (User Interface) thread. This requirement led to the development of Web Worker API [5][6]  improving the performance of JavaScript code [11][12][13] or estimating the quality of JavaScript Code as described in [14], however, to the best of our knowledge, this is the first attempt to improvethe performance of the JavaScript code on multi-core architectures in an automated way.
The rest of the paper is organized as follows. In Section 2, we discuss the multithreaded execution context of JavaScript and the related work. Section 3 describes the architecture of the proposed JSOPT framework. The main features of the JSOPT framework are succinctly discussed in Section 4.
The experimental setup and performance results are presented in Section 5. The conclusion and future work are discussed in Section 6.

CONTEXT AND RELATED WORK
Over the past few years, the use of multi-cores in a single system has increased remarkably. Similarly, a huge growth has been seen in the use of internet applications. To ensure an efficient execution of the JavaScript code, the programmers expect the web browsers to perform necessary activities required for an efficient execution of code.
JavaScript has a syntax almost similar to Java, however, it makes use of a model based architecture which is implemented by almost all the modern browsers. The cross-browser portability of JavaScript code is degraded due to non-availability of an appropriate JavaScript Framework. To cope with this issue, a prototype model to measure existing JavaScript frameworks is proposed by Graziotin et.al. [15]. The model makes use of empirical feedback from practitioners regarding metrics for a JavaScript framework. This research work however results in better selection of a framework instead of generating automated code as provided by the JSOPT framework.
Another model aimed at improving the JavaScript code uses the metrics based on size, complexity and maintainability [16]. Their research work targets the evaluation of different existing JavaScript frameworks which may be utilized by programmers to write JavaScript code in their applications. The metrics used in this study however do not target the execution speed as targeted by the JSOPT framework proposed in this paper.
A thread-level speculation based mechanism implemented in the JavaScript Engine is shown to improve performance of web applications [17]. The proposed strategy allocates each iteration of a loop to a separate thread similar to the conventional threading mechanism. In case of violation of dependencies, the execution is rolledback to a previous point. The smaller granularity of parallelism results in a small improvement in performance of the code in comparison with the our suggested approach.
The research study in [18] discusses top free JavaScript frameworks in terms of their main characteristics (e.g.

JSOPT FRAMEWORK ARCHITECTURE
The proposed framework JSOPT is implemented as a prototype and can be used to generate optimized JavaScript code for mathematical problems in the form of a library. Currently, the mathematical problems involving the widely used matrix operations have been optimized.
Using optimized code, efficient results are produced without blocking the web browser's UI thread.
The main architecture of the JSOPT framework is depicted in Fig. 1. It makes use of a template comprising three subtemplates (Main, onMessage, CollectData), corresponding to a routine for which the optimized JavaScript code is to be generated. As shown in Fig

FEATURES OF THE LIBRARY GENERATED BY THE JSOPT FRAMEWORK
All the execution of code is required to be performed on the web browser. On a multi-core system, the JSOPT framework adopts a mechanism in which the Web Worker API support [3,5] is exploited.

Portability
Using JSOPT framework, if the Web Worker API support exists on a web browser, the optimized library functions  CallCode uni (X, S, E, R, u 1 , v 1 , u 2 , v 2 ) 5.

Time Efficiency
The optimized library is generated by iteratively searching for the best version of code in terms of the time efficiency.
The improvement in performance is obtained by executing individual function code on the cores actually existing in the system.

Scalability
As the number of cores grows on the client machine, more efficient results are produced by executing the optimized code generated by the JSOPT framework.

EXPERIMENTATION SETUP AND RESULTS
Web workers don't share memory so all the messages are copied to be passed between threads, because of this nature we use Transferable Objects [26][27] where the ownership of filled buffer is passed to worker thread. We use Mozilla Firefox for our experimentation which is considered to be the most widely used open source web browser, supported by most of the platforms ranging from modern smartphones to the high-end servers. We

Matrix of Minors and Cofactors
The performance results obtained for calculating the matrix of minors and cofactors are shown in Fig. 2. The Xaxis contains the order of the input square matrix for which the computation is performed.

FIG. 2. TIME ANALYSIS GRAPH FOR MATRIX OF MINORS AND COFACTORS
The parallel code for 2 threads as produced by the JSOPT framework performs better than the sequential code. It

Matrix Power
The results to calculate the square of an input matrix using matrix power code are shown in Fig. 3. The order of the input matrix is given on X-axis.

Matrix Multiplication
The performance results obtained for calculating the matrix multiplication of two square matrices are shown in Fig. 4. The X-axis contains the order of the input square matrices for which the matrix multiplication is performed.

Matrix Inverse
The performance results obtained for computing the matrix inverse are shown in Fig. 5. The X-axis contains the order of the input square matrix for which the inverse is computed.

CONCLUSION
In the last few years, a huge increase has been seen in the use of internet applications. For better performance of these applications, it is required to offload complex applications into small segments and distribute workload into multiple threads to take full advantage of available resources such as multiple cores.
In this paper, we have proposed a framework called JSOPT that is able to produce optimized JavaScript code

FIG. 5. TIME ANALYSIS GRAPH FOR MATRIX INVERSE METHOD
The Web Worker API deployed in our suggested approach is limited to support only the message passing mechanism and also lacks any suitable synchronization constructs. As future work, we intend to enhance the Web Worker API by developing a hierarchical thread spawning mechanism with the hierarchy starting from a parent thread different from the UI thread together with implementation of other matrix operations such as matrix determinant and transpose.