# 减少HTTP请求

# 图片地图

这项技术是针对图片的，可以利用map/area标签把图片分割为多个部分，每个部分有自己独立的行为。这样可以用单张图片代替多张图片，减少HTTP请求次数。不过这项古老的技术现在不多见了。

CSS Sprites主要应用在一个小icon图标上，把它们合并为一张图而不是一个icon一个图(减少HTTP请求次数)，再利用background-position属性找到对应的图标。

这种方法是把图片转换为data-url的形式而不是单独的文件，保存到HTML或CSS中，减少对图片的请求。

现在webpack的url-loader可以辅助处理这个问题，可以限制文件大小，文件比较小转换为data-url的形式，文件比较大依然是单独图片文件。

这一技术可以减少HTTP请求，但是如果跨页面不能缓存图片(相较于独立图片文件)，会使得总加载量变大。如果在CSS中使用内联图片，CSS文件被缓存则包含的图片被缓存。

合并js和css文件有利于减少HTTP请求，但是不利于开发维护。所以开发依然是模块化开发，但是最终利用webpack这样的工具生成合并后的文件。