基于组件的angular2.x单页面应用程序设计

Question

我正在创建一个SPA，它以表格形式向用户（主要）显示大量数据。该应用程序本质上有一个表结构 - 带有多列的标题，然后是数据行 - 在某些情况下是嵌套的。这意味着可以扩展“父”行以显示具有相关信息的“子”行，但是出于所有意图和目的，“子”行只是具有不同背景颜色的“父”行。

请参阅下图

计划是

1 - 创建一个组件“comp 1”，它在标题行中重复使用以呈现每一列（因为每个标题列只是一个带有文本和排序asc / desc特征的标签）。即使在其他表中 - 标题也非常不变并具有完全相同的功能。虽然这提供了可重用性 - 它确实有一个缺点 - 如果我的表在标题行中有10列 - 我最终将组件渲染10次（潜在的性能下降）。

2 - 创建一个组件“comp 2”这实际上是一个包含N列（可配置）的整个表行 - 具有独特的样式 - 并且每列具有不同的特征。

3 - 重写“comp 2”并使用重写样式（基于条件）渲染嵌套行，该行基本上与“base”comp 2相同但具有不同的视觉样式。

1. 重新使用这些组件为所有其他表格视图动态创建表（X行和Y列）。

我看到的潜在缺点是我需要加载以提供表格的大量组件，以及我将不得不处理的潜在性能瓶颈。

对于我将拥有的每个表 - Comp 1 *列数（平均cols = 15） 和 Comp 2 *行数（平均行数= 1500）

如果这是一种可接受的方法，并且他们使用任何其他方法来呈现这种视觉风格，请任何人都可以提出建议。

提前致谢