Dynamically create HTML via PHP or jQuery ajax? Which is faster or better method?

Question

Hi I just want to know what the best practice is for dynamically creating html. I can do it in two ways

Direct PHP

<div id='id-here'>
    <?php
        $user->id = $_GET['id'];
        $user->displayUserInformation( );
    ?>
</div>

jQuery ajax(js script called on page load)

$.ajax({
    type: 'GET',
    url: 'inc/user_information.php',
    data: 'user_id=user_id', //assuming user_id value was already set.
    success: function(html)
    {
        $('#user_information').empty().html(html);
    }  
});

Note: This code doesn't exist and is purely for showing what I mean^^ I also know jQuery load, but prefer to use jQuery ajax for complex stuff.

Thanks!

GordonM · Accepted Answer · 2010-11-12 09:02:55Z

1

The PHP method is certainly more reliable, as it doesn't require javascript in the client. For information that isn't expected during a page's lifetime, or indeed a user's session it also makes a lot more sense. I don't imagine the information on a user is likely to change that much during a page view.

However, if there is some data that's expected to change, say a post count or something, then use PHP to set the initial value, then use ajax to update it only when the value actually changes.

answered Nov 12, 2010 at 9:02

GordonM

31.9k17 gold badges94 silver badges134 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ajreal Over a year ago

what if javascript disabled ? or the jquery library javascript does not loaded properly ?

Woppi Over a year ago

No can do man...you will eventually use javascript with PHP. But you have to be responsible to detect it from the very first start and notify user about it. If jquery library doesn't load...there's a way to use your copy of jquery library from your server. I'm not planning to use PHP with no javascript at all^^

Nathan · Accepted Answer · 2010-11-12 09:01:59Z

1

I wouldn't worry about which is faster... the difference would probably be negligible. But bear in mind that some users do have JavaScript turned off... if you want to support those users, it's worthwhile taking the extra effort to do it in PHP.

My rule is that if it can be done on the server, do it there. Then you can be absolutely sure of the results for all users.

answered Nov 12, 2010 at 9:01

Nathan

11.2k4 gold badges41 silver badges50 bronze badges

4 Comments

ajreal Over a year ago

ultimately all the request are pass back to server for PHP processing - ajax is not 100% faster, but if u return data without HTML, is will be faster than return full HTML

Nathan Over a year ago

@ajreal You're missing the point. What I was saying is that which is faster doesn't really matter. It's not going to make much difference to the user. But if the users browser doesn't support javascript (or jQuery's AJAX) it will never be passed back to the server for PHP processing.

ajreal Over a year ago

that's wrong assumption, lesser HTML will give take lesser time for browser to render, and of course, give u a better page rank - code.google.com/speed/page-speed/docs/rendering.html

ajreal Over a year ago

also, search engine spider does not render javascript, this will need to take into consideration as well

ajreal · Accepted Answer · 2010-11-12 09:04:03Z

1

u get it all wrong, first one is not a 'dynamically created html", user sent a request, PHP process it, and return the HTML, and your browser render it

2nd one is your browser already load HTML, and u try to use jquery to simulate another request of the same process of the 1st one

answered Nov 12, 2010 at 9:04

ajreal

47.4k11 gold badges97 silver badges119 bronze badges

3 Comments

Woppi Over a year ago

Umm...both are separate...I said...show it in two ways. So I created scenario for both^^

Woppi Over a year ago

Sorry if my terminology is wrong. My point is, static- we all see the same thing, dynamic - depends on the user what he/she sees. So it's still HTML...a html for user information.

ajreal Over a year ago

@Woppi - think this way, ultimately all the request are pass back to server for PHP processing, what is the difference ? it still cause a request, the beauty of jquery/ajax is u dun have to use lengthy HTML, save your bloody hell expensive network bandwidth, enhance faster data transmission time, however, u 100% having problem if user choose to disable JavaScript :)

nonopolarity · Accepted Answer · 2010-11-12 09:08:28Z

1

In your examples, if you show user info like this, method 1 will not require another data fetching from the server as in example 2 (2 HTTP requests total, 1 for original webpage, 1 for the ajax), so it is faster.

usually, generating static data inside a page like this (in example 1) is different from AJAX, where content is provided to the user, and only update with the new data using AJAX without updating the whole page's content.

Maybe what you mean is: should the data be provided together with the original webpage, or should it be left empty, and then use AJAX to fetch the data to display it. It would be better usually to provided data at first, instead of letting the user wait for another trip to the server to see the data.

edited Nov 12, 2010 at 9:08

answered Nov 12, 2010 at 9:03

nonopolarity

152k142 gold badges496 silver badges787 bronze badges

Comments

moderns · Accepted Answer · 2011-11-03 05:55:41Z

1

I believe that loading from PHP as static loading would be better and more reliable. However loading from AJAX will push the results one time, not as static loading, data will be loaded in portions...

answered Nov 3, 2011 at 5:55

moderns

65011 silver badges23 bronze badges

Comments

origam iFolder · Accepted Answer · 2011-02-12 00:01:37Z

Along the same lines, which is faster within a php file. This is more for SEO and "best practice" than for actual user experience. I'm using wordpress, and I'm working within php files. Most of it is php, but I have four lines of html within the file. All are exactly the same. I could loop through the four lines with php, or copy and paste the four lines of html. I don't expect to ever change the code, so php doesn't seem to present any other benefits.

Here's my code: HTML version (well mostly)

    <img src="<?php echo get_bloginfo('template_directory').'/images/bracket.png';?>" class="bracket" />
    <img src="<?php echo get_bloginfo('template_directory').'/images/bracket.png';?>" class="bracket" />
    <img src="<?php echo get_bloginfo('template_directory').'/images/bracket.png';?>" class="bracket" />
    <img src="<?php echo get_bloginfo('template_directory').'/images/bracket.png';?>" class="bracket" />

OR the php:

 for($i=0;$i++;$i<4){ ?>    //start loop, 4x
   <img src="<?php echo get_bloginfo('template_directory').'/images/bracket.png';?>" />
   //Image path using php
 <?php }   ?>        // end loop

THANKS ALL!

Collectives™ on Stack Overflow

Dynamically create HTML via PHP or jQuery ajax? Which is faster or better method?

6 Answers 6

2 Comments

4 Comments

3 Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

2 Comments

4 Comments

3 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related