CODEWITHSUNDEEP
javascriptphpajaxjquery
user2297392
user2297392

Reputation:

Ajax call VERY SLOW with PHP

I'm using Ajax to load the content of another page in a div with Twitter Bootstrap tabs, but the ajax is taking too long to load the page.
Without Ajax page loads very fast!

Page loaded in ajax call: 28.743376016617 ms
Page loaded without ajax: 0.00022506713867188 ms

This is a code of the ajax call:

    $(function() {
    $("#MainTabs").tab();
    $("#MainTabs").bind("show", function(e) {
      var contentID  = $(e.target).attr("data-target");
      var contentURL = $(e.target).attr("href");

      if (typeof(contentURL) != 'undefined')

    $(contentID).html('<img src="<?php echo IMG_DIR; ?>loading/loading-large.gif" width="64" />').load(contentURL, function(){
        $("#MainTabs").tab();
    });
      else
    $(contentID).tab('show');
    });
    $('#MainTabs a:first').tab("show");
});

This is a PHP Code:

<?php
$start = microtime(TRUE); // Start counting

ob_start();
session_start();

$temp = microtime(TRUE) - $start;
echo $temp;

exit;

/*
 * Here is the rest of the contents of the script, so I gave the 'exit' and even with the exit delay it that way!
*/

Does anyone know what is happening and how to help me? The PHP code is very simple and is taking too long!

Thanks!

Upvotes: 4

Views: 8620

Answers (3)

Martin Zvar&#237;k
Martin Zvar&#237;k

Reputation: 2479

I had same issue and after adding headers:

header("Content-Length: xxx")

it works very fast.

Upvotes: 0

Anirudha Gupta
Anirudha Gupta

Reputation: 9299

Do your Ajax load the html from backend that take time to produce html ?

Without Ajax you load less data so that's how its' run fast.

If you load the data that is not so usual then load through Async script. Load the ajax div seconds later after page load.

  1. cancel the ajax request if this take a long time to load.

    $(document).ready(
var xhr;

var fn = function(){
    if(xhr && xhr.readyState != 4){
        xhr.abort();
    }
    xhr = $.ajax({
        url: 'ajax/progress.ftl',
        success: function(data) {
            //do something
        }
    });
};

var interval = setInterval(fn, 500);

    );

Upvotes: 2

Abdul Rehman
Abdul Rehman

Reputation: 689

Please use .ajax() call instead of .load().

Try this:

$(contentID).html('<img src="<?php echo IMG_DIR; ?>loading/loading-large.gif" width="64" />');
$(contentID).ajax(
   url: contentURL, 
   type: "GET",//or POST
   success: function(data){
     $(contentID).html(data);
     console.log(data);//it will show the error log if any [optional]
   }
});

Check here for ajax call

Upvotes: 0

Related Questions