C#•4d ago

Optimizing Large i18n Loading in Blazor

Hello everyone, I am currently experiencing some performance issues during application startup. We are using Blazor Wasm and we are loading a large json file with a lot of language keys (about 4.5MB) during startup. The result is obviously a freezing UI while the language keys are loaded (about 2-10 sec depending on the device performance). We have already tried to use local storage as a cache layer, but serialisation still needs to be done. How do you deal with such a case? I think I am not the only one with a lot of language keys.

12 Replies

Core•4d ago

I have 0 experience with Blazor, but can't you just load settings for a single language e.g. English. After startup load the rest too Only downside is, lanugage selection must be disabled until everything loads

OliverOP•4d ago

This is only english 😅

Core•4d ago

Ahhhh ://, in that case no idea

OliverOP•4d ago

Do you have some experience with indexedDb? Do you now if its faster to query that instead of deserializing everything in the beginning.

Core•4d ago

never head of that, so the settings are retrieved from a database?

OliverOP•4d ago

An Api endpoint.

Core•4d ago

I have no idea why could it take so long, even images load faster. Suppose your internet connection is fast, the request time should not even be noticeable

OliverOP•4d ago

I put some console logs around and its more or less the serialization and loading from localstorage. The fetching is not the problem. My guess is the translation layer between wasm and js is the problem. Thats why i asked if there is magic way of duing it.

Imtiaz•4d ago

I have previously worked on a similar where we loaded a JSON file on startup. Unfortunately, we could not find an efficient way to speed up this process. As a result, we established a rule that the JSON file should not exceed 2MB. I assume you are engaged in an insurance project.

lycian•4d ago

Have you tested the serialization/deserialization outside of WASM to make sure there's no perf issues there? What library are you using? If you did it in pure JS would it be faster?

OliverOP•4d ago

I added now to all steps a timestamp. On my macbook pro which is a fast machine it took around 4 seconds for loading and deserializing everything. I dont use any library for accessing the local storage (see below). For Deserialization i use System.Text.Json This is for loading out of local storage

public static ValueTask<string> GetFromLocalStorage(this IJSRuntime js, string key)
{
    return js.InvokeAsync<string>("localStorage.getItem", key);

public static ValueTask<string> GetFromLocalStorage(this IJSRuntime js, string key)
{
    return js.InvokeAsync<string>("localStorage.getItem", key);

var stopwatch = new Stopwatch();
stopwatch.Start();

Console.WriteLine($"LoadCachedLanguage Start {stopwatch.Elapsed.TotalSeconds}");
string rawCached = await js.GetFromLocalStorage("CachedLang");
Console.WriteLine($"LoadCachedLanguage End {stopwatch.Elapsed.TotalSeconds}");

if (string.IsNullOrEmpty(rawCached))
    return;

Console.WriteLine($"Deserialization Start {stopwatch.Elapsed.TotalSeconds}");
var cachedLanguage = JsonSerializer
   .Deserialize<Dictionary<string, LanguageEntry>>(rawCached);
Console.WriteLine($"Deserialization End {stopwatch.Elapsed.TotalSeconds}");

var stopwatch = new Stopwatch();
stopwatch.Start();

Console.WriteLine($"LoadCachedLanguage Start {stopwatch.Elapsed.TotalSeconds}");
string rawCached = await js.GetFromLocalStorage("CachedLang");
Console.WriteLine($"LoadCachedLanguage End {stopwatch.Elapsed.TotalSeconds}");

if (string.IsNullOrEmpty(rawCached))
    return;

Console.WriteLine($"Deserialization Start {stopwatch.Elapsed.TotalSeconds}");
var cachedLanguage = JsonSerializer
   .Deserialize<Dictionary<string, LanguageEntry>>(rawCached);
Console.WriteLine($"Deserialization End {stopwatch.Elapsed.TotalSeconds}");

That are the results: LoadCachedLanguage Start 0 LoadCachedLanguage End 2,8571 Deserialization Start 2,8576999 Deserialization End 4,2311999

lycian•4d ago

If you add a benchmark/manual test that isn't in WASM does the deserialization happen much faster?

Gaming

Programming

Optimizing Large i18n Loading in Blazor