Front-End Development – When to Do Calculations in Front-End?

front-endprogramming practicesweb-applications

My team is developing a WEB based finance application and there was a bit of an argument with a colleague where to keep the calculations – purely in back-end or keep some in front-end too?

Brief explanation:
We are using Java (ZK, Spring) for front-end and Progress 4gl for back-end. Calculations that involve some hardcore math & data from database are kept in back-end, so I'm not talking about them. I'm talking about the situation where the user enters value X, it is then added to the value Y (shown in screen) and the result is shown in the field Z. Pure and simple jQuery-ish operations, I mean.

So what would be the best practice here:

1) Add values with JavaScript that saves from going to the back-end and back and then validate them at the back-end "on save"?

2) Keep all the business logic in the same place – therefore bring the values to the back-end and do the calculations there?

3) Do the calculations in the front-end; then send data to the back-end, validate them there, do the calculations again and only if the results are valid and equal, display them to the user?

4) Something else?

Note: We do some basic validation in Java but most of it is still in the back-end as all the other business logic.

Increase of data that would be sent by recalculating everything in a back-end wouldn't be a problem (small XML size; servers and bandwidth would withstand the increased amount of operations done by users).

Best Answer

As always, such decisions involve a trade-off between different goals, some of which conflict with each other.

  • Efficiency would suggest that you perform calculations in the front-end - both because that way the user's computer uses more power and your server uses less, and because the user sees faster feedback, which improves the user experience.

  • Security demands that any state-changing operations cannot rely on data being checked or computed in the client computer, because the client computer may be under the control of a malicious attacker. Therefore, you must validate anything that comes from untrusted sources server-side.

  • Programming efficiency and maintainability suggests that you shouldn't do the same computation twice because of the wasted effort.

Superficially this sounds as if everything has to be done server-side, but that isn't always the case. If you can easily maintain the duplicated code (e.g. by auto-generating a javascript validator from your server-side Java validator), then repeating the computation can be a good solution. If the data involved are all unimportant, e.g. if the user could cheat only themselves and not you if they manipulate values, then server-side validation isn't necessary. If your response time is dominated by completely different bottlenecks so that a round-trip delay is not perceptible, then UX considerations aren't decisive, etc. Therefore you have to consider how strong each of these pressures is in your situation, and decide accordingly.

Related Topic