I am David JacksonJekyll2026-04-15T22:29:08-04:00https://iamdavidjackson.com/David Jacksonhttps://iamdavidjackson.com/davidjackson123@gmail.com<![CDATA[Myth Buster - HTTP Request Count Performance Tests]]>https://iamdavidjackson.com/webdevelopment/myth-buster-http-request-count2015-08-03T00:00:00-04:002015-08-03T00:00:00-00:00David Jacksonhttps://iamdavidjackson.com/davidjackson123@gmail.com
<p>Ok lets test the age old theory that having multiple HTTP requests to get Javascript is adverse to loading times. Obviously it is better to download a single file over multiple files however what I’m wondering is, how much better? Are we killing ourselves trying to reduce HTTP requests when there is no benefit or are we saving the world from certain destruction? Lets have a go shall we?</p>
<h2 id="1-vs-2-js-files">1 vs 2 JS files</h2>
<p>Load 1 concatenated JS file or 2 single ones</p>
<p><button onclick="runTestTwo();">Run Test</button></p>
<h2 id="1-vs-5-js-files">1 vs 5 JS files</h2>
<p>Load 1 concatenated JS file or 5 single ones</p>
<p><button onclick="runTestFive();">Run Test</button></p>
<h2 id="1-vs-10-js-files">1 vs 10 JS files</h2>
<p>Load 1 concatenated JS file or 10 single ones</p>
<p><button onclick="runTestTen();">Run Test</button></p>
<script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.1.20/require.min.js"></script>
<script>
requirejs.config({
baseUrl: '/assets/js/posts/http/',
paths: {
test: 'test'
},
bundles: {
'concattwo': ['testone', 'testtwo'],
'concatfive': ['testthree', 'testfour', 'testfive', 'testsix', 'testseven'],
'concatten': ['testeight', 'testnine', 'testten', 'testeleven', 'testtwelve', 'testthirteen', 'testfourteen', 'testfifteen', 'testsixteen', 'testseventeen']
}
});
function runTestTwo() {
var startTime;
startTime = Date.now();
var test = require(['onetest', 'twotest'], function(test) {
var endTime = Date.now();
var duration = endTime - startTime;
console.log('getting 2 files took ' + duration + 'ms.');
});
startTime = Date.now();
var testTwo = require(['testone', 'testtwo'], function(test) {
var endTime = Date.now();
var duration = endTime - startTime;
console.log('getting 1 file took ' + duration + 'ms.');
});
}
function runTestFive() {
var startTime;
startTime = Date.now();
var test = require(['threetest', 'fourtest', 'fivetest', 'sixtest', 'seventest'], function(test) {
var endTime = Date.now();
var duration = endTime - startTime;
console.log('getting 5 files took ' + duration + 'ms.');
});
startTime = Date.now();
var testTwo = require(['testthree', 'testfour', 'testfive', 'testsix', 'testseven'], function(test) {
var endTime = Date.now();
var duration = endTime - startTime;
console.log('getting 1 file took ' + duration + 'ms.');
});
}
function runTestTen() {
var startTime;
startTime = Date.now();
var test = require(['eighttest', 'ninetest', 'tentest', 'eleventest', 'twelvetest', 'thirteentest', 'fourteentest', 'fifteentest', 'sixteentest', 'seventeentest'], function(test) {
var endTime = Date.now();
var duration = endTime - startTime;
console.log('getting 10 files took ' + duration + 'ms.');
});
startTime = Date.now();
var testTwo = require(['testeight', 'testnine', 'testten', 'testeleven', 'testtwelve', 'testthirteen', 'testfourteen', 'testfifteen', 'testsixteen', 'testseventeen'], function(test) {
var endTime = Date.now();
var duration = endTime - startTime;
console.log('getting 1 file took ' + duration + 'ms.');
});
}
</script>
<p><a href="https://iamdavidjackson.com/webdevelopment/myth-buster-http-request-count">Myth Buster - HTTP Request Count Performance Tests</a> was originally published by David Jackson at <a href="https://iamdavidjackson.com/">I am David Jackson</a> on August 03, 2015.</p>