减少HTTP请求的方式

1. 图片地图

缺点:坐标难定义;除了矩形之外几乎无法定义其他形状;通过DHTML(动态DOM操作)创建的图片地图在 IE 不兼容

    <img usemap="#map1" border=0 src="/images/imagemap.gif?t=1574692303">
        <map name="map1">
        <area shape="rect" coords="0,0,31,31" href="javascript:alert('Home')" title="Home">
        <area shape="rect" coords="36,0,66,31" href="javascript:alert('Gifts')" title="Gifts">
        <area shape="rect" coords="71,0,101,31" href="javascript:alert('Cart')" title="Cart">
        <area shape="rect" coords="106,0,136,31" href="javascript:alert('Settings')" title="Settings">
        <area shape="rect" coords="141,0,171,31" href="javascript:alert('Help')" title="Help">
        </map>

 2. CSS Sprites

  将多幅图片合并成一张单独的图,通过background-position来展示

3.内联图片

将图片的src写为 base64 格式,减小图片的请求

缺点:base64会增加图片大小,使整体下载量增加;由于是内联在页面中,跨越不同页面时不会被缓存

4. 合并脚本和样式表

将引入的js文件 和 css 文件 合并成一个文件,减少HTTP请求次数,加快页面响应速度

猜你喜欢

转载自www.cnblogs.com/tiger4513/p/11931344.html