3

I'm working on a product page where you have a set of options which will affect the price. The main option, which is always there, lets you choose a material. Depending on the material, then, the set of option can change.

On the database I have a table listing the final products with their prices, which is a table of about 2000 rows listing every single product available with the different options.

Something like:

product_id / code / price / size / option / color

     1       ABC     20$     1       3        5
     2       DEF     30$     2       4        5
     3       FFF     30$     3       4        5

and so on.

The whole thing works with ajax calls, so everytime an option changes, I query the database, look for the product with that set of options and show the price.

Would it make sense in this specific case to get the whole list of products at the beginning (would be a single query, and about 2000 rows), store it in a Javascript object and filter it?

If it's of any importance, I'm using MySql

4
  • 2000 objects in the browser? I wouldn't put that stress on the client's browser. You have to consider slow computers which might cause unresponsive script line (like in FireFox). There is no ideal solution, but you have to find something in the middle. Put aside indexing the results and rearranging them. Commented Dec 12, 2016 at 17:33
  • 1
    @AdamAzad I disagree - 2000 objects is nothing to a modern JS engine. I.e. meanwhile, WebGL gaming is dealing with hundreds of thousands of physics calcs. Commented Dec 12, 2016 at 17:35
  • 1
    There's no universal answer to this question. Filtering client-side should be faster though. 2000 objects doesn't seem a lot. You just have to try it and even then, a machine with very little memory and a bad processor running the script in an old browser with a slow JS engine could not result in the same outcome. Commented Dec 12, 2016 at 17:37
  • There isn't a simple answer to this question. Too many confounding variables. @LukeBriggs webGL gaming is off-loading most of those calcs to the GPU, your puny normal non-OpenGL code couldn't hope to compete. You're still right though, n * 1000 or even n * 10000 shouldn't be any kind of bottleneck except possibly in IE (and I'd still want to see hard numbers). Commented Dec 12, 2016 at 18:04

2 Answers 2

2

Likely yes, but there's a lot of variables that could affect it. I'm assuming that:

  • The visitor is a typical web user
  • The ajax request has a round trip time of roughly 100ms

Given these circumstances, your average visitors browser could almost certainly search through millions of products during that time.

However, assuming you're optimising the user experience (i.e. That delay caused by ajax is rather noticeable), you probably want a hybrid:

Cache everywhere

The chances are your product set changes far less often than people access it; that means your data is very read-heavy. This is a great opportunity to avoid hitting the database entirely and cache something like example.com/products/14/all-options.json as a static file.

Storage of text is cheap. Server CPU time less so.

If there are a lot of options for a particular product (i.e. tens of thousands), then alternatively in this case, you could possibly cache them as a tree of static files. For example, example.com/products/14/size-1/all-options.json gives all the options that are size #1 of product #14. example.com/products/14/size-1/option-4/all.json is all size 1, option #4, and so-on.

You can then go ahead and filter these smaller sets with Javascript and potentially have millions of products without needing to have huge database hits or large-ish downloads on startup.

Sign up to request clarification or add additional context in comments.

4 Comments

Just to avoid confusion: this is in a single product page, so a user already selected the product and has the opportunity to customize it. This means that optimizing the response time would probably result just in a smoother experience, not really in selling more. The idea of a json file seems actually good. I'm not sure, though, how would you implement the tree structure. They are folders in the disk? Or you mean something like is illustrated here?
@Carlo - Yep; just ordinary folders within your websites file tree. Recreate the files whenever a product is added or changed (which is assumed to be much rarer than the reads). Webservers are incredibly good at serving up static files - use that to your advantage.
@Carlo I've made a few changes which should hopefully make it clearer for you :)
Thank you very much! I think it will take me some time to implement this solution, but your answer was complete enough so I accepted it.
0

2000 objects in javascript and filtering it doesn't have a problem. but bear this in mind. mysql is for query databases is made for that there for is better and think in mobile devices too with low specifications,pcs with low resources and so on. and if 2000 objects turn into more ?... it will lengthen the request time and the filtering with javascript.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.