前端调优

最新推荐文章于 2021-08-31 14:04:34 发布

qq_33269443

最新推荐文章于 2021-08-31 14:04:34 发布

阅读量174

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/qq_33269443/article/details/81288035

版权

前端专栏收录该内容

11 篇文章 0 订阅

订阅专栏

0.雅虎军规：https://www.cnblogs.com/xianyulaodi/p/5755079.html
1.audits 自带的

2.pagespeed ：提供页面加载速度优化意见，绿色表示可以改进的点。
    
    1.把js放在body最下面，
    2.缓存，
    3.gzip压缩
    4.指定字符集
3.performance.timing
    时间线：prompt for unload。redirect(unload)。app cache。 dns. tcp. request. response. processing. onload

    专业的分析api
    performance.timing

    connectEnd:1532935821710
    connectStart:1532935821710
    domComplete:1532935822778
    domContentLoadedEventEnd:1532935821888
    domContentLoadedEventStart:1532935821888
    domInteractive:1532935821888
    domLoading:1532935821785
    domainLookupEnd:1532935821710
    domainLookupStart:1532935821710
    fetchStart:1532935821710
    loadEventEnd:1532935822781
    loadEventStart:1532935822778
    navigationStart:1532935821700
    redirectEnd:0
    redirectStart:0
    requestStart:1532935821710
    responseEnd:1532935821784
    responseStart:1532935821777
    secureConnectionStart:0
    unloadEventEnd:0
    unloadEventStart:0


    渲染 60帧  16.66毫秒

    蓝色：网络通信和HTML解析
    黄色：JavaScript解析
    紫色：样式计算和布局，即重排
    绿色：重绘

    window.requestAnimationFrame()
    window.requestldeCallback()

    css3d透视变化 video webgl transform  触发合成层 GPU渲染 可以渲染在不同的层上 absolute也是 这些就是重绘 提高性能。

    统一改变样式 缓存重排结果 虚拟dom react 
    display none 不影响重排重绘 visibility影响重排 

    看层神器 firefox  f12 设置 3d view开启

    while true; do curl "http://127.0.0.1:1337/"
    top -pid llll//监控

    profile 

    node --debug app.js  process.pid

    内存泄漏 
        ·全局变量需要进程退出才能释放。
        ·闭包引用中间函数，中间函数不会释放，会使用原始的作用域也不会释放，作用域不被
         释放它产生的内存占用也不会被释放。所有使用过后重置为null等待垃圾回收
        ·谨慎使用内存当缓存，共享缓存 有过期策略。