Scrolling is really lag

ionic-v1
1

Hello, I’m using ionicframework for my project. I’m really enjoy it except it’s scrolling.
I have an infinite scroll in my newfeed page, it’s similar to facebook newfeed. I run it on android 4.1, scrolling is really lag, it’s not smooth as expected. When I use showmore function to show about 20 posts or more, it begins really slow and so lag. It’s too difficult for me to show more posts with my newfeed page ( about more than 100 posts ). I had used bindonce but it’s seem nothing changes. I think you guys should have a scroll testing with a large data (maybe more than facebook data).
I found a site using html5 scrolling and it runs pretty smooth on ios and android, here : http://cubiq.org/iscroll-5. I hope you guys could build a smooth scroll like this. Now I can’t release my app because this scroll.
Thanks a lot !

6 Likes
2

I home this issue get fixed really quickly ,because i’m looking to create an app using ionic .

3

Hi!
I started my first Android project and there is a real lag problem with lists…
Are there any plans to fix this?

4

If you don’t need all of the nice ionic scroll features, you can make it much faster using the raw webview scroll:

<ion-content overflow-scroll="true" class="has-header">

Cheers

7 Likes
5

Raw webview scrolling isn’t an option for most because it lacks the support for PTR or infinite scrolling. Scrolling a list of cards on an Galaxy S3 realy is slow. Haven’t tried entry level android phones yet. Bindonce didn’t make a difference for me. Faster scrolling would be realy realy appreciated…

6

We’re working on this.

1 Like
7

I’m sure you do :slight_smile: Keep up the good work. Everyone of us knew, what he was doing basing his app on a alpha / beta.

8

That sounds great, we just created an app with a list of cards in the main page, the scrolling is fantastic on iOS but really bad on Android, looking forward to your work on this!!

Thanks!

2 Likes
9

Exactly what happens in my app. Do you use infinite scrolling? In my case the performance drops rapidly. Will try do add some manual loading and see if it speeds things up a bit.

10

Anyone following this may also want to read through the discussion in this thread:

11

Just tested the nightlies. Release build for Android is now much faster! :smile:

12

I implemented scrolling using this: https://github.com/webux/ux-angularjs-datagrid

it’s very fast even with 300 items including image, link, toggle button etc.

Hopefully some of those functions could be natively integrated to ionic at some point. Setting it up was a bit of a hassle.

2 Likes
13

PhoneGap’s blog has a write-up of EXFM’s application which highlights various Cordova/HTML5 scrolling-smoothness-related techniques they implement. Maybe something there could be integrated into Ionic.

http://phonegap.com/blog/2013/04/23/story-behind-exfm

According to one comment EXFM’s ‘scrolling in Android is amazing’.

I hope this helps.

(I can’t believe this! I only found out myself about EXFM 18th May 2014 and it looks as though EXFM has shut it’s doors the very next day, 19th May 2014! The EFXM Android app was here in the Play store).

14

I try to scroll my list on HTC One, still very lag ~~ (ionic beta 7)

do I miss something ?

15

Are you guys making use of ng-repeat or collection-repeat?

I had an issue on slower / older devices where lists would cause a lot of lag, when I was using a ng-repeat, when I switched to collection-repeat this made it a lot better, still lot great on old devices (single core Android devices running Android 2.3) but it was totally acceptable on an iPhone 4.

If you’re not familiar with collection-repeat, take a look here:

http://ionicframework.com/docs/api/directive/collectionRepeat/

Good luck :smile:

1 Like
16

Can you please help me by explaining how you implemented the scrolling on devices? I have tried this but unable to scroll the list. it appears but scroll wont move

17

Damn, I just lost two nights over this.
I can’t get Ionic and ux-angularjs-datagrid to play ball together. Everything displays as it should, but items of the grid are not active (buttons can’t be clicked) and scroll does not work (and I’ve tried tons of scrolling solutions).
Funny thing is, everything works in browser - it just gets cold on Android. Haven’t tested iPhone yet…

Any ideas? Would really appreciate if you could give detailed info, how you implemented ux-datagrid in Ionic.

1 Like
18

I Solve this issue by adding hack into main ionic js file.
File path : lib->ionic->js->ionic.bundle.js

// The ms interval for triggering scroll events
scrollEventInterval: 0, // Original value 10,

also I creating own table cell and adding custom .css

1 Like
19

Dont know can it help or related or not. Maybe you can try this? http://ionicframework.com/docs/cli/browsers.html

20

Hi am new to ionic, could you name some of those “nice ionic scroll features”?
I read about Thumbnails, Delete buttons, Reordering, Swiping … nice features but not worth the performance hit imho.
I’d rather implement something custom but have it perform better