net::ERR_INSUFFICIENT_RESOURCES error on ajax clock

I have an ajax php clock set up and for some reason it’s giving me thousands of net::ERR_INSUFFICIENT_RESOURCES errors in my console.

What’s the reason behind this?

Code that calls out the clock function

$(document).ready(function(){  
    setInterval(function(){   
        $(".clock").load('<?php echo get_template_directory_uri(); ?>/melbourne.php');;
    });
}(), 1000);

Melbourne.php

<?php  

date_default_timezone_set('Australia/Melbourne');

echo $date = date('H:i:s');

?>

Answer

You misplaced the setInterval delay. You provided it to the $(document).ready()… Which is probably discarding it. So the interval having no delay, it is sending some requests one after the other non-stop.

Look at the difference below:

$(document).ready(function(){
  setInterval(function(){
    $(".clock").load('<?php echo get_template_directory_uri(); ?>/melbourne.php');;
  },1000);
});

Also, be careful with the parenthesis after a function expression.

This is an IIFE: <-- Read that!

function something(){
  // .. some code
}()

Event handlers expect a function expression, so they can execute it at a later time. If you provide an IIFE, the event handler will receive the result of the function execution…