美文网首页小知识你不知道的技术
web网站性能优化-1、减少Http请求

web网站性能优化-1、减少Http请求

作者: 小小_绿 | 来源:发表于2019-08-05 11:46 被阅读153次

1、减少Http请求

1)、图片地图 Image Maps

在导航栏中或其他超链接中使用多张图片,可以采用图片地图,一张图片代替多张图片,通过坐标识别判断点击事件,从而减少Http开销

图片地图中的图片必须是连续的

2)、CSS sprites 雪碧图

    CSS雪碧的基本原理是把你的网站上用到的一些图片整合到一张单独的图片中,从而减少你的网站的HTTP请求数量。该图片使用CSS background和background-position属性渲染,这也就意味着你的标签变得更加复杂了,图片是在CSS中定义,而非<img>标签。3)、内联图片

<img src="data:image/png;base64,iVBOR....>data - 取得数据的协定名称

 image/png - 数据类型名称       base64 - 数据的编码方法       iUANR.... - 编码后的数据       : , ; - data URI scheme 指定的分隔符号

优点:

        I、减少http请求次数

  II、做为背景平铺类的图片使用内联图片的话,减少http请求次数,并且不会影响加载速度

内联图片的缺点

  I、浏览器不会缓存内联图片资源

  II、兼容性较差,只支持ie8以上浏览器

  III、超过1000kb的图片,base64编码会使图片大小增大,导致网页整体下载速度减慢

4)、合并脚本、样式表

减少脚本、样式表请求次数

5)、icon可采用字体图标

相关文章

  • web网站性能优化-1、减少Http请求

    1、减少Http请求 1)、图片地图 Image Maps 在导航栏中或其他超链接中使用多张图片,可以采用图片地图...

  • 如何减少http请求

    老板说网站打开太卡了,想办法吧 减少http请求吧?减少了真的有用吗? 减少http请求是为了网站性能的优化,请求...

  • Web性能优化

    web性能可以通过以下几方面来优化 content方面 1、减少HTTP请求:合并文件、CSS精灵、inline ...

  • js基础常见问题总结(三)~

    web前端性能优化总结 浏览器访问优化 1、减少http请求,合理设置 HTTP缓存2、使用浏览器缓存3、启用压缩...

  • 图片延迟加载

    网站性能优化:尽量减少向服务器请求的次数 “减少HTTP请求”: a、CSS/JS文件进行合并b、ICON图片也进...

  • 网页加载性能优化方法

    减少网站加载时间的最有效方式如下: 减少网站的HTTP请求数。 优化图片 合并压缩脚本 1.减少HTTP请求数:可...

  • 前端网络高级篇(六)网站性能优化

    网站性能优化可以从下面总结点入手。 1. 减少HTTP请求 使用雪碧图 - CSS Sprites,把多个图片合并...

  • 5.网站的高性能架构

    性能测试指标 响应时间 并发数 吞吐量 性能计数器 性能优化 web 浏览器1 减少http请求2 使用浏览器缓存...

  • 常见技术问题及答案(二)

    一.如何进行网站性能优化? (1)尽可能减少HTTP请求:图片合并 (css sprites),Js脚本文件合并、...

  • YaHoo14军规(网站性能优化)

    tags: 网站性能优化 1. 减少http请求数 2. 使用CDN(内容分发网络) 3. 添加Expire值/C...

网友评论

    本文标题:web网站性能优化-1、减少Http请求

    本文链接:https://www.haomeiwen.com/subject/gaypdctx.html