I am trying update img from src=@string, browser save image cache, and then draw first image constantly, but I want to update the image dynamically, from byte array. I turn off save cache function, and then nothing is drawn anymore, but I can update the @string and write it to console, where I see that string was updated. Also should say that I can update image when use onclick event, but its not what I want.

MyCode

@page "/"
@inject IJSRuntime JsRuntime;


<div>
    <img src="@Image64" @ref="imageRef" hidden/>
</div>

<div id="canvasHolder" style="position: fixed; width: 100%; height: 100%">
    <BECanvas Width="1000" Height="1000" @ref="CanvasRef"></BECanvas>
</div>



@code{
    protected BECanvasComponent CanvasRef;
    ElementReference imageRef;
    Canvas2DContext ctx;
    public string Image64 = "100";
    Random rand = new Random();
    PngFormat pngFormat = PngFormat.Instance;
    byte[] arr = new byte[2000000];
    Image<Rgba32> map;
    int countX = 0;
    int countY = 0;


    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        this.ctx = await CanvasRef.CreateCanvas2DAsync();
        await JsRuntime.InvokeAsync<object>("initRenderJS", DotNetObjectReference.Create(this));
        await base.OnInitializedAsync();
    }

    protected override async Task OnInitializedAsync()
    {
        System.Console.WriteLine("Mario");
        Image64 = "data:image/png;base64,.."; //+ "?nocache=<?php echo time(); ?>";      
    }


    [JSInvokable]
    public async ValueTask RenderInBlazor(float timeStamp)
    {
        countX += 15;
        countY += 10;
        await this.ctx.ClearRectAsync(0, 0, 1000, 1000);
        rand.NextBytes(arr);
        System.Console.WriteLine("1");
        Image64 = Convert.ToBase64String(arr); //+ "?nocache=<?php echo time(); ?>";
        await this.ctx.DrawImageAsync(imageRef, countX, countY, 400, 400);
    }
}