客户端和服务器端页面生成

Question

I am trying to use ajax to generate pages on the client side, and so far I got two ideas of doing it:

1. I can load a page with basic DOMs, JS and CSS files from server, then I can make an ajax call to get data from the server and generate pages on the client side.

2. I can load a completed page with JS and CSS files from server, and I can make an ajax call whenever users want to update the contents.

I don't like either of the two methods (both of them will have page templates in JS code). The first one is making extra an request to the server; the second one requires me to make another 'copy' of template in the php code.

Is there any suggestion to make the structure cleaner?

UPDATE: I feel maybe it's good to generate the whole page at the server side when the page is not too big (i consider a table with hundreds of rows is big and it cost a lot for server to generate all those html tags around the data), and in this case, you just need to use ajax to pull the page instead of getting json data from the server then generate the page.

Answer 1

From my experience, there are two scenarios in which you'd want to render client-side:

• You are building a pure client-side JS application.
• You want to serve the data for different platforms (web, desktop, mobile native).

Unless you identify your page with one of the previous scenarios (which I assume you don't), I recommend you to render in server side. Although the response is going to be bigger (server side computing time is negligible), the perceived speed compared to client side rendering is going to be faster.

If you need to serve a very big page, note that you could autoload chunks of HTML via AJAX whenever the user reaches the bottom of the page without the need of client side templates.