美文网首页
前端性能优化方案都有哪些?

前端性能优化方案都有哪些?

作者: beijixing_233 | 来源:发表于2019-04-11 00:31 被阅读0次

前端的资源是多方面,包括HTML、css、js脚本、Image、视频等等。现在只说下常见的优化方案:

一、页面级优化。
1.减少HTTP请求数量,尽可能的保持页面结构简洁。
减少资源的使用、合理设置HTTP缓存,资源合并与压缩(web服务器开启gzip压缩等)
css雪碧图、 图片懒加载(或者加载首屏)。

  1. 将外部脚本置底,避免浏览器加载js脚本而堵塞内容加载。
  2. 异步执行inline脚本,懒加载脚本js,即当触发时加载或者即将触发时预加载。
    4.减少不必要的http跳转,以及避免重复的资源请求。

二、代码级优化:
1.避免不要的回流(reflow)与重绘(repaint)。
2.避免使用 eval和 Function

  1. css避免过多的父级
  2. 图片压缩,图片服务器等。小图标base64或者由SVG代替,Svg的代码量比base64的要少很多。

三 、使用CDN、减少DNS查询、添加Expires头、避免重定向等

相关文章

  • 前端性能优化方案都有哪些?

    前端的资源是多方面,包括HTML、css、js脚本、Image、视频等等。现在只说下常见的优化方案: 一、页面级优...

  • 前端面试必问及加分点---性能优化篇

    如何进行网站性能优化 你有用过哪些前端性能优化的方法? 谈谈性能优化问题 代码层面的优化 前端性能优化最佳实践

  • 前端性能优化

    对于前端的性能优化,主要有分为加载优化和性能优化。在Google官方文档中,给出了性能优化有哪些好处。前端优化的最...

  • 前端性能优化(中)

    性能优化调研系列文章 《前端性能优化(上)》 《前端性能优化(中)》 《前端性能优化(下)》 《前端性能优化(上)...

  • 前端性能优化(下)

    性能优化调研系列文章 《前端性能优化(上)》 《前端性能优化(中)》 《前端性能优化(下)》 《前端性能优化(中)...

  • 前端性能优化(上)

    性能优化调研系列文章 《前端性能优化(上)》 《前端性能优化(中)》 《前端性能优化(下)》 为什么要进行前端性能...

  • JavaScript 性能优化

    介绍 性能优化是不可避免的哪些内容可以看做性能优化无处不在的前端性能优化 JavaScript内存管理 为什么要使...

  • 前端的性能优化都有哪些东西?

    前端性能优化是个巨大的课题,如果要面面俱到的说的话,估计三天三夜说不完。所以我们就从实际的工程应用角度出发,聊我们...

  • 前端性能优化方案

    首先,谈一谈前端性能优化的目的是什么?从用户角度而言,优化能够让页面加载得更快、对用户的操作响应得更及时,能够给用...

  • 前端性能优化方案

    1 .请求和响应 缓存控制 请求头里,可以发送 If-Modified-Since 以及 If-None-Matc...

网友评论

      本文标题:前端性能优化方案都有哪些?

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