{"id":316,"date":"2021-03-18T16:09:13","date_gmt":"2021-03-18T16:09:13","guid":{"rendered":"http:\/\/www.volucer.it\/?p=316"},"modified":"2021-03-18T16:10:38","modified_gmt":"2021-03-18T16:10:38","slug":"on-browser-javascript-engine","status":"publish","type":"post","link":"https:\/\/www.volucer.it\/?p=316","title":{"rendered":"ON BROWSER JAVASCRIPT ENGINE"},"content":{"rendered":"\n

JAVASCRIPT EXECUTION LIMITS IN THE WEB BROWSER<\/strong><\/p>\n\n\n\n

When we ask the visualization of a web page in the browser, it could shows you:<\/p>\n\n\n\n

Warning: Unresponsive script\" prompt that says \"A script on this page may be busy, or it may have stopped responding. You can stop the script now, or you can continue to see if the script will complete.\"<\/em><\/p>\n\n\n\n

It means that a script takes too long to run and the browser doesn\u2019t accept it.<\/p>\n\n\n\n

A consequence of it is that the user interaction with the browser and web page is stopped.<\/p>\n\n\n\n

The browser UI and JavaScript code share a single processing thread. Every event is added to a single queue. When the browser becomes idle, it retrieves the next event on the queue and executes it.<\/p>\n\n\n\n

In reality, browsers starts a new OS process for every tab. However, there is still a single event queue per viewed page and only one task can be completed at a time. This is necessary for rendering the web page and for the user interaction with the web page in the browser.<\/p>\n\n\n\n

To test the speed and limit of web browser in the execution of the JavaScript code we are going to use a heavy processing algorithm for generation of combinations without repetitions.<\/p>\n\n\n\n

<\/p>\n\n\n\n

DONALD KNUTH\u2019S ALGORITHM FOR GENERATION OF COMBINATIONS WITHOUT REPETITIONS<\/strong><\/p>\n\n\n\n

The number of combinations of n things, taken k at a time are exactly:<\/p>\n\n\n\n

\"\"<\/p>\n\n\n\n

We can think these n things as an ordered collection of objects and we can use binary notation to discover combinations.<\/p>\n\n\n\n

For example, we take a set of five letter: {A,B,C,D,E}<\/span> and we want to list the combinations of 2 letter from this set without repetitions. Using the formula above the number of combinations is 10.<\/p>\n\n\n\n

We consider this set as an ordered set: A<B<C<D<E<\/span> and we use the binary notation to represent it where<\/p>\n\n\n\n

0 means the letter is not in the combination and 1 means the letter is in the combination.<\/p>\n\n\n\n

We know that the number of all subsets is = 32 > 5, while we have to select of these subsets only those that have a number of elements equal to 2. <\/p>\n\n\n\n

Considering the set as an ordered set {A,B,C,D,E} and using the binary notation, the list of all subsets of this set are:<\/p>\n\n\n\n

\"\"<\/a><\/figure><\/div>\n\n\n\n

Only good binary representations are used to generate good combinations.<\/p>\n\n\n\n

Here it is a combination tool<\/a>.<\/p>\n\n\n\n

A program in JavaScript to codify the algorithm could be:<\/p>\n\n\n\n

\/\/--------------------------------------------------------------------\nfunction GenerateCombination<\/strong>s()\n\t{\n\t  var Answer_Head = \"<table border='1' >\";\n\t  var Answer_Body = \"\";\n\t  var Answer_Tail = \"<\/table>\";\n\t  var ErrorCode = 0;\n\t  var ErrorMsg  = \"\";\n\n\t  var nCombSize = 0;\n\t  var BaseComb  = new Array();\n\t  var iBaseComb = 0;\n\t  var CodeComb  = 0;\n\t  var CombList  = new Array(); \n\t  var ACombItem = \"\";  \n\t  var BinaryNumber       = new Array();\n\t  var BinaryStringNumber = \"\";\n\t  var NProgres           = 0;\n\t  var RNProgres          = 0;\n          var NFilter            = 0;\n   \n          var Start = Date.now(); \n\t  var End = Date.now();\n\t  var Elapsed = End - Start \/\/ time in ms\t\n\t  var cElapsed = Elapsed.toString();\n\t\t    \n\t  \n\/\/ AREA INTELLIGENCE \n\t  \n  \/\/ Clear Area\n  window.document.getElementById(\"i_BackMsg\").innerHTML  = \"\" ;\n  window.document.getElementById(\"i_Answer\").innerHTML   = \"\"\n\t     \n\t\n\/\/ Check Input Data\n  if ( isNaN( window.document.getElementById(\"iN\").value) ) {  \n        ErrorCode = 1;\n       ErroMsg   = \"Attention !!! The Combination Size must be a number.\"; \n\t }\t \nelse {\n     if (window.document.getElementById(\"iN\").value == 0 || \n         window.document.getElementById(\"iN\").value == \"\" ) {\n    \t ErrorCode = 11;\n    \t ErroMsg = \"Attention !!! The Combination Size must be a value more then zero.\"; \n          }\n        else\n        {\n           if (window.document.getElementById(\"iN\").value >= 20 ) {\n              ErrorCode = 11;\n              ErroMsg   = \"Attention !!! The Combination Size must less then 20.\";\n            }\n\t    else\n\t    {             \t           \n\t      nCombSize = window.document.getElementById(\"iN\").value ;\n\t    };           \n\t};      \n\t};\n\n\/\/ Show Msg  \n  if ( ErrorCode > 0 ) {  \t       window.document.getElementById(\"i_BackMsg\").innerHTML =ErroMsg+\"<br\/>\" ;\t  \nreturn;\n } \n  else\n {\n  window.document.getElementById(\"i_BackMsg\").innerHTML =\"OK!\" ;\n };\n\t  \n    \n    \n\/\/ Check Elements\n  iBaseComb = 0;\n        \n  if ( !(window.document.getElementById(\"i_e01\").value == \"\" || \n       window.document.getElementById(\"i_e01\").value == \"0\" )) {          \n              BaseComb[iBaseComb]=window.document.getElementById(\"i_e01\").value;\n              iBaseComb++;\n  };      \n          \n         \n   < .... ><\/strong>\n          \n        \nif ( !(window.document.getElementById(\"i_e20\").value == \"\" || \n      window.document.getElementById(\"i_e20\").value == \"0\" )) {          \n              BaseComb[iBaseComb]=window.document.getElementById(\"i_e20\").value;\n              iBaseComb++;\n        };      \n\n\n     \n       if ( iBaseComb == 0 || iBaseComb <= nCombSize )  {     \n    \t   ErrorCode = 11;\n    \t   ErroMsg = \"Attention !!! The Elements must not be equal to or more than the combination size.\";\t   \n       };\n       \n  \t  \/\/ Show Msg  \n    \t  if ( ErrorCode > 0 ) {\n    \t     window.document.getElementById(\"i_BackMsg\").innerHTML =ErroMsg+\"<br\/>\" ;\t  \n    \t     return;\n    \t  } \n    \t  else\n    \t  {\n    \t      window.document.getElementById(\"i_BackMsg\").innerHTML = \"\" ;\n    \t  };       \n     \n     \n    \/\/ Combination Code\n       CodeComb=0;\n       for (j=0;j<=iBaseComb-1;j++){\n           CodeComb+= Math.pow(2,j);\n       }; \n               \n\t\/\/ Combination Generator\n          CombList  = new Array(iBaseComb); \n       \n       for (y=0;y<=CombList.length-1;y++){\n          CombList[y]=\"0\"\n       };\n       RNProgress = 0;\n       NProgres   = 0;\n       for (k=0;k<=(CodeComb); k++) {\n         \n            BinaryNumber = DecimalToBinary(k, iBaseComb);\n         \n                                 \n            if ( IsAGoodCombination (BinaryNumber, nCombSize ) ) {\n                    \n                  for (y=0;y<=CombList.length-1;y++){\n                       CombList[y]=\"0\";\n                   };                    \n                      \n                   \/\/ Make the combination       \n                   for (x=0;x<=BinaryNumber.length-1;x++){                   \n                        \n                         if (BinaryNumber[x]==\"1\"){\n                            CombList[x]=BaseComb[x];                                             \n                         };                         \n                                     \n                      };\n                      \n                     CombList.sort(function(a,b){return a - b});\n                      \n                     NProgres++;\n                     \n                      \n                     ACombItem=\"\";        \t\t\t\t\t  \n        for (j=0;j<CombList.length;j++){\n\t\t\t \t\t     \n\t    if (CombList[j]!=\"0\"){\t\t\t\t\t\t  \n               ACombItem=ACombItem+CombList[j]+\" \";                                             \n             };                         \n\t};\n                     window.document.getElementById(\"i_Answer\").innerHTML+=NProgres.toString()+\" - \";\n window.document.getElementById(\"i_Answer\").innerHTML+=ACombItem+\"<br \/>\";\n      };         \n };       \n window.document.getElementById(\"i_Answer\").innerHTML+=Answer_Tail+\"<br \/><br \/>\";\n End = Date.now();\n Elapsed = End - Start \/\/ time in milliseconds\t\t\n cElapsed = Elapsed.toString();\n window.document.getElementById(\"i_Time\").innerHTML=\"Time Elapsed: \"+cElapsed+\" ms\";\n return ;\n}\n\t\n\/\/--------------------------------------------------------------------\nfunction DecimalToBinary<\/strong> (iDecNumber, iSize){\n  \n \/\/ Section Data Structure\n    answer = new Array(iSize);\n    n10  = iDecNumber;\n    x2   = iDecNumber;\n    log2 = 0;\n \/\/ Section Initialization \n    for (j=0; j<=answer.length-1;j++){\n         answer[j]=\"0\";\n    };          \n\/\/ Section Intelligence      \n    while (x2>=2) {\n          x2=x2\/2;\n          log2++;     \n    };\n     for (l2=log2;l2>=0;l2--) {\n       power = Math.pow(2,l2);\n       if (n10 >= power) {\n           answer[l2]=\"1\";\n           n10 = n10 - power;\n       }\n       else {\n           answer[l2]=\"0\";\n       };      \n     };     \n     answer.reverse();     \n     return answer     \n  }\n\t\n\/\/--------------------------------------------------------------------\n\t\nfunction IsAGoodCombination<\/strong> ( iBRNumber, iCombSize ) {        \n    var NumberOfOne = 0 ;\n    for (j=0;j<=iBRNumber.length-1;j++) {        \n        if (iBRNumber[j]==\"1\") {          \n          NumberOfOne++;          \n          if ( NumberOfOne >  iCombSize ) {\n             break;\n          };\n        };     \n    };    \n    if ( NumberOfOne == iCombSize ) {\n       return true; \n    }   \n    else {\n       return false;   \n    };\n  }  \n\/\/--------------------------------------------------------------------<\/code><\/pre>\n\n\n\n
<\/p>\n\n\n\n
WEB APPLICATION CLIENT-SIDE JAVASCRIPT PERFORMANCE<\/strong><\/p>\n\n\n\n
The results of using as benchmark the JavaScript program previously described are the following ones.<\/p>\n\n\n\n