ionic-team / ionic-v3

The repo for Ionic 3.x. For the latest version of Ionic, please see https://github.com/ionic-team/ionic
Other
127 stars 85 forks source link

List are really slow to scroll on iOS / iPad 2 #289

Open ionitron-bot[bot] opened 5 years ago

ionitron-bot[bot] commented 5 years ago

Original issue by @Bluestart83 on 2017-08-23T13:35:12Z

Ionic version: (check one with "x") [ ] 1.x (For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1) [ ] 2.x [x] 3.x

I'm submitting a ... (check one with "x") [x] bug report [ ] feature request [ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior: Scrolling a list is really slow (3 to 5 seconds response time of freeze), especially on iOS / iPad 2. So app is unusable on iPad 2, very slow on iOS I can see the latency in safari with remote debugging.

Expected behavior: Scrolling time normal.

Steps to reproduce: Tested with a ion-list of 70 items (and also reproduced it with an ionic virtual scroll). Tester should just create a list with around 70 items in it, with at least one text and 2 small icons (20px x 20px).

Related code: Git Repo: https://github.com/Bluestart83/IonicSlowListTest in home.html

Other information: To fix the bug I only commented in main.css of ionic this CSS rule:

:focus,
:active {
  outline: none;
}

Commenting this rule fix everything without changing anything to the App UI. On Android this code does not improve anything and change the appearances (for ion-checkbox as example).

You need to remove from the rule from ios project in "Staging/www/build/main.css"

main.css DEV:

:focus,
:active {
  outline: none;
}

main.css PROD:

:active,:focus{outline:0}

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.9.1
    ionic (Ionic CLI) : 3.9.1

global packages:

    Cordova CLI : 7.0.1 

local packages:

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

System:

    Android SDK Tools : 26.0.2
    ios-deploy        : 1.9.1 
    ios-sim           : 5.0.12 
    Node              : v6.9.4
    npm               : 3.10.10 
    OS                : macOS Sierra
    Xcode             : Xcode 8.3.3 Build version 8E3004b 
kapilSoni101 commented 5 years ago

I read the post of @kevinmerckx from below link: https://github.com/ionic-team/ionic/issues/12733 But i am not understand where should I place this file to and where is script folder in ionic project?