0

I noticed a really weird behavior with my ajax calls. Every other ajax call always have a 300ms delay.

Here is what the network section look like. I looked at the details of the call. Here is the fast ajax call, and here is the slow ajax call.

The slow ajax call has 2 extra fields - DNS lookup and Initial Connection.

Why does this happen every other ajax call? How can I ensure consistent ajax performance?

The test code:

<body>
    <input type="button" class="btn" id="testButton" value="Test"/>
</body>

<script>
    document.getElementById('testButton').onclick = function() {
        var xhttp = new XMLHttpRequest();
        xhttp.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
                console.log('done');
            }
        };
        xhttp.open("GET", "{% url 'test_ajax' %}", true);
        xhttp.send();
    }
</script>

def test_ajax(request):
    return JsonResponse({'a': 'a'})

EDIT: I tried doing the ajax call with jQuery, still the same issue.

Jack
  • 417
  • 2
  • 5
  • 16

1 Answers1

0

I may be wrong but I do not conceive performing an AJAX request without jQuery. Maybe the following question can enlight you:

Ajax tutorial for post and get

Your view function is in the right path.

Santiago M. Quintero
  • 1,237
  • 15
  • 22
  • I tried using jQuery to make the ajax call, and the result is the same. 300ms delay on every other call. – Jack Feb 17 '18 at 14:46