Memory leak on create and destroy grid

23 posts, 0 answers
  1. Rene
    Rene avatar
    3 posts
    Member since:
    May 2013

    Posted 08 May 2013 Link to this post

    Hi,

    I am building a single page application an i am noticing memoryleaks in Kendo Grid

    I i create a grid and then destroy the grid it seems it is not cleaning up correctly.

    I have created a fiddle that demonstrates this.
    I have also included a html file.

    If you look in the chrome developer tools in the timeline tab after creating and destroying a grid you will see that the dom node count is growing.
    Am i doing something wrong?


  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 10 May 2013 Link to this post

    Hello Rene,

    I tried to reproduce the issue, but to no avail. Could you please check the screencast and let me know what I am missing?

    Kind regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Kendo UI is VS 2017 Ready
  4. Rene
    Rene avatar
    3 posts
    Member since:
    May 2013

    Posted 11 May 2013 Link to this post

    Hello Alexander,

    I have included a screencast that shows the nodecount and eventhandlers growinging in the timeline tab of chrome developer tools.

    Thanks in advance
  5. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 14 May 2013 Link to this post

    Hi Rene,

    Thank you for the screencast. We are not sure why the DOM node count increases, but we were able to reproduce the same behaviour without Kendo UI.

    The code of the sample page is:
    <!DOCTYPE html>
    <html>
    <head>
        <title></title>
        <script src="http://code.jquery.com/jquery-1.8.2.js"></script>
    </head>
    <body>
        <div id="grids"></div
        <button id="btn">Button</button>
        <script>
            $("#btn").click(function (e) {
                $("#grids").empty().append("<div>" + new Date() + "</div>")
            });
        </script>
    </body>
    </html>

    Here is a screencast: http://screencast.com/t/cBw8Tw3XJ54
    Are you sure that the DOM node count number is correct? Probably it shows something else? Or the problem is connected with jQuery?

    Regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Rene
    Rene avatar
    3 posts
    Member since:
    May 2013

    Posted 14 May 2013 Link to this post

    Hello Alexander,

    In you example you are using jquery 1.8.x. This version of jquery has a memory leak.

    Please try it with Jquery 1.9.x. and you will see that the dom nodes will not increase anymore except for the first time. that's  probably because we are adding a new div.

    Thanks
  7. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 16 May 2013 Link to this post

    Hello Rene,

    I forwarded the case to the developer team. The results which we observed in the timeline (DOM Node Count) are inconsistent, however we were able to track some memory leaks by taking a snapshots of the heap and inspecting the detached DOM tree elements (Profiles Tab).

    I can confirm that the problem exists, however we will need more time to investigate the case. I am afraid that at present I cannot commit an exact timeframe for providing a fix.
    Please accept my apology for the inconvenience caused.

    Kind regards,
    Alexander Valchev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  8. Aditya
    Aditya avatar
    5 posts
    Member since:
    Feb 2013

    Posted 11 Nov 2013 Link to this post

    Hi Alexander,

    I am also facing the similar kind of issue in my grid implementation. Is this memory leak problem going to be resolved in next release (mid of this month perhaps).
    I am using Kendo UI Beta v2013.1.226 which embedded jQuery v1.8.2.
    Also could you please provide us pointers to reduce memory leak.

    Thanks,
  9. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 13 Nov 2013 Link to this post

    Hello Aditya,

    We will need more time to examine what exactly is going wrong. Currently I cannot provide a time term for providing a fix. I apologize for the inconvenience caused.

    Regards,
    Alexander Valchev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  10. Tim
    Tim avatar
    1 posts
    Member since:
    Feb 2013

    Posted 14 Nov 2013 Link to this post

    Good example, 

    I have been having this problem as well.  We really need a fix for this as we have 3 grids on a long lived paged.

    It appears the issue is occurring with resizable and/or selectable true.  Those are the two I have been dealing with.

    I am including a Chrome Timeline Screenshots based on the example code in this thread.



  11. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 18 Nov 2013 Link to this post

    Hi Tim,

    Thank you the feedback and for the provided information.
    The team is still investigating the case. We will write back as soon as we have more information on the case.

    Regards,
    Alexander Valchev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  12. luis
    luis avatar
    2 posts
    Member since:
    May 2011

    Posted 10 Dec 2013 Link to this post

    Calling refresh() on the grid or changing the bound datasource also seems to leave behind old tablerows.
    When applying a context-menu the click event event bound to table rows fire several times, the exact same number of "table refreshes" issued so far.
    Hope this "long shot" tip can help.
  13. luis
    luis avatar
    2 posts
    Member since:
    May 2011

    Posted 11 Dec 2013 Link to this post

    Pls forget my last post as it had nothing to do with the grid. It was all about the context menu.
  14. Vinay
    Vinay avatar
    6 posts
    Member since:
    Dec 2013

    Posted 01 Jan 2014 Link to this post

    Hi,

    Even I'm facing same issue(node count increases) when creating and destroying grid.
    I'm using "2013.2.918_commercial" version of Kendo UI with jQuery version 1.9.1.
    Is this issue fixed? If not then can you please tell me when you are going to fix this. 

    Regards,
    Vinay

  15. OMER
    OMER avatar
    32 posts
    Member since:
    Dec 2013

    Posted 14 May 2014 Link to this post

    Hi,
    I'm having this issue as well.
    Is there a solution to this?
    My grid is creating tons of new dom elements all the time.
    I tried it with local data and remote data (e.g. - using transport).
    In addition, I tried removing:
    1) Any jquery DOM manipulations done on databound.
    2) Row and cell templates
    It just doesn't seem to be anything in my code. My grid refreshes (myGrid.dataSource.read()) every 500ms, with one or two new rows - one of them might be an update (e.g. an update to an existing row).
    Would appreciate a reply here.

  16. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 16 May 2014 Link to this post

    Hello Omer,

    Which version of the framework you are using? If it is an outdated one please try upgrading to the latest service pack release and in case the problem still persists try to isolate it a small but runnable sample page. In this way we will be able to investigate your exact scenario and assist you further.

    Thank you in advance for the cooperation.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  17. OMER
    OMER avatar
    32 posts
    Member since:
    Dec 2013

    Posted 11 Jun 2014 in reply to Alexander Valchev Link to this post

    Hi,
    Here's an example.
    http://run.plnkr.co/UgOaI7w7liXsGu5o/
    It's much better with the new version, but still - if I have a real-time system that works for about 15 to 30 minutes, the browser crashes after a while even with virtualization.
  18. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 13 Jun 2014 Link to this post

    Hello Omer,

    I am afraid that I was not able to access the plnkr that you sent us. Opening the page takes me to "Not Found" address. Can you please extract this in another plunkr, or you can use the Kendo UI Dojo as well?

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  19. OMER
    OMER avatar
    32 posts
    Member since:
    Dec 2013

    Posted 16 Jun 2014 Link to this post

    Here it is:
    http://run.plnkr.co/GGzLFw6MHPjKRx0D/
  20. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2875 posts

    Posted 18 Jun 2014 Link to this post

    Hello Omer,

    I am not sure what is going wrong but when I open the link on my end I see a "not found" error. For your convenience I am attaching a screen shot.

    Regards,
    Alexander Valchev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  21. Gal
    Gal avatar
    48 posts
    Member since:
    Apr 2009

    Posted 02 Oct 2015 in reply to Alexander Valchev Link to this post

    Any updates for this DOM leak ?
    I'm having the same issue with Window closing it seems to leave all sub elements detached DOM trees.

    I found this link so I added a on destroy functionality that traverses all elements and unbind all events empty the html and removes it . I addition I'm running a garbage collector of my own to remove JQuery cache elements manually.

    Just cleaning the kedo elements has become a massive task and still there is a leak.
    I'm Attaching a sample code of the problem. to view th issue I used chrome dev tools. I took a snapshot before and after the 20 windows were opened and closed and each one appears in the comparison tab as a detached DOM tree.

     

  22. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2565 posts

    Posted 06 Oct 2015 Link to this post

    Hello Gal,

     

     

    This forum thread is regarding the Kendo UI Grid, so please open a support request regarding the Kendo UI Window and we will be happy to help.

     

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  23. Amit
    Amit avatar
    1 posts
    Member since:
    Mar 2015

    Posted 07 Jan Link to this post

    You suggested update to a newer version, in which version the leak was fixed?

     

    I'm using v2015.1.429 and still experience memory leak on create/destroy.

  24. Gal
    Gal avatar
    48 posts
    Member since:
    Apr 2009

    Posted 11 Jan in reply to Amit Link to this post

    Hi Amit 

    There was a leak located in the numeric textbox filter of the grid and it was fixed in v2015.3.1111
    BUT I have not yet updated to it due to massive problems with drop downs and combo boxes using Angular js in this version.

    I'm using a work around replacing the numeric text box in the filter with a masked text box.

    var defaults = {
        field: field,
        title: title,
        format: format,
        filterable: {
            ui: function uiCreateNumericTextBox(element) {
                element.kendoMaskedTextBox(maskTools.defualtNumber()).width("90%");
                // element.kendoNumericTextBox({ format: format });
            },
            cell: {
                showOperators: showOperators,
                suggestionOperator: "eq",
                operator: "eq",
                dataSource: dataSource,
                template: function cellTemplateCreateNumericTextBox(args) {
                    args.element.kendoMaskedTextBox(maskTools.defualtNumber()).width("90%");
                    //args.element.kendoNumericTextBox({ format: format });
                }
            }
        },
        width: "130px"                   
    };
     

     

Back to Top
Kendo UI is VS 2017 Ready