Hello,
i have performance problem. When grid height, width is set on 100% browser takes to much of CPU, which could be problem on some low power computer. It's happening on all browsers. The worst performance is in my case is on IE (I have IE10, page is running in IE8 compatibility mode), but my colleague had worst experience with Chrome.
The problem disappears when height and width is set on fix size.
Is there any option how to fix this problem and keep width and height on 100% ? Thank you.
Best regards,
Martin Zagora
Hi Martin,
Thank you for posting in our forums. I wasn’t able to reproduce the behavior that you’re describing. Could you please provide me with more detailed information about your case such as number of columns and rows, features that are enabled, the Ignite UI version and jQuery and jQuery UI versions? Or if you could just send me a sample project that demonstrates the behavior will be great.
I’m looking forward to your replay.
Kind regards,
Petko Zhekov
Software Engineer
Thank you for your care of my issue. I simplified my project as much as possible and here is the result
https://dl.dropboxusercontent.com/u/556367/ErrorAnalysis.zip
It takes about 2-5% of performance of CPU in IE10 on my computer, even the grid is completely empty and IE window is not visible on the screen. So it could be about 20-30% on older computers, which is really bad.
Thank you.
Thank you for your sample! It really helped me determine the issue. I ran the sample on a virtual machine with native Internet Explorer 8. And indeed the issue was pretty obvious. I tried to simplify the sample in order to find what causes it. I started removing unnecessary file references. The issue stopped reproducing after I removed the reference to the General.css. After that the CPU usage dropped about 4 times.
I’ll attach the simplified sample and a screenshot that shows the difference in the performance. You can uncomment the reference and try it on your machine.
Please let me know if you need more information.
Thanks you, but I tried it on my computer and it has NO effect at all on CPU usage. I ran some tests and I found out that number of rows has significant influence on usage of CPU and browsing mode (IE8, IE10) has no influence on CPU usage.
I could send you an email with unsimplified HTML, where 20 rows takes more than 10% of CPU. I don't want to present the code publicly.
I still believe that it is caused by grid resizing even if a grid is not being resized. Would it be possible to resize grid automatically only if the window is being resized? Timer set on 1000ms would be enough. But I still prefer proper solution of this problem, not workarounds :)
Thanks.
Hey,
is this CPU usage causing actual slow-down for your users? It only compares whether width/height has changed every 300 ms. this value can be easily changed (increased) by resetting it like that:
("#grid1").data("igGrid").resizeTimeout = <higher value>;
I also suggest to ensure you're using the latest javascript, because it may already include some optimizations related to your scenario.
Thanks,
Angel
What did I do wrongly?
I'm using the latest version of IG Ignite.
Thanks
Martin
Thank you for the screenshot. I think you forgot the dollar sign in the beginning of row #354.
It works. Thank you very much Martin!
Kings regards,
Hello Martin,
You can change the resizeTimeout variable with the following code which should be executed before you create the grid. Please note that this will affect all of the grids created on the page after this code is executed.
$.ui.igGrid.prototype.resizeTimeout = 5000;
// Initialize grid
$("#grid").igGrid({/*options*/});
Best regards,Martin PavlovInfragistics, Inc.
I set timer on 5000, but it has no effect to the fact how often _resizeCopntainer is calling.
Profiling was running around 10 seconds.
Would it be possible to call this function from my own script instead of calling it automatically?
Of course I did :)
I just copied Angel's code without any checking :)