Kosten van HTTP-verzoeken

Elk HTTP-verzoek kost tijd. Daarom laadt één CSS-bestand sneller dan meerdere CSS-bestanden, zelfs als hun totale grootte hetzelfde is.

Om de prestaties te verbeteren, worden daarom alle CSS-bestanden samengevoegd tot één gemeenschappelijk bestand en alle JavaScript-bestanden worden samengevoegd tot één gemeenschappelijk bestand. Dit gebeurt met behulp van build tools, bijvoorbeeld Gulp of Webpack.

Kleine afbeeldingen worden ook samengevoegd tot één. Zo'n algemene afbeelding heet een sprite.

Leg uit wat er mis is met deze code:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="stylesheet" href="styles1.css">
		<link rel="stylesheet" href="styles2.css">
		<link rel="stylesheet" href="styles3.css">
		<link rel="stylesheet" href="styles4.css">
		<link rel="stylesheet" href="styles5.css">
		<link rel="stylesheet" href="styles6.css">
		<link rel="stylesheet" href="styles7.css">
		<link rel="stylesheet" href="styles8.css">
		<script src="scripts1.js"></script>
		<script src="scripts2.js"></script>
		<script src="scripts3.js"></script>
		<script src="scripts4.js"></script>
		<script src="scripts5.js"></script>
	</head>
	<body>
		
	</body>
</html>