减少HTTP请求的方式

允我心安 提交于 2019-12-05 15:34:26

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请求次数,加快页面响应速度

 

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!