Web Optimize 网页优化

1、减少HTTP请求


1-利用图片地图

2-CSS Sprites(利用background-position)

3-内联图片(通过将小数据量的图片存放在url中来减少http请求,格式data:[mediatype][;base64],<data>)

4-和平脚本和样式表(最终合并成一个大的样式表,webpack的处理方式)

2、添加Expires头

1-添加expires头(规定具体的失效时间,存在问题:服务器时间和本地时间不一致的情况)

2-添加max-age头(规定多少时间后失效)·····    

3、将样式表放在顶部

4、脚本放在底部(放在顶部会阻塞后面内容的下载和呈现)

1-并行下载(如果一个web页面平均地将其组件分别放在两个主机名下,整体的响应时间将可以减少大约一半)

5、使用外部JavaScript和CSS(纯粹而言,内联快一点,但考虑到并行下载和缓存的频率)

1-页面查看(用户查看频率约高,那么外部js和css缓存将有明显的优势)

2-组件查看(不同页面中组件的重用率高的情况下,外部文件也更加有优势)


6、减少DNS(Domain Name System)查找

7、避免重定向

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 前端开发者丨http请求 https:www.rokub.com 前言见解有限, 如有描述不当之处, 请帮忙指出,...
    麋鹿_720a阅读 13,787评论 11 31
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 14,690评论 1 92
  • 简介 前端优化的目的是什么 ? 从用户角度而言,优化能够让页面加载得更快、对用户的操作响应得更及时,能够给用户提供...
    JuanitaLee阅读 4,258评论 0 5
  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,889评论 19 139
  • 第一部分 HTML&CSS整理答案 1. 什么是HTML5? 答:HTML5是最新的HTML标准。 注意:讲述HT...
    kismetajun阅读 28,265评论 1 45

友情链接更多精彩内容