Progress® Telerik® UI for Blazor Feedback Portal
Back to Feed
Request a Feature Report a Bug
Declined
Last Updated: 02 Jan 2022 11:44 by ADMIN
Vladimir
Created on: 18 Oct 2021 14:02
Category: UI for Blazor
Type: Bug Report
2
Memory doesn't utilize with Garbage Collector (GC)

Reloading the page described down below cause memory leak. Commenting lines with telerik button prevents the problem.

@page "/"

<h3 style="position:absolute; top: 0; z-index: 1000; margin-top: 10px">Home</h3>

↓ commenting these lines prevents the memory leak
<div>
    <TelerikButton OnClick="@SayHelloHandler" Primary="true">Say Hello</TelerikButton>
    <div>@helloString</div>
</div>
↑ commenting these lines prevents the memory leak

@code {
    List<string> strings = new List<string>();

    MarkupString helloString;

    protected override void OnInitialized()
    {
        // Attempt to clear memory with Garbage Collector
        GC.Collect();
        GC.WaitForPendingFinalizers();
        for (int i = 0; i < 1000000; i++)
        {
            string a = "asdasdasdasdddddddddasasdasdasdasdddddddddasasdasdasdasdddddddddasasdasdasdasdddddddddasasda";
            strings.Add(a + "b");
        }


        base.OnInitialized();
    }

    void SayHelloHandler()
    {
        string msg = string.Format("Hello from <strong>Telerik Blazor</strong> at {0}.<br /> Now you can use <b><u><i>C#</i></u></b> to write front-end!", DateTime.Now);
        helloString = new MarkupString(msg);
    }
}

 

MainLayout.razor:

@layout TelerikLayout
@inherits LayoutComponentBase


<style>
    .navmenu .k-drawer-items {
        margin-top: 3.5rem;
    }

    .navmenu .k-widget.k-drawer {
        background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 100%);
    }

    .k-drawer-container {
        height: 100vh;
    }

    .btn-margin, .btn-margin:hover {
        width: 48px;
        height: 56px;
        color: #FFF;
    }

    .navmenu .k-drawer {
        color: #ffffffd6;
    }

    .navmenu .k-drawer-item:hover, .navmenu .k-drawer-item.k-state-hover {
        color: #ffffffd6;
        background-color: #f0f0f012;
    }

        .navmenu .k-drawer-item:hover.k-state-selected {
            color: #ffffff;
            background-color: #7bafff94;
        }

    .navmenu .k-drawer-item:not(:hover).k-state-selected {
        color: #ffffff;
        background-color: #7bafffbd;
    }

    .navmenu .k-drawer:hover .k-drawer-wrapper {
        width: 240px;
    }

    .navmenu .k-drawer .k-drawer-wrapper {
        transition-duration: 300ms !important;
    }
</style>


<TelerikDrawer Data="@NavigablePages" MiniMode="true" Mode="@DrawerMode.Push" SelectedItem="SelectedItem" Class="navmenu sidebar"
                SelectedItemChanged="ChangeSelectedItem" TItem="DrawerItem">
    <Content>
        <div class="page">

            <div class="main">
                <div class="top-row px-4 auth">
                </div>


                <div class="content px-4">
                    @Body
                </div>
            </div>
        </div>
    </Content>
</TelerikDrawer>



@code {
    List<DrawerItem> NavigablePages { get; set; } =
        new List<DrawerItem>
        {
            new DrawerItem { Text = "Home", Url = "/", Icon = "home" }
        };

    public class DrawerItem
    {
        public string Text { get; set; }
        public string Url { get; set; }
        public string Icon { get; set; }
        public bool IsSeparator { get; set; }
    }
    DrawerItem SelectedItem { get; set; }

    private void ChangeSelectedItem(DrawerItem chosenItem)
    {
        SelectedItem = chosenItem;
    }
}

This code is example. The main problem was with TelerikGrid. Usage of any telerik component caused the same memory leak.

4 comments
ADMIN
Marin Bratanov
Posted on: 02 Jan 2022 11:44

Hello,

It has been a few months since this was opened, and there seems to be no further issue in this particular regard discussed in this thread. So, I am marking this one as "Declined" to keep the portal tidy as it does not seem to relate to an actual bug in the components. If there is new pertinent information or an actual issue, please provide the relevant information and this could be reopened.

 

Regards,
Marin Bratanov
Progress Telerik

Learn about the important changes coming in UI for Blazor 3.0 in January 2022!
ADMIN
Kristian
Posted on: 03 Nov 2021 12:25

Hello Vladimir, 

Thank you for the sample project and the screenshots. I explore the project and I run the example you provide with the grid. I want to isolate only the Grid on the page, so removed the creation of the strings, since they are not actually used in the component itself.

