I'm building an app that requires the generation of a lot of textfields.
The generation of the code for the Ext.Panel is created on the server and then the JSON is loaded into a parent Panel with code for example:-
The problem I have is, the ExtJS framework creates approximately 10,000 lines of HTML code once it renders the panel. IE8, compared to Chrome, is slow. What is odd is that IE9 is slower than when it's in IE8 emulation mode! Bizarrely Safari is the fastest at render these panels, faster than Chrome.
IE9 also showing "Not responding" in it's title bar. IE8 will ask if you wish to allow the script to continue executing.
So as to see a working version of this system, take a look at it here. The project is only at proof-of-concept stage, so this isn't even development.
When the application loads, click "Open Form F4" button, then after than panel loads, click the "Next question" button. This is the panel I'm referring to that can take an age to load, especially IE8/IE9, not tried IE6 or 7, but running IE8 in a VM environment shows that performance is extremely poor. I have tried using the following for IE9:-
... and this does make it run slightly faster, but it's still not perfect.
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8,chrome=IE8" >
So, is there an issue with the render engine of IE9 or the JS engine of IE? Can I do anything else to make this load quicker? I'm not using lots of nested panels. I do, however, use Controllers on each of the textfields, but this isn't the cause of the slow rendering of the panel.
And for those of you who are wondering whether it's possible to print a bunch of Ext.Panels perfectly, yes, it is possible and the "Print PDF" button does indeed work. See here: