Performance issue when dynamically adding items to a RadContextMenu in the client

[Ragnar]

Hello!

I am experiencing a performance issue when dynamically adding items to a RadContextMenu in the client.  I am using the following call:

Menu.get_items().add(menuItem);

Each call is taking between 30 to 70 ms according to my measurements on my machine in IE9/W7!  Is there some workaround to increase the performance? 

(I am loading up to 50 items)

Best regards,
Ragnar

[Kate]

Hi Ragnar,

Can you please provide a code snippet of the function how exactly you add items to the RadMenu control?

Greetings,
Kate
the Telerik team

[Ragnar]

Here is the code snippet:

function webServiceContextMenuLoadingSuccess(sender, args) {
    var result = args.get_data();
    var menuID = args.get_context()._element.id;
    var menu = $find(menuID);

    if (menu.get_persistLoadOnDemandItems()) {
        menu.trackChanges();
    }

    var childItems = menu.get_items();


    var itemCount = 0;
    var separatorCount = 0;

    for (i = 0; i < result.length; i++) {
        var itemData = result[i];
        var dynamicItem = new Telerik.Web.UI.RadMenuItem();
        dynamicItem._loadFromDictionary(itemData);

        if (dynamicItem.get_navigateUrl() === "") {
            dynamicItem.set_navigateUrl("#");
        }

        if (dynamicItem.get_isSeparator())
            separatorCount += 1;
        else
            itemCount += 1;

        //This operation is a bottleneck.  Measurements show 30 - 70 ms per item (1,5 - 3,5 sec pr 50 items)!
        childItems.add(dynamicItem);

    }

}

The last line is the performance bottleneck!

Greetings.
Ragnar

[Kate]

Hello Ragnar,

I noticed that in the provided code you call only trackChanges() function without the commitChanges() function. However, if you need to preserve the changes that you have made you will need to call both methods as explained in this help article. Otherwise, you do not need to call any of the above mentioned functions which will consequently increase the performance.

All the best,
Kate
the Telerik team

[Ragnar]

Hello Kate.

I shortened the function because I did not think it was relevant to this problem.  commitChanges() is called if trackChanges() is called as you can see in the following code:

function webServiceContextMenuLoadingSuccess(sender, args) {
    var result = args.get_data();
    var menuID = args.get_context()._element.id;
    var menu = $find(menuID);

    if (menu.get_persistLoadOnDemandItems()) {
        menu.trackChanges();
    }

    var childItems = menu.get_items();


    var itemCount = 0;
    var separatorCount = 0;

    for (i = 0; i < result.length; i++) {
        var itemData = result[i];
        var dynamicItem = new Telerik.Web.UI.RadMenuItem();
        dynamicItem._loadFromDictionary(itemData);

        if (dynamicItem.get_navigateUrl() === "") {
            dynamicItem.set_navigateUrl("#");
        }

        if (dynamicItem.get_isSeparator())
            separatorCount += 1;
        else
            itemCount += 1;

        //This operation is a bottleneck.  Measurements show 30 - 70 ms per item (1,5 - 3,5 sec pr 50 items)!
        childItems.add(dynamicItem);

    }

    if (menu.get_persistLoadOnDemandItems()) {
        menu.commitChanges();
    }

   [... some code]
}

I am sorry if that was misleading.  The problem still exists.

Regards,
Ragnar

[Ragnar]

I have commented the trackChanges()/commitChanges() lines out and it does not solve the problem (quick check results in ~6% faster code)!

I have also discovered that IE 9 takes about 2 times longer processing the menu than FF 4 and Chrome 13!  When it is emulating IE 7 (<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />)  then it takes about 3.4 times longer!

[Kate]

Hello Ragnar,

Thank you for the interest. In general, the RadMenu control is not designed to load a lot of items as it is the case in your scenario. Therefore you encounter such performance issue when loading it by using client-side. I could offer you to use  Web Service but its limitation is that it loads only the child items. We will consider your request as a future improvement of the RadMenu control. My apologies that currently we can not offer a suitable workaround.

Best wishes,
Kate
the Telerik team