Question

目前，Chrome在大约6秒内加载了大小为40x15的表格。它比goog.editor慢很多。表。我需要将加载时间减少至少两次。

<script type="text/ng-template" id="grid_item_renderer.html">
<span ng-switch on="cell.type">
    <textarea ng-switch-when="simple" class="cell-text-area simple-cell" ng-model="cell.data">{{cell.data}}</textarea>
    <span ng-switch-when="grid">
        <table class="declarative-grid-table" border="1" bordercolor="#CCC" cellspacing="0" tabindex="0">
            <tr ng-repeat="row in cell.data.grid" >
                <td ng-repeat="cell in row" class="declarative-grid-cell">
                    <span ng-include="'grid_item_renderer.html'"></span>
                </td>
            </tr>
        </table>
    </span>
    <span ng-switch-default>unexpected cell type</span>
</span>
</script>
<table class="declarative-grid-table" border="1" bordercolor="#CCC" cellspacing="0"  tabindex="0">
<tr ng-repeat="row in declarativeGrid" class="declarative-grid-row">
    <td ng-repeat="cell in row" class="declarative-grid-cell">
        <span ng-include="'grid_item_renderer.html'"></span>
    </td>
</tr>
</table>

Answer 1

使用Angular，您可以通过创建自定义指令来优化您可能需要的任何内容。如果您遇到嵌套ng-repeats的性能问题，可能是时候推出自己的指令，以编程方式构建表的DOM元素。它会更快，开销也更少，因为自定义指令创建的$ watch和scope会更少。

如何优化使用ng-repeat和ng-include构建的嵌套表加载？

1 个答案: