Performance Problems Found in Mobile Web App Development
August 22, 2013
These aren't perfect statistics, but the basic idea of how my experience went when testing mobile web development on 5 mobile devices went something like this:
iPhone 5 (using Safari on iOS 6.1.4)
- Linear gradient on the buttons worked.
- Rendering 1,000 buttons took about .75 seconds.
- Scrolling the div containing the buttons was very good. Nothing was hidden unless I scrolled really fast. Rendering was quick to catch up though.
- Hiding one button after rendering the thousand buttons was instant.
- Showing an image with a background image was instant after the images were cached.
- Linear gradient on the buttons worked.
- Rendering 1,000 buttons took about 1.5 seconds.
- Scrolling the div containing the buttons was pretty good. Nothing was hidden unless I scrolled kind of fast. Rendering was slower to catch up than the iPhone 5.
- Hiding one button after rendering the thousand buttons was instant.
- Showing an image with a background image was instant after the images were cached.
- The background could not load a png image that was 1536x2048 at 71.98 dpi. The filesize was 707 KB. When I made the image smaller (536x715 at 143KB), then it would load.
iPad 1st Generation (using Safari on iOS 5.1.1)
Galaxy Note 2 (using default browser on Android 4.1.2)- Linear gradient on the buttons worked.
- Rendering 1,000 buttons took about 1 second.
- Scrolling the div containing the buttons was pretty good. Most the content was hidden when I scrolled kind of fast, but rendering kept up okay but. Overall it was still worse than the iPod Touch 4 but better than the Galaxy Note 2.
- Hiding one button after rendering the thousand buttons was instant.
- Showing an image with a background image was instant after the images were cached.
- Linear gradient on the buttons worked.
- Rendering 1,000 buttons took about 2.5 seconds.
- Scrolling the div containing the buttons was not very good. Chunks of the view were hidden just by scrolling moderately fast. Rendering was okay in catching up.)
- Hiding one button after rendering the thousand buttons took about 2 seconds.
- Showing an image with a background image was instant after the images were cached.
- Linear gradient on the buttons did not work.
- Rendering 1,000 buttons took about 2 seconds.
- The div containing the buttons would not scroll.
- Hiding one button after rendering the thousand buttons took about 1 second.
- Showing an image with a background image was instant after the images were cached.
