Passing function parameters from JavaScript to JavaFX

Most of the time, you won't notice a delay while calling JavaFX functions from JavaScript. However, there are times you may have performance issues. Recently, we had such an issue in one of our projects: A JavaScript function was consuming a considerable amount of time. When we looked into the problem, we noticed that we were passing a big JavaScript String array to a JavaFX function as a parameter. Obviously, there was an issue about passing the array object. As an alternative, we concatenated the values in the String array and passed them to JavaFX as a single String object. And it worked! Our application ran much faster after this change.

I have created a simple JavaFX application for testing purposes. The code has two different functions which take different parameters:

import javafx.scene.*;

// This function takes a String array as parameter
function passStringArray(value: String[]){    
        
}

// This function takes a String as parameter
function passString(value : String){
    var stringArr = value.split(",");
}


And I call the JavaFX applet from JavaScript like this:
function passStringArray(){
  var stringArr = [];
  //Create a String array of size 5000 for test purpose
  for(i=0; i<5000;i++){
     stringArr.push(i + "");
  }
  
  var t1 = new Date();  
  var test = document.getElementById("test");  
  //Pass the String array as parameter
  test.script.passStringArray(stringArr);     
  
  //Output the measured time
  document.getElementById("output").innerHTML = "Measured Time: " + (new Date()-t1) + " ms";
 }
 
 function passString(){ 
  var stringArr = [];
  //Create a String array of size 5000 for test purpose
  for(i=0; i<5000;i++){
     stringArr.push(i + "");
  }
  
  var joinedString = stringArr.join(',');
  var t1 = new Date();
  
  var test = document.getElementById("test"); 
  //Pass the String as parameter
  test.script.passString(joinedString);
  
  //Output the measured time
  document.getElementById("output").innerHTML = "Measured Time: " + (new Date()-t1) + " ms";     
 }

You can download all the files needed to test the application from here.
Follow these steps to test this application:
1. Extract the package you downloaded.
2. Run "Test.html" file in your browser.
3. Click on the "Pass String Array" and "Pass String" buttons to see the performance difference.


Yücel Ünlü

Comments

Popular posts from this blog

PostgreSQL for Oracle Developers and DBA's