Severside processing vs client side processing + ajax?

Question

looking for general advice and / or thoughts ...

I am creating something that, in my opinion, is more of a web application than web pages because I assume that it will look like a gmail application where you leave the page open all day while you receive updates on the page (for those interested, I use the technique of comet programming). I never created a web page before it was so rich in ajax and javascript (now I am a big fan of jquery). because of this, again and again, when I implement a new function that requires a dynamic change in the user interface that the server should know about, I came across the same question:

1), I have to do all the processing on the client in javascript and send back as little as possible via ajax or 2) Should I send a request to the server via ajax, the server does all the processing and then sends back a new html. then in ajax answer i am making a simple assignment with new html

I was inclined to always follow # 1.this web application that I present can become quite chatty with all ajax requests. my thought minimizes the size of requests and responses as much as possible and relies on constantly improving javascript mechanisms to handle as much processing and updating the user interface as possible. I found that with jquery I can do so much on the client side that I would not be able to do this very easily before. my javascript code is actually much larger and more complex than my serveride code. There are also simple calculations that I need to perform, and I have done this on the client side too.

I think that the main question I have is to ALWAYS strive to handle client-side processing on server-side processing, when is this possible? I always felt that the server had to work better for scalability / performance. let the power of the client processor do all the hard work (if possible).

thoughts?

Answer 1

I agree with you. Click as many users as possible, but not too much. If your application slows down or even worsens, your browser will shut down.

My advice is to actually check how your application works when you turn it on all day. Make sure there are no memory leaks. Make sure that no ajax request is created every one and a half seconds after working with the application for a while (timers in JS can sometimes be sick).

Also, never perform user input validation using javascript. Always duplicate it on the server.

Edit

Use jquery snap to life . This will save you a lot of time by sorting through the generated content and make your architecture more understandable. Unfortunately, when I was developing jQuery, it was not yet available; we used other tools with the same effect.

In the past, I also had a problem where generating one part of a page using ajax depends on generating another part. Creating the first part of the first and second part of the second will make your page slower as expected. Plan it ahead. Design your pages so that they already have all the content you open.

Also (regarding simple pages), keep the number of files with links on one server low. Combine javascript and css libraries into one server-side file. Store the images on a separate host, separate hosts better (only create a third-level domain). Although it is worth it only in production; this will complicate the development process.

Answer 2

When deciding whether to create new HTML snippets created using an ajax request, there should be a few considerations on the server or client side. Some things to consider:

• Performance

  . The work that your server should do is what you need. By doing most of the processing on the client side, you reduce server workload and speed up work. For example, if the server can send a small bit of JSON instead of a giant piece of HTML, it would be much more efficient to let the client do this. In situations where this small amount of data is sent anyway, the difference is probably negligible.

• readability. The disadvantage of creating markup in your JavaScript is that it is much more difficult to read and maintain code. Enclosing HTML in quotation marks is unpleasant for viewing in a text editor with syntax coloring set to JavaScript, and makes editing more difficult.

• Separation of data, presentations and behavior. Along readability lines, having HTML snippets in your JavaScript doesn't make much sense for organizing your code. HTML templates must handle markup, and JavaScript must be left alone to handle the behavior of your application. The content of the HTML fragment inserted into the page is not related to your JavaScript code, just the fact of its insertion, where and when.

I tend to be more inclined to return HTML fragments from the server when working with ajax answers, for reasons of readability and organization of the code that I mentioned above. Of course, it all depends on how your application works, how intensively ajax responses are processed, and how much traffic the application receives. If the server has to do a significant job of generating these responses and causes a bottleneck, it may be more important to push the work to the client and abandon other considerations.

Answer 3

I am currently working on a rather complex computing application, and I process it almost completely on the client side. I don’t know exactly what your application will do (more detailed information will be wonderful), but I would say that your application can probably do the same. Just make sure that all of your security and database related code is on the server side, because it will not open holes in your application. Here are some general guidelines that I follow:

• Never rely on a user with a superfast browser or computer. Some people use Internet Explore 7 on older machines, and if it is too slow for them, you will lose a lot of potential customers. Experience as many different browsers and machines as possible .
• At any time, when you have code that can temporarily slow down or freeze the browser, show a feedback mechanism (in most cases, a simple “Download” message) to inform the user that something is really happening, and the browser did not just freeze .
• Try to load as much as you can during initialization and cache everything . In my application, I do something similar to Gmail: show the loading bar, download everything the application will ever need, and then give the user a pleasant experience from there. Yes, they will have to potentially wait a couple of seconds to download, but after that there should not be any problems.
• Minimizing DOM manipulation. Raw JavaScript performance crunching might be “fast enough,” but access to the DOM is still slow. Avoid creating and destroying elements; instead, just hide them if you don’t need them at the moment.

Answer 4

I recently encountered the same problem and decided to go with browser-side processing, everything worked fine in FF and IE8 and IE8 modes in 7, but then ... our client, using Internet Explorer 7, ran into problems, the application freezes, And the script wait window appears, I put too much work in the solution to throw it away, so I spent an hour or so optimizing the script and adding setTimeout where possible.

My suggestions?

• If possible, store non-critical calculations on the client side.
• To keep data transfer low, use JSON and let the client side sort the HTML.
• Test your script with the lowest common denominator.
• Use the profiling function in FireBug if necessary. Consequence: uses an uncompressed (development) version of jQuery.

Answer 5

Of course, it depends on the data, but in most cases, if you can click it on the client side, do it. Make the client most of the processing and use less bandwidth. (Again, this depends on the data you may receive in cases that you need to send more data to do this on the client side).

Answer 6

Some things, such as security checks, should always be performed on the server. If you have calculations that take up a lot of data and produce less data, also put them on the server.

By the way, did you know that you can run Javascript on the server side, create templates and delete databases? Check out the CommonJS ecosystem.

Answer 7

There may also be problems with interserver support. If you use a client-side cross-browser library (such as jQuery) and it can handle all the processing you need, you can let the library take care of that. Creating an interserver HTML server side can be more complex (usually more manual), depending on the complexity of the markup.

Answer 8

it's possible, but with heavy initial page load && & heavy caching usage. take gmail as an example

• When loading the start page, it loads most of the js files needed to run. And most of all is cached.
• Do not use images and graphics.
• Download all the data that should be displayed in the bootstrap, and along with subsequent predicted user data. in gmail and the last yahoo mail, the mailbox is not only filled with a single block of email conversation, it downloads the first few full email messages in advance during pageload. the high availability secret comes at a cost (gmail asks to download the light version if the bandwidth is low .i the rate most of us have experienced).
• follow KISS . means ur desgin is simple.
• And never try to render the entire page using javascript in any way, you cannot predict all your end users using high-configuration systems or high-bandwidth systems.

Its smart for sharing workload between your server and client.

Answer 9

If you think that in the future you may need to create an API for your application (communication with iPhone or Android applications that allows other sites to integrate with yours), you will have to duplicate a bunch of code for all these devices if you refer to the server version of your application.