I'm debugging a slow single page application (SugarCRM 7) that uses lots of asynchronous requests to fetch data from the server.
I have set up the following script to test for possible delays in the connection/server etc.
<?php
if (isset($_GET['ajax'])) {
if (isset($_GET['delay'])) {
sleep((int) $_GET['delay']);
}
echo 'Success...';
exit(0);
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div id="main"></div>
Number of requests: <input type="text" size="2" id="number" value="1"> Delay: <input type="text" size="2" id="delay" value="0"> <button id="button">Go!</button> <button id="clear">Clear...</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
(function () {
var $main = $('#main');
$('#button').click(function () {
var number = $('#number').val(),
delay = $('#delay').val();
for (var i = 0; i < number; i++) {
var start = (new Date()).getTime();
$.ajax({
url: 'test.php',
data: {'ajax': 1, 'delay': delay},
success: function (data) {
var end = (new Date()).getTime(),
elapsed = end - start;
$main.append('<div>' + data + ' - Elapsed time is: ' + elapsed + ' ms</div>');
}
});
}
});
$('#clear').click(function () {
$main.html('');
});
})();
</script>
</body>
</html>
When I test it in Chrome on Mac, I get the following expected result when firing 10 requests at the same time:
However when I test the same script in Chrome on Windows, i get the following result:
We can see that 10 requests on Mac are running parallel (6 at a time) and the total time elapsed is about 2 seconds. But on Windows the requests does not seem to run parallel, and the total time elapsed is about 10 seconds.
Any idea why this is? The server is running Apache and PHP 5.3, if that is relevant.
Edit: This is because of caching. If I disable caching, the requests are performed in parallel.