I'm using VS2019 right now. I perform a similar test to yours. Here are the exact steps of the test

  • refreshing the page each two seconds
  • taking snapshots after every 10 refreshes
  • perform this loop 3 times 
  • take a snapshot after the things could down (40 seconds after stopping refreshing)
  • taking another snapshot after more time (100 more seconds after the previous)

Here is my observation:

  • The memory is increasing while I'm refreshing the page. 
  • At the first part of refreshed, most objects and memory were added
  • Each other part of refreshes (between snapshots) has less and fewer objects heap memory added
  • After the first cooldown (shorter) the memory and objects in the heap are drastically decreased
  • After the second cooldown snapshot, the memory is basically back to normal
  • Looking at the object of the last snapshot, I see only blazor specific things (screenshot 2)

If we filter to see any Telerik related objects in the heap, we see only a small amount of objects which are related to the current instance of the grid on the page (screenshot 3)

The strange thing on my side is that it looks like I got fewer objects and memory in the heap, but the memory profiler doesn't show that. Also for the whole test, I got only one GC cleanup, but the snapshot shows that are more objects cleaned after that.

In the attached screenshot1, you can see the snapshots that I described above. From my tests, I don't have evidence that there is a memory leak in the Grid. 

It's possible you are getting a different result, so can you please provide some additional information:

  1. What version of VS you are using
  2. Can you please perform the test with the grid, but without the creation of the string and share the results?
  3. After you wait for a GC cleanup, can you observe the objects in the heap and what part of them are Telerik related objects (you can use the search in the upper right corner)

 

Regards,
Kristian
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Attached Files:
Vladimir
Posted on: 27 Oct 2021 13:33
I apologize for the ambiguity in the previous post. We found that the button does not affect the performance of the project.
I made a separate default Blazor Server project to demonstrate this problem, using TelerikGrid as an example. I attached this project and screenshots of the running project to the post.
When turning on the project, I waited for the process memory to become constant and then refreshed the page several times.In the screenshots without a snapshot, I started this at the fourth second, then refreshed every two seconds: 4-6-8-...  up to 20. Without TelerikGrid you can see the memory clearing.
On attempts with snapshots, I waited for a straight process memory line, took a snapshot, and then from the tenth second did a refresh every 2 seconds, also up to 20.Took a snapshot, then did a variable number of reloads to be indicative.
With TelerikGrid, the process memory is released a maximum of 1-2 times per attempt for an insignificant amount.
In the attached archive you can run this project, as well as see images of all performance records.
In general, I took 3-4 screenshots without TelerikGrid and with it. Screenshots are also divided into 2 categories: with and without snapshots. We also tried to leave the project with TelerikGrid once, refresh it a few times and leave it for an hour to see if the project clears the memory after a certain time. The attached archive has this image as well. After several updates was at 1.3 gigabytes, after a break of an hour was 1.5.
Attached Files:
ADMIN
Stamo Gochev
Posted on: 25 Oct 2021 11:11

Hi,

Can you clarify which components cause a potential memory leak - is it just the TelerikButton or are there other components that cause a memory leak?

Judging from this sentence:

"The main problem was with TelerikGrid. Usage of any telerik component caused the same memory leak."

it seems to me that every component causes a memory leak, but this sentence:

"Commenting lines with telerik button prevents the problem."

implies that the problem is removed if the TelerikButton is removed.

This being said, can you provide more details on the following:

1. Can you attach a fully runnable project, which demonstrates the issue? The provided snippets contain code for "MainLayout.razor" and I am not sure if this is connected with the problem in any way. Other parts of the project (like configurations) might also be connected with the issue, so please send us a full project.

2. Can you test the result using a performance monitoring tool that can show actual memory issues? You can do that with a tool of your choice, but using a tool that has a free license will make it easy for us to recheck the results.

3. Does removing the dynamic generation and rendering using "MarkupString" change the result?

4. Can you still reproduce the problem if you swap TelerikButton with a standard <button> element? This can be done like this:

<div>
    <TelerikButton OnClick="@SayHelloHandler" Primary="true">Say Hello</TelerikButton>
    <div>@helloString</div>
</div>

should be replaced by:

<div>
    <button @onclick="@SayHelloHandler" >Say Hello</button >
    <div>@helloString</div>
</div>

5. Does moving the logic in "OnInitialized" to another place (e.g. to a different handler outside of the life-cycle handlers) change the result?

6. Does removing the explicit calls to the garbage collector change the result (you can use the separate performance tool as suggested above in order to detect the change)?

Regards,
Stamo Gochev
Progress Telerik

Remote troubleshooting is now easier with Telerik Fiddler Jam. Get the full context to end-users' issues in just three steps! Start your trial here - https://www.telerik.com/fiddler-jam.
Create an account Log In
View
Type
Status
Category