2

I am in the process of speeding the perceived load time of a website specifically aimed at the mobile platforms (iPhone primarily, Android secondarily, who cares about the rest...) I have already tried several general techniques for speeding load times for normal websites but I was wondering if anyone had specific pointers for the mobile web performance.

I am already bundling scripts, spriting images, lazy loading as much as possible, putting fixed sizes on things, linking css in the head etc. I want insights specifically for mobile.

For example I have heard that the iPhone will only cache files less than 25k so sometimes splitting a script/file into 25k chunks may give an overall boost since now they can be cached even though it caused additional connections to be made. Any other insights like this would be much appreciated.

Also, does anyone know of a good tool to test the load times in iphone?)

Geo
  • 12,666
  • 4
  • 40
  • 55
hackartist
  • 5,172
  • 4
  • 33
  • 48

4 Answers4

2

Ok, here's some measuring tools for you...

Steve Souders' mobile bookmarklet - http://stevesouders.com/mobileperf/mobileperfbkm.php (a bit limited on he timing front but has lots of interesting other features)

Stoyan Stefanov's iOS app for exploring page load - http://calendar.perfplanet.com/2011/i-see-http/ (very new, so not sure about it's limitations)

3P Mobile have their own iOS browser in beta that produces waterfalls - Android version was very good.

As far as optimisation goes...

The mobile cache may be small but you still have access to localstorage i.e. include CSS/js inline and extract and save to local storage - Bing mobile does this.

DataURIs are another way of reducing requests but of course the user loses the option to turn off images

Ensure you make good use of keep-alive and connection pipelining - splitting between multiple hostnames can get in the way of these so be careful if you do this.

Caching varies wildly between different phones an OS versions saw an article on it recently will see if I can find it again.

Andy Davies
  • 5,794
  • 2
  • 26
  • 21
1

Yahoo! has a nice page about how to squeeze the most performance out of your site.

They also have a Firefox plugin (YSlow) that automatically checks whether your site follows them and suggest improvements. That plugin covers also performance problems that may affect mobile browsers.

gioele
  • 9,748
  • 5
  • 55
  • 80
  • Do they have a version I can actually install on the iphone though? Thanks for the Yahoo link... I had actually already checked that page out when I was researching before but it is a good place to start. – hackartist Dec 17 '11 at 00:49
0

I'd like to answer your call for a mobile web site profiling tool - WebDevTools:

https://play.google.com/store/apps/details?id=com.voltcode.webdevtools

disclaimer - I am connected to the company that released this software

While not being targeted for iphones, you could definitely test on various android models and get the load times. From my experience, IPhone 4+ will load pages the same or better than HTC Desire and similar - both in general speed, but also in HTTP concurrency, etc.

voltaire
  • 213
  • 2
  • 8
  • Interesting and thank you for letting me know. I will check it out the next project I have which needs to be sped up on mobile. – hackartist Jun 04 '12 at 07:06
0

Check out this testing solution:

Tutorial: Does Your Website Load in 3 Seconds?

http://blog.testobject.com/2013/09/does-your-website-load-in-3-seconds.html

Shlomi Moto Wagner
  • 1
  • 1