1

index.php:

    <div class="start">START</div>
    <div class="content"></div>


    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="script.js"></script>

update1.php:

     <div class="fire">FIRE<div>
     <div class="result"></div>

update2.php:

$json = array(
        'unique' => uniqid(),
    );
echo json_encode($json);

script.js:

$(document).off("click", ".start").on("click", ".start", function (event) {

             $.ajax({
                url: "update1.php",
                data: {},
                type: "POST",
                success: function (data) {
                    $(".content").html(data);
                }
            })
});


$(document).off("click", ".fire").on("click", ".fire", function (event) {
        $.ajax({
            url: "update2.php",
            type: "POST",
            dataType: "json",
            encode: true,
            data: {},
            success: function (data) {
                $(".result").html(data.unique);
            }
        });
    });  

I load some data via Ajax and after that I load a Unique ID with json encode. It is working well. The only problem is, that on every click "FIRE" the loading of the Unique ID is getting slower and slower.

The loading time is more or less like this

  • Click "FIRE" ---> Loading time of Unique ID: 0sek
  • Click "FIRE" ---> Loading time of Unique ID: 2sek
  • Click "FIRE" ---> Loading time of Unique ID: 4sek
  • Click "FIRE" ---> Loading time of Unique ID: really long that the mouse waiting symbol is turning and turning.

Note: The Unique ID is just an example. Same thing is happening with a normal variable


I tested update2.php with $time_start = microtime(true);, $time_end = microtime(true); and $execution_time = ($time_end - $time_start)/60;

The result is:

  • Click "FIRE" ---> 4.91499900818E-5
  • Click "FIRE" ---> 5.54800033569E-5
  • Click "FIRE" ---> 5.33978144328E-5
  • Click "FIRE" ---> 5.43832778931E-5
peace_love
  • 6,229
  • 11
  • 69
  • 157
  • 1
    are you sure, it's the ajax response time? could you measure the runtime of update2.php with something like that: http://stackoverflow.com/questions/6245971/accurate-way-to-measure-execution-times-of-php-scripts – errand May 03 '17 at 12:31
  • @errand Yes, I will check this – peace_love May 03 '17 at 12:32
  • I checked your code in my local server and call ajax every time it take 1ms fine. – Ahmed Ginani May 03 '17 at 12:34
  • your code is working fine on my machine – Atmahadli May 03 '17 at 12:36
  • 1
    maybe the code is just a snippet of a bigger set of functions. check out this discussions and aristoteles and grayedFox 's answers - http://stackoverflow.com/questions/3498503/find-out-how-long-an-ajax-request-took-to-complete - due to the javascript event handling queue, the response might be there faster, but js is still busy doing something else... – errand May 03 '17 at 12:38
  • @errand I tested the loading time on my php file. I will post the result in my question – peace_love May 03 '17 at 12:43
  • @errand What do you think of the result? – peace_love May 03 '17 at 12:48
  • @errand Ok, so you think it could help if I put something like `return false;` at the end of my ajax function? – peace_love May 03 '17 at 12:49
  • so at least, you can be sure, that it is not server runtime. checked already the second linked thread, to find out if it's kind of a runtime delay due to event queue backlog? – errand May 03 '17 at 12:51
  • @errand I could find something out! I removed all my other functions in my script.js. And now it is fast. So some functions are running, although I think I didn't told them to – peace_love May 03 '17 at 12:52
  • it's been a pleasure to help - i guess you know now, how to proceed (tons of console.log messages) to find the loophole ;) – errand May 03 '17 at 12:54
  • @errand Yes thanks to your advice I tested it. Do you like to put your advice as an answer? So I can mark it as answered. How can I do that with the console.log message? – peace_love May 03 '17 at 12:56
  • console log explanation would be to much for this comment section - but you find enough information about that via google. every browser has a console window, which you open by pressing f12 - so if you put a lot of console log messages into your javascript, you can then read the log in your browser... since your question turned out to be more trouble shoot and no actual solvable question - my links to other topics are not really an answer. – errand May 03 '17 at 13:00
  • @errand Ok, thanks a lot for your advices. A very good help! – peace_love May 03 '17 at 13:12

0 Answers0