Take the 2-minute tour ×
Programmers Stack Exchange is a question and answer site for professional programmers interested in conceptual questions about software development. It's 100% free, no registration required.

I am an entry level programmer with only a few months of experience. Yesterday I was discussing with a colleague how we can improve the performance of a project we are working on together.

The project is built with C# + Ext.NET + JS

The plan was to move as many things as possible to client-side JavaScript instead of interacting with the server all the time.

I thought this was a good idea, but couldn't help but wonder if there is a point where bringing everything to client-side starts making the web application slower. I understand that interacting with the server and reloading unnecessary data all the time is a waste of time in most cases, but I've also seen websites loaded with so much JS that the browser actually lags and the browsing the web application is just a pain.

Is there a golden point? Are there certain 'rules'? How do you achieve maximum performance? Take Google Cloud apps, such as Docs for example, they're pretty fast for what they do, and they're web applications. That is some very good performance.

share|improve this question

closed as not constructive by Mathew Foscarini, Yusubov, Martijn Pieters, Jim G., Robert Harvey May 30 '13 at 2:08

As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or expertise, but this question will likely solicit debate, arguments, polling, or extended discussion. If you feel that this question can be improved and possibly reopened, visit the help center for guidance.If this question can be reworded to fit the rules in the help center, please edit the question.

2  
This is dependant on too many factors to generalize it. It depends on the browser the user is doing, the quality of the JS code, the amount of data, the quality of the network connection (and how busy it is at that point in time), what the workload is on the server, the type of operation you're doing, the specs of the client PC, the specs of the server PC, etc. At the end of the day, the only way to really know what's fastest is to try both, measure it, and see for yourself. Just make sure to account for all of those factors that can vary. –  Servy May 28 '13 at 18:50
2  
Have you done any profiling of your application? Before you perform any "optimization", you need to identify the portions of your application that have the highest impact on performance, quantify the performance and the amount of impact any optimizations will have on it, and then tune from there. Just saying "let's move everything client-side" without understanding what really makes your system slow can easily make things worse. –  alroc May 28 '13 at 20:15
    
Can you be more specific as to what problem you are trying to solve. Saying move many things to Javascript is very unclear. Are you moving business rules, graphics processing, HTML templates, etc.. without specifics there can be no correct answer. The only possible correct answer is "if it ain't broke, don't fix it". –  Mathew Foscarini May 29 '13 at 20:14
add comment

4 Answers

Generally, i would say make efficient trips to the server when they're needed, but also use client technologies when it makes sense.. And don't fight it in an effort to "keep it on the client side". So there is no "golden point" since each app will differ in it's needs and user expectations (does the data need to be "live"? or can it get a little stale and be okay). I've also heard things said like "dont optimize it until optimization is requested".

These are some considerations off the top of my head:

-Use client side technologies when your manipulating the client UI, dont ask the server to draw your page state

-pre-load the data when it makes sense, like dynamic menus and drop downs.. but dont pre-load each "details dialog" in anticipation of the user clicking on each "view details" in a grid, unless it makes sense to do so (like if the details are viewed on rollover instead).

-take advantage of any local data storage if available for temporary persistence and only save it to the server when it needs to be persisted to the database (i.e. allow the user to build a purchase order and add line items but dont save it until their done)

-Since you cant trust client validation 100%, you need to validate the data on the server side anyhow, but generally only when its being committed

If you look at the web requests going on with google docs you can see they're making an awful lot of calls to the server. I'd imagine they also have a decent (insane?) amount of horse power ensuring the web requests are as snappy as can be. So the speed of response time should also influence your decisions on how often to make requests to it..

Hope it helps..

share|improve this answer
add comment

There are instances that it is better if you execute it in the client. But also, sometimes you need to do it on the server.

Like input validations. Validating in the client-side would be much efficient. Some input validations that needs server-side interaction like validating username if it exist on the server, in that case, you might want to user AJAX for lightweight server-side interaction.

A simple ajax tutorial from W3Schools http://www.w3schools.com/ajax/

A lot of factors to be considered.

But usually, you can consider the connection and the target machines(for client-side performance), the amount of users connecting simultaneously and also the UI of your web-app (the more flashy, the slower client-side performance).

Tip - UI Designs from javascript/css plugins can slow down client-side performance.

This question might end-up with no definite answer because it depends on a lot of factors like I said.

But hope my answer would give you better understanding how to implement your web-app functionalities.

:)

share|improve this answer
add comment

The key is optimisation.

  • compressing and minifying any javascript
  • having as little javascript library dependecies as possible
  • caching, memcache
  • optimising database queries
  • use services like cloudflare

Google has the amazing 'Closure compiler' which does some really efficient javascript optimising.

share|improve this answer
    
Another factor: aerotwist.com/blog/reflections-on-performance-at-google-io –  explunit May 28 '13 at 19:30
3  
The key is measuring. Then, optimization. –  Robert Harvey May 28 '13 at 20:25
2  
-1, optimizing without measurement is a less fun version of pissing in the wind. –  Wyatt Barnett May 28 '13 at 21:32
    
hmmm, yes, good point. –  lwm May 29 '13 at 8:50
add comment

The best practice you should choose is make each piece of the code works separately on the system. First, try to use the server just for what you really need, execute your actions there and return just the data or the response to each call, the HTML, the content of your app should be rendered by the front-end so the back-end will just render the data and make some specific actions like selects on the database, inserts and other server side.

You also said about web applications that are too slow, this problem happens sometimes because:

  • Bad code ( The system gets overload with many vars and objects created on the system that aren't used)
  • Use of too many animations together
  • Too much HTML rendered on the page, sometimes the HTML it's hidden and you don't see it, but it still there consuming memory of the Browser

Making just calls with JSON data on the server side will make your app much faster too, as you will not wait for unnecessary content, as the Front-end will be already rendered.

Another thing that you could make it's profile your app with Chrome Dev Tools, that way you can verify your system if there is a point which is having a slow performance.

There's a few points that can lead you, Hope that helps you! :)

:)

share|improve this answer
3  
"Making just calls with JSON data on the server side will make your app much faster too" - this is only true if the UI (transferring it and then rendering it) is what's making the application slow. If your app is slow because your database isn't set up properly (if you don't have a good DBA, this is probably a factor), or your server is CPU-starved, this won't make much of an impact. Users will be able to click quickly, but they'll still wait for their data. –  alroc May 29 '13 at 19:10
add comment

Not the answer you're looking for? Browse other questions tagged or ask your own question.