ionic 3 - html table/ion-list 滚动非常慢答案

【问题标题】：ionic 3 - html table/ion-list scroll very slowionic 3 - html table/ion-list 滚动非常慢
【发布时间】：2018-05-04 21:14:44
【问题描述】：

我们在使用 ngFor 创建的页面中有一个 html 表。此表的滚动在 ipad mini 2/4 中非常慢（android 和 iphone 6/7/7 plus 没有问题）也只有 50 行。行的选择也很慢（我们为每一行设置了一个复选框，有或没有点击事件）。

我们正在使用 ionic wkwebview。
我们删除了所有不必要的代码，以排除一些我们缓慢的业务逻辑，我们只尝试一列。
我们正在使用指定的解决方法here
我们还使用 ion-grid（而不是 html 表格）进行了测试，但情况仍然是上述情况，在此视图中，我们有垂直和水平滚动的约束。
我们还使用了带有虚拟/无限滚动的 ion-list，但这种方式也没有任何改进。

页面 HTML

<div style="overflow:scroll; -webkit-overflow-scrolling:touch">
   <table cellpadding="2" cellspacing="2" *ngIf="isDataLoaded">

    <thead>
      <tr>
        <th>{{ 'general.sel' | translate }}</th>
        <th style="text-align:left" *ngFor="let column of visibleColumns">{{column.description}}</th>
      </tr>
    </thead>


    <tbody [style.height]="tableHeight">

      <tr *ngFor="let row of gridData.data;  let rowIndex = index">

        <td tappable (click)="selectRow(row, rowIndex)">
          <input  type="checkbox" [checked]="row.selected">
        </td>

        <td style="text-align:left" *ngFor="let column of visibleColumns">
          <p>{{row[column.code].valueLabel}}</p>
        </td>

      </tr>

    </tbody>

  </table>
</div>

离子信息输出

cli packages:

    @ionic/cli-utils  : 1.18.0
    ionic (Ionic CLI) : 3.18.0

global packages:

    cordova (Cordova CLI) : 7.0.0

local packages:

    @ionic/app-scripts : 3.0.0
    Cordova Platforms  : android 6.2.3 ios 4.4.0
    Ionic Framework    : ionic-angular 3.7.1

System:

    ios-deploy : 1.9.1
    ios-sim    : 5.0.4
    Node       : v6.11.3
    npm        : 3.10.10
    OS         : macOS High Sierra
    Xcode      : Xcode 9.1 Build version 9B55

可能是什么问题？有解决办法吗？

感谢您的关注。

【问题讨论】：

iPad 对于我们的 ionic 应用程序也很慢，但其他应用程序在该设备上对我们来说也很慢。请检查您的ipad中所有其他应用是否运行流畅
感谢您的回复。我们已经使用link 中指示的脚本解决了问题。请参阅下面的答案。
很高兴知道。我也会试着让你知道

标签： html angular ionic-framework ionic3 wkwebview

【解决方案1】：

删除这个（如link 所示）

:focus,
:active {
outline: none;
}

从 main.css 解决问题。我们的脚本有问题，在构建过程中没有删除代码，现在它运行良好！

【讨论】：