angular5 - PrimeNG TurboTable 的性能问题-6ren

angular5 - PrimeNG TurboTable 的性能问题

转载作者：行者123 更新时间：2023-12-04 07:49:23

我正在使用带有嵌套行的 PrimeNG TurboTable。将数据加载到 TurboTable 时会出现严重的性能问题，例如渲染需要大约 30 秒，并且需要 10 多秒才能稳定，数据从服务器加载，并且从服务器很快。有没有其他人遇到过问题。
如果是，你是如何解决这个问题的。

html

<p-table [value]="cars">
    <ng-template pTemplate="header">
        <tr>
            <th>Vin</th>
            <th>Year</th>
            <th>Brand</th>
            <th>Color</th>
        </tr>
    </ng-template>
    <ng-template pTemplate="body" let-columns="columns" let-car>
        <tr>
            <td>{{car.vin}}</td>
            <td>{{car.year}}</td>
            <td>{{car.brand}}</td>
            <td>
          <ul>
            <li *ngFor="let item of sales"
            <a [ngClass]="{'active':car.order==item.order,'inactive':car.order > item.order}">
                                    <i class="fa {{item.icon}}"></i>
                                </a>
            </li>
           </ul>
            </td>
        </tr>
    </ng-template>
</p-table>

  this.cars =[
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "VW", "year": 2012, "color": "Orange", "vin": "dsad231ff","order"=10},
        {"brand": "Audi", "year": 2011, "color": "Black", "vin": "gwregre345","order"=15},
        {"brand": "Renault", "year": 2005, "color": "Gray", "vin": "h354htr","order"=24},
        {"brand": "BMW", "year": 2003, "color": "Blue", "vin": "j6w54qgh","order"=2},
        {"brand": "Mercedes", "year": 1995, "color": "Orange", "vin": "hrtwy34","order"=5},
        {"brand": "Volvo", "year": 2005, "color": "Black", "vin": "jejtyj","order"=8},
        {"brand": "Honda", "year": 2012, "color": "Yellow", "vin": "g43gr","order"=10},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},
        {"brand": "Ford", "year": 2000, "color": "Black", "vin": "h54hw5","order"=17},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=20},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=3},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=23},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=6},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=1},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=4},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=8},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=19},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=12},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=11},
        {"brand": "Fiat", "year": 2013, "color": "Red", "vin": "245t2s","order"=24},
        {"brand": "Jaguar", "year": 2013, "color": "Orange", "vin": "greg34","order"=15},

];

单独列表

   this.sales = [
            { brand: 'Apple', lastYearSale: '51%',thisYearProfit: '$43,342',"order"=1,"icon"="fa-flag-o" },
            { brand: 'Samsung', lastYearSale: '83%',thisYearProfit: '$312,122',"order"=2,"icon":"fa-address-card" },
            { brand: 'Microsoft', lastYearSale: '38%', thisYearProfit: '$8,500',"order"=3,"icon":"fa-eye" },
            { brand: 'Philips', lastYearSale: '49%',thisYearProfit: '$650,323',"order"=4,"icon":"fa-address-card" },
            { brand: 'Song', lastYearSale: '17%',thisYearProfit: '500,332' ,"order"=5,"icon":"fa-fax"},
            { brand: 'LG', lastYearSale: '52%',thisYearProfit: '$150,005',"order"=6,"icon":"fa-circle" },
            { brand: 'Sharp', lastYearSale: '82%',thisYearProfit: '$100,214' ,"order"=7,"icon":"fa-folder"},
            { brand: 'Panasonic', lastYearSale: '44%',thisYearProfit: '$53,322',"order"=8,"icon":"fa-address-book-o" },
            { brand: 'HTC', lastYearSale: '90%',thisYearProfit: '$296,232',"order"=9,"icon"="fa-bluetooth-b"  },
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=10,"icon"="fa-address-book-o"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=11,"icon"="fa-bath"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=12,"icon"="fa-address-card"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=13,"icon"="fa-bluetooth-b"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=14,"icon"="fa-eye"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=15,"icon"="fa-circle"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=16,"icon"="fa-fax"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=17,"icon"="fa-address-book-o"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=18,"icon"="fa-address-card"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=19,"icon"="fa-bluetooth-b"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=20,"icon"="fa-eye"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=21,"icon"="fa-fax"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=22,"icon"="fa-circle"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=23,"icon"="fa-folder"},
            { brand: 'Toshiba', lastYearSale: '75%',thisYearProfit: '$12,533',"order"=24,"icon"="fa-flag-o"}
        ];

最佳答案

问题不是 TurboTable，而是您的最后一列，您在其中为 3401 行中的每一行显示 24 个图标。

即使在 table 外，显示 81624 个图标也需要几秒钟的时间。为了说服你，试试这个:

<div *ngFor="let car of cars">
  <li *ngFor="let item of sales">
    <i class="fa {{item.icon}}"></i>
  </li>
</div>

您将遇到相同的性能问题。

要解决您的问题，为什么不使用分页？这将非常快:

<p-table [value]="cars" sortField="brand" [paginator]="true" [rows]="10">
    ...
</p-table>

见工作 Plunker

关于angular5 - PrimeNG TurboTable 的性能问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48338653/

文章推荐： win-universal-app - 桌面应用转换器 "Fatal Error 1000"

文章推荐： arrays - 有效地堆叠和连接 NumPy 数组

文章推荐： angularjs - 使用 cypress 选择下拉列表项

