3 ms·

true, infinite scrolling and footer do not work together, unless footer is position:fixed, which is often the case on mobile. Infinite scrolling is pretty much

true, infinite scrolling and footer do not work together, unless footer is position:fixed, which is often the case on mobile. Infinite scrolling is pretty much the norm on mobile and is increasingly popular on desktop, pinterest and twitter are examples. I have found only a couple of libraries that attempt some of the techniques used by LinkedIn team. One is [infinity.js](http://airbnb.github.io/infinity/ http://airbnb.github.io/infinity/) by airbnb but it is specific to pinterest-style masonry layouts, and another is [swipeview.js](http://cubiq.org/swipeview http://cubiq.org/swipeview) by Matteo Spinelli, the great guy who created iscroll.js. We are using swipeview in [Urbini](http://github.com/urbien/urbini http://github.com/urbien/urbini) but it is not good enough, scrolling is terribly slow. It is possible that it is some problem in interaction between jquery mobile and swipeview, so we are investigating it, but anyway swipeview is not even close to what LinkedIn guys have created. I know Sencha guys have a similar technique, [Infinite List Component](www.sencha.com/blog/the-making-of-fastbook-an-html5-love-story) but we do not want to use Sencha as it has terrible cross-browser support compared to JQM.

trunalb 13y ago
SwipeView is pretty good but not good enough for large scale front end application. Also, SwipeView (at the time when I looked at it) required all of the data upfront v/s letting the app pull it via a webservice. If you're looking for more info on how LinkedIn achieved the buttery performance, you might want to look into http://www.youtube.com/watch?v=ft9R72R7TlI http://www.youtube.com/watch?v=ft9R72R7TlI
- datadiver 13y ago
  thx @trunalb, good find, will check out the video later (man, it is an hour long). I pretty much understand all LinkedIn techniques. Just lack the time to implement them and support this code for various environments. Ideally this is what JQM team should have provided as a replacement for their barebones and very tricky to use listview widget. Good scrolling/swiping performance is impossible on mobile without managing a sliding window in DOM, like good old editors used to do with files that did not fit into memory.
  - trunalb 13y ago
    cool @datadiver. LMK if you need any help. FWIW, I implemented the infinite scrolling when I was at LinkedIn ;)
    - datadiver 13y ago
      omg, you did? I see that you used the sliding window with 3 parts. The closest pages are left as is. Then next set use the technique #1 unloading images. Then the next set of pages use technique #2 hiding pages, while the rest of the pages use technique #3 removing pages. Why not just use #3? Is there a speed advantage to still having around the pages with the fake image and the pages with visibility hidden?
      - trunalb 13y ago
        Yup there is. It also takes care of the use cases if the user swipes forwards and then back again quickly.
- datadiver 13y ago
  @trunab I watched this great video and made a transcript of it: http://urbien.com/v/Blog/32272?-ref=Urbien%2F32034 http://urbien.com/v/Blog/32272?-ref=Urbien%2F32034 Keep in mind this is my personal take, not the exact words of the presenters. I was mostly interested in understanding how we can improve http://github.com/urbien/urbini http://github.com/urbien/urbini Our target audience is geeks who can't code. So it is upon us to make their HTML5 mobile apps perform. @trunalb, am I right that this was you on stage in the video's first part, and then answering questions? Is it possible to share the code that avoids highlighting list items during scrolling? We have this exact problem.

trunalb 13y ago

SwipeView is pretty good but not good enough for large scale front end application. Also, SwipeView (at the time when I looked at it) required all of the data upfront v/s letting the app pull it via a webservice. If you're looking for more info on how LinkedIn achieved the buttery performance, you might want to look into http://www.youtube.com/watch?v=ft9R72R7TlI http://www.youtube.com/watch?v=ft9R72R7TlI

datadiver 13y ago
thx @trunalb, good find, will check out the video later (man, it is an hour long). I pretty much understand all LinkedIn techniques. Just lack the time to implement them and support this code for various environments. Ideally this is what JQM team should have provided as a replacement for their barebones and very tricky to use listview widget. Good scrolling/swiping performance is impossible on mobile without managing a sliding window in DOM, like good old editors used to do with files that did not fit into memory.
- trunalb 13y ago
  cool @datadiver. LMK if you need any help. FWIW, I implemented the infinite scrolling when I was at LinkedIn ;)
  - datadiver 13y ago
    omg, you did? I see that you used the sliding window with 3 parts. The closest pages are left as is. Then next set use the technique #1 unloading images. Then the next set of pages use technique #2 hiding pages, while the rest of the pages use technique #3 removing pages. Why not just use #3? Is there a speed advantage to still having around the pages with the fake image and the pages with visibility hidden?
    - trunalb 13y ago
      Yup there is. It also takes care of the use cases if the user swipes forwards and then back again quickly.
datadiver 13y ago
@trunab I watched this great video and made a transcript of it: http://urbien.com/v/Blog/32272?-ref=Urbien%2F32034 http://urbien.com/v/Blog/32272?-ref=Urbien%2F32034 Keep in mind this is my personal take, not the exact words of the presenters. I was mostly interested in understanding how we can improve http://github.com/urbien/urbini http://github.com/urbien/urbini Our target audience is geeks who can't code. So it is upon us to make their HTML5 mobile apps perform. @trunalb, am I right that this was you on stage in the video's first part, and then answering questions? Is it possible to share the code that avoids highlighting list items during scrolling? We have this exact problem.