美文网首页
性能优化

性能优化

作者: 悟空你又瘦了 | 来源:发表于2018-11-26 09:36 被阅读0次

请说出三种减少页面加载时间和性能优化,文件资源优化的方法?

// 一、加载时间
1.优化图片 
2.图像格式的选择(GIF:提供的颜色较少,可用在一些对颜色要求不高的地方) 
3.优化CSS(压缩合并css,如margin-top,margin-left...) 
4.标明高度和宽度(如果浏览器没有找到这两个参数,它需要一边下载图片一边计算大小, 如果图片很多,浏览
器需要不断地调整页面。这不但影响速度,也影响浏览体验。 当浏览器知道了高度和宽度参数后,即使图片暂时
无法显示,页面上也会腾出图片的空位, 然后继续加载后面的内容。从而加载时间快了,浏览体验也更好了。) 
5.减少http请求(合并文件,合并图片)。

 // 二、性能优化 
1、减少http请求次数: CSS Sprites, JS、CSS源码压缩、图片大小控制合适;网页Gzip,CDN托管,data缓存 ,图片服务器。 
2、前端模板JS+数据,减少由于HTML标签导致的带宽浪费,前端用变量保存AJAX请求结果, 每次操作本地变量,不用请求,减少请求次数 
3、用innerHTML代替DOM操作,减少DOM操作次数,优化javascript性能。 
4、当需要设置的样式很多时设置className而不是直接操作style。 
5、少用全局变量、缓存DOM节点查找的结果。减少IO读取操作。 
6、避免使用CSS Expression(css表达式)又称Dynamic properties(动态属性)。 
7、图片预加载,将样式表放在顶部,将脚本放在底部 加上时间戳。 // 三、文件资源优化 文件合并,文件最小化/
文件压缩, 使用 CDN 托管, 缓存的使用(多个域名来提供缓存)等 

相关文章

  • Android性能优化 - 消除卡顿

    性能优化系列阅读 Android性能优化 性能优化 - 消除卡顿 性能优化 - 内存优化 性能分析工具 - Tra...

  • Android性能优化 - 内存优化

    性能优化系列阅读 Android性能优化 性能优化 - 消除卡顿 性能优化- 内存优化 性能分析工具 - Trac...

  • 前端性能优化(中)

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

  • 前端性能优化(下)

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

  • Awesome Extra

    性能优化 性能优化模式 常见性能优化策略的总结 Spark 性能优化指南——基础篇 Spark 性能优化指南——高...

  • 常用的后端性能优化六种方式:缓存化+服务化+异步化等

    性能优化专题 前端性能优化 数据库性能优化 jvm和多线程优化 架构层面优化 缓存性能优化 常用的后端性能优化六大...

  • webpack 性能优化

    webpack性能优化 开发环境性能优化 生产环境性能优化 开发环境性能优化 优化打包构建速度 优化调试功能 生产...

  • iOS性能优化 - 整理

    本文主要包含: 性能优化 - 卡顿性能优化 - 耗电优化性能优化 - APP启动优化安装包瘦身 一  性能优化 -...

  • 【React.js 20】React性能优化

    React性能优化 React性能优化主要分三块: React 组件性能优化 属性传递优化针对单组件性能优化,很多...

  • Android性能优化(下)

    Android性能优化 内存泄漏和性能优化方式Android性能优化(上)数据库优化和网络优化Android性能优...

网友评论

      本文标题:性能优化

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