1

I have a website that pulls from a database to display images/names/misc info. The pages are used on both iOS Devices (iPhones, iPads, iPods so far) and on PCs using internet explorer and Safari/Chrome on the iOS devices. The websites use jQuery/jQueryMobile...A lot of ListView content. I have noticed a huge difference in performance based on the device and I am trying to get an understanding of why, and if it is due to caching or some other function/feature of iOS or something else I am missing.

I have specifically noticed that when constantly refreshing the pages (I don't yet use Ajax, as I am new with it, but will be trying to implement it in the future) that on PC the images "flicker" when the page refreshes and reloads. However, on the iOS device in any browser the flickering does not occur and it seems like a seamless reload.

Has anyone else experienced this? Or have any insight as to the mechanisms behind this? Does the iOS device have better cache or a more optimized way loading/reloading pages? Is there a way to mimic this on PC based browsers? Or should I just switch to Ajax?

  • Has anyone else experienced this? Yes. ...should I just switch to Ajax? Yes – Robbie Dee Apr 21 '16 at 15:07
  • Any input onto WHY this occurs? – Robert Dickey Apr 22 '16 at 13:25
  • Browser differences. There is some stuff you'll get away with on browser X which browser Y will moan about/do incorrectly/not do at all/do more slowly... – Robbie Dee Apr 22 '16 at 13:29
1

My guess is that iOS Safari/WebView/WebKit image updates are synchronized with the actual iOS device's GPU and/or display frame rate, so image changes are thus less likely to tear.

Whereas PC browsers may have to be GPU agnostic in their drawing, and are thus unlikely to run a video frame rate synchronized game loop renderer.

0

You should not be periodically causing a full page refresh to update content. This is exactly what ajax and websockets exist to do. A full reload is usually fairly janky. Reloading this page causes a flash of the page at the top of the page and then it returns to my current scroll location. Using JS you can easily grab new data in the background and replace the bits that changed with your new data which results in a seamless change.

As for why reloading the page reload looks different on some browsers that requires inside knowledge on how each browser works. But the fact is you are solving this problem wrong and there is a basic method to use which totally solves this on every major browser.

0

I can't say why or if an Android device would flicker, but iOS collects requests from all kinds of sources that items on the screen should be refreshed, re-positioned, re-drawn, and all these changes will be performed simultaneously, replacing one screen with another. And changes can be automatically animated, which automatically creates smooth transitions from one state to another.

All that has nothing to do with performance, it is just doing things clever. Drawing twice as fast doesn't remove flickering, drawing things cleverly does.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.