JS render or PHP render for repeating markup

Question

So, I have a div that repeats multiple times:

<div class="cmi cm_1_1">
    <span class="cm_img"> 
        <i class="icons">icon_1</i>
    </span> 
    <span class="cm_w">
        something
    </span>                             
    <span class="cm_img"> 
        <i class="icons">icon_2</i>
    </span> 
    <span class="cm_w">
        else
    </span> 
 ... and so on till cm_1_10
</div>

The only thing that will be different will be icon type and wording inside. But the markup is identical.

I was thinking of doing js rendering on this thus using the same markup over and over again (I will simply pass the wording via ajax).

or, should I render the whole thing in server side(php)?

I see. I am confused which is more effective haha. Thanks though. I think I am going to try with js rendering and see if there is any change. — HEYHEY, Feb 12 '16 at 08:44
Depends entirely what you're doing. Both will achieve the same effect. It's generally easier in PHP in my opinion, but that's because I work in it more. I believe it may be quicker in JS if you're using AJAX, however I'm not 100% on that. Either way that won't be noticeable. Unless you're manipulating the DOM however I'd suggest PHP for ease-sake. — Jack hardcastle, Feb 12 '16 at 08:46
I see. I agree with you. I guess the amount won't be too much. I will try js then php. Thank you for the help! =) — HEYHEY, Feb 12 '16 at 08:48

score 2 · Accepted Answer · edited May 23 '17 at 12:07

2

You should probably make a PHP function for rendering such blocks, unless you are planing to render that div dynamically after the document loads.

Rendering with JS means being subject to client-side caching, and as such if you display some content and than update it, it may be that the users won't get the last version until they refresh their browser cache. Therefore it's probably not a good idea to render with js.

Here's a previous question of the same kind with a more elaborate answer: PHP vs JavaScript For Dynamic HTML Pages

edited May 23 '17 at 12:07

Community

1
1

answered Feb 12 '16 at 08:58

alumarcu

133
6

The whole idea was to reduce the initial load amount. I think php rendering will make the most sense (as others pointed out) as it won't be loaded till the action is triggered. Thank you for the info! =) – HEYHEY Feb 12 '16 at 08:59

score 1 · Answer 2 · answered Feb 12 '16 at 08:56

1

In my opinion the most important thing here is to consider if the page you are creating will be static or dynamic. If it is static go for server-side solution. If the content will be changed after page is loaded go for client-side solution (use some js library probably), so that only the changed content will be updated.

answered Feb 12 '16 at 08:56

bohuss

336
2
8

Make sense. I decided to go with php for the fact that it won't be loaded till action is triggered. Thanks! =) – HEYHEY Feb 12 '16 at 09:00

score 1 · Answer 3 · answered Feb 12 '16 at 13:05

Templating in JS and PHP has different drawbacks.

JS is faster to load, but can make the DOM hang/lag for a split second if a lot has to be done (hundreds of elements). The advantage is that the HTML snippet can be cached and reused next visit, so that only data has to be loaded.

PHP is slower to load, but if you are able to add GZIP to your PHP output, it will compress the templated and prerendered HTML and the output would load fast, but still load slower than javascript.

So it depends on your usage, but both are valid solutions.

JS render or PHP render for repeating markup

3 Answers3