Benjamin Tinker Team : Web Development

Load, load load all that data, but not too much

Benjamin Tinker Team : Web Development

Today everyone wants all their data instantally and with fries. As more websites become responsive with infintie scrolling that loads seemlessly the demand for fast data is always important. The question is then "How much do I load first?". It's a relative question with a relative answer. Here are some things to bear in mind when your homepage is hit and users want to see more.

Is it on every page?

If you have content that is going to be on every page then load it once and grab it from cache from then on. I'm a big fan of caching data. It's good to re-use as much as you can without hitting the database with redundant calls that can slow down the rest of the site.

Is it used by alot of smaller parts?

With online shops you'll have products that are in categories that share a whole bunch of characteristics. The best policy I find here is that when you load a product maybe you can load the products category too and store that for the next product. It's a good win situation that puts a bit of extra load on the first product but speeds up the rest. A word of warning is that you don't want to get caught in a recusive loop here.

Is it really necessary to load all that stuff at once?

Your homepage has a Twitter, Facebook and most recent Blogs section on it and you want people to look at the rest. It's good to just load the data needed for those first couple of items. If the user wants to see more, wait for them to hit the next button before you load the rest. There is no reason that you need to preload all 300+ blog articles if they are only ever going to see 10 at a time. Same thing applies to search results. Some websites will load all their search results just to get totals for pagination. It's easier to just load the ones you need and do a seperate call that simply returns the number of results. A little bit of math is all you need for pagination from there.

Is it something that you can preload?

Ah, the glory days of preloading images may be behind us but that does not mean you can't preload some data with tricky AJAX. The beauty of AJAX is you can make some asychronous calls in the background to load future content. A client recently asked if there was a way to increse the speed of the first user experience. The site already uses a lot of cache controls for showing content but there is the catch 22 here. That is for an item to get into cache it has to be loaded the first time. Sure the next user will get a faster experience but it's the first user who has to take the hit. The way around this was having a sneaky piece of asychronous AJAX that called a web service which put all that extra stuff into cache without slowing down the users experience. Because this is embedded into the main template it fires each time a user hits the site. As it's cached we only hit it once and all users can benifit from it.

Keep it simple.

As always, use your own judgement when deciding how much is enough. While it is always good to have more at hand than less you do have to weigh up at what point does having more actually slow you down. Also you have to bear in mind that you may not need all that data all the time. Keep it simple, keep it clean and keep it relative to the user.