Chi phí cho các yêu cầu HTTP
Mỗi yêu cầu HTTP đều tốn thời gian. Vì vậy, một tệp CSS sẽ tải nhanh hơn, so với nhiều tệp CSS, ngay cả khi tổng kích thước của chúng là như nhau.
Do đó, để tăng tốc độ, tất cả các tệp CSS được hợp nhất thành một tệp chung và tất cả các tệp JavaScript được hợp nhất thành một tệp chung. Điều này được thực hiện bằng cách sử dụng các công cụ đóng gói, chẳng hạn như Gulp hoặc Webpack.
Các hình ảnh nhỏ cũng được hợp nhất thành một. Một hình ảnh chung như vậy được gọi là sprite.
Hãy giải thích điều gì không ổn với mã này:
<!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>