How costly are trips to server for single page applications?

Question

I'm building a single page application which will run on your average tablet, so resources aren't too extensive.

I'm thinking about initially retrieving all the data needed for the application and storing it in TaffyDb--local javascript database--and querying locally, rather than contacting the server every time a user elicits an event handler.

I was wondering which one would be better in terms of speed/memory. All data stored on TaffyDb locally, or retrieving the pertinent information each time it is needed. The data is simple JSON objects, 10 at the most.

Answer 1

I saw an estimation that each HTTP request costs around 40,000 machine instructions to execute. On mobiles it is even pricier I think.

But I'd rather focus on another aspect - there are four types of mobile applications:

1. Connected (all the time);
2. Occasionally disconnected;
3. Occasionally connected;
4. Disconnected.

Each case requires its own strategy. For example #3 will definitely require local DB and some synchronization means. For #2 it is enough to have some local caching with simple 15 minutes (or so) expiration time.

It seems that you tend to choose #3. You need to think about client/server synchronization then. This can be quite non-trivial on some data architectures.

Answer 2

It all depends.

Is the data static ? Does it change over time ? If it's static, just define it all on the local side.

However if your data changes and that's the reason why you need to fetch the data remotely then maybe you'd like to use the local database or localStorage as part of a "cache mechanism".

For example if your SPA needs data then look for it in your local cache first. If it's there but it's too old then refresh the data by querying your remote database. However, if your the data in your cache is still fresh then simply reuse it.

So, implementing a cache mechanism will help reduce your calls to your remote database.