Асинхронный UI в AspNetCore

View:

<div>
    @for (int i = 0; i < 2; i++)
    {
        <h2>Instant content</h2>
        <p>Delayed content (DbRequest(@i))</p>
    }
</div>

Controller:

public string DbRequest(int i)
{
    //heavy query
    return "result";
}

Смысл в том, чтобы загрузилась страница, а контент с запросами догрузился по ходу.

Upd#1:
View:

@for (int i = 0; i < 10; i++)
{
    <h2>Instant content</h2>
    <p id="@i"></p>
}
<script>
    function RequestString() {
        var index = 0;
        var request = new XMLHttpRequest();
        request.open("GET", "/Home/GetString/?index=" + index);
        request.send(index);
        request.onreadystatechange = function () {
            if (request.status == 200) {
                obj = document.getElementById(index);
                if (obj != null) {
                    obj.innerHTML = request.responseText;
                } else {
                    alert("obj is null");
                }
            }
        }
        var index2 = 9;
        var request2 = new XMLHttpRequest();
        request2.open("GET", "/Home/GetString/?index=" + index2);
        request2.send();
        request2.onreadystatechange = function () {
            if (request2.status == 200) {
                obj = document.getElementById(index2);
                if (obj != null) {
                    obj.innerHTML = request2.responseText;
                } else {
                    alert("obj is null");
                }
            }
        }
    }
    document.onreadystatechange = RequestString();
</script>

Controll:

public async Task<string> GetString(int? index)
{
    if (index == null) return "null index string";
    await Task.Delay(index.Value * 1000);
    return index + " string";
}  

Осталось решить вопрос с асинхронным циклом в скрипте. for-loop из 10 итераций делает 10 запросов с последним индексом.