primeng - 如何使用下拉列表过滤 primeNG 表并仅在按下应用按钮时应用过滤器？
我正在尝试使用下拉菜单过滤 primeNG 表中的列，但我只想在按下“应用”按钮时应用过滤器。现在过滤发生在 onChange 事件中。如果我删除 onChange 事件，过滤器将不起作用这是没有
primeng - 我怎样才能在 primeNg 输入中有一个清晰的图标？
需要在 primeNg 的文本框内放置一个清晰的图标。单击它应该会清除该字段。最佳答案对于 Primefaces 关于prim
primeng - 如何使用 react 形式包装像自动完成这样的 primeng 组件？
我想在我自己的组件中包装一个 primeng 自动完成组件，但不知道如何提供 formControlName: 错误:未捕获( promise ):错误:formControlName 必须与父 fo
css - 当应用滚动时，primeng 中的子菜单被切断 primeng angular
当我将滚动条应用到主菜单时，我遇到了子菜单被切断的问题，但我无法让子菜单显示在滚动条上方。下面是一个简单的代码:https://stackblitz.com/edit/angular-cyvv7d
primeng - 如何摆脱 PrimeNG 数据表中的 'No records found message'？
我使用 PrimeNG 创建了一个数据表。我刚刚为数据表创建了 2 个标题。我实际上会从服务器获取数据，因此如果没有数据，我不希望显示默认的“未找到记录消息”。如果表格中没有数据，我希望表格为空。
angular - PrimeNg 不是已知元素错误 (@angular-2.0.0 & primeng-1.0.0-beta.16)
我从 Angular 2 RC5 和 PrimeNG 1.0.0-beta.13 beta 开始。我将 PrimeNg 组件作为 xModules 加载，并且在显示数据表、输入、SelectItem、
primeng - 动态对话框上的页脚按钮
我正在使用一个动态对话框，我想在页脚上有一些按钮，但是在这个组件中似乎只允许文本作为页脚。 const ref = this.dialogService.open(Te
primeng - 如何使用primeng添加条件工具提示？
我正在尝试在按钮上添加条件工具提示。使用primeng工具提示组件: 它不工作。但是，没有“tooltipDisabled”的工具提示工作正常。有人可以帮帮我吗？最佳答案使用
Primeng - 如何使用styleClass？
我想用styleClass Togglebutton 的属性(property)成分。如 another post 中所述，我认为使用以下方法很简单: styleClass="test" 在我的 cs
primeng - 在primeNG表上重置过滤器值
根据https://www.primefaces.org/primeng/#/table的文档，重置方法应为“重置排序，过滤器和分页器状态”。问题在于，重置表方法未从UI中删除过滤器。 (尽管重置后
angular7 - PrimeNG 表列排序不起作用
我已经使用 PrimeNG Table 创建了一个 Angular 应用程序。我在这里查看了 PrimeNG 文档 ( https://www.primefaces.org/primeng/#/tab
angular - PrimeNg - 使动态创建的对话框可拖动
我正在使用 PrimeNg 库。它有很好的组件，默认创建可拖动的对话框。但在某些情况下，我正在使用 PrimeNg 的 API dialogService , 动态创建对话框。注意 this.dial
typescript - Primeng - 对话服务将数据传递给对话组件
使用 PrimeNg 的动态对话示例展示了目标对话如何获取数据并显示。我可以通过创建一个带有 observable 的服务来将数据传递给对话，但我知道对话服务有一些可用的参数(如数据)可以传递。对
angular - PrimeNG 表得到过滤行
我在 Angular 5 中使用 PrimeNG 6.0.2，但我遇到了的问题表插入。我切换到 Table 因为 DataTable 已被弃用。现在，我无法像以前那样访问过滤值。假设我通过 Vie
angular - primeng 表根据用户选择保留列宽
我对 primeNG 表有疑问。表格有很多列，在列切换上，列宽在变化，表格看起来很乱。表格可滚动和可调整大小，因此根据文档，由于技术原因不支持自动布局。所以也许有一些解决方法，或者是否有一种方法可
angular - primeNG 表上的可编辑行问题
在我的 Angular 项目中，我使用 primeNG 库我正在尝试使数据表中的行可编辑，所以我按照文档进行操作[ https://www.primefaces.org/primeng/#/table
angular - Primeng:将重点放在控制上
抱歉菜鸟问题... 使用primeng包时，推荐的将焦点设置在控件上的方法是什么？使用传统输入控件时，我设置了一个表单变量 (#variable) 并使用 @ViewChild 获取对它的引用，以便我
angular - PrimeNG 使用异步管道延迟加载数据
我需要在 PrimeNG 数据表中显示大量数据(400.000 条记录)。为此，我需要一个延迟加载表，因为您无法一次将所有数据加载到表中(这会使浏览器崩溃)。为了创建表，我使用了以下技术: Angu
Angular PrimeNG 日期时间选择器
我使用 PrimeNG 5.0.1、Angular 5.1 中的组件日历，它允许选择日期和时间: 但是 timepicker 在重新加载页面时被卡住。每次显示选择器时是否可以更新时间值？我还没有发
angular - PrimeNG 多选自动对焦
在 Angular v7 项目中使用 PrimgNG v7.1.3。在一个简单的组件中实现了多选 ( https://www.primefaces.org/primeng-7.1.3/#/multi

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

angular5 - PrimeNG TurboTable 的性能问题