美文网首页
前端如何优化?

前端如何优化?

作者: pomelo_西 | 来源:发表于2019-12-09 14:04 被阅读0次
    1. 减少http请求
    1. css Sprites
    2. 行内图片(Base64编码)用data: URL模式来把图片嵌入页面。
    2. 路由、组件按需加载
    3. 模块部分加载: import throttle from 'lodash/throttle'
    4. 图片预加载、懒加载
    1. 预加载是展示的时候,减少图片加载过程载入不好的体验
    2. 懒加载是图片不在当前可是区域展示,为了网络带宽以及提升首次加载速度而做的优化

    预加载:

    • 用img标签与dom的background-image 来达到预加载的效果。在展示前就可以保证图片资源已经加载完成

    懒加载:

    • 可视区加载: element.getBoundingClientReact
    • 纯粹的延时加载: setTimeout, setInterval
    • 条件加载: 触发某些时间才开始异步加载
    5. 清楚不必要的cookie,保证cookie可能小
    6. 尽量减少dom访问
    7. 本地大图片上传cdn,减少png图片的使用

    相关文章

      网友评论

          本文标题:前端如何优化?

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