Angular 5.2.0：优化大型列表呈现

Question

我正在使用Angular 5.2.0应用程序，遇到了我似乎无法解决的问题。 问题在于渲染潜在的大型对象数组（每个对象包含其他对象的数组）。 基本上可以这样看：

interface B {name: '', value: '', ... }
interface A {name: '', nested: B[], ...}

不幸的是，按照我目前的工作方式，这会生成大量的DOM节点并大大降低我的应用程序的速度。

---

到目前为止，我已经尝试使用this virtual scroller package解决渲染问题，但无济于事。

我试图基于this question将显示的节点限制在视口中，但是浏览器的计算却变得疯狂了。

我去看了this question，它看起来很有希望，但不能适应我的应用。 在这个问题中，提到了cdk-virtual-scroll-viewport，看起来不错，但特定于Angular7。

---

对于代码，它可以简化为以下内容

<!-- Template -->
<div *ngFor="let o of obj">
<div class="a">
        {{o.name}}
    <div class="b" *ngFor="let b of o.nested">
        <div>{{b.name}}</div>
    <div>{{b.value}}</div>
    </div>
</div>
</div>

，其中每个obj可能有一个较大的nested和一个可能较大的obj（例如，obj.length是500，而obj[0].nested.length是200）。

始终显示此列表并定期刷新值（因此重新绘制是不可避免的）。

---

如果您可以将我引向一个解决方案（最好不涉及到Angular 7的升级），它可以部分显示此列表，同时能够相对快速地滚动，或者避免出现此丑陋的双ngFor循环（我可以恐怕数据处理不多）。

谢谢。