跳到主要内容

项目及优化相关

项目中遇到的难点,以及解决思路。

你是如何做Web性能优化的?首屏渲染如何处理?

这个问题很大,我有个简略版,回答思路引自专栏《 浏览器工作原理与实践》:

主要围绕着两个阶段:加载阶段 和 交互阶段

加载阶段:

  1. 减少关键资源的个数和大小(Webpack拆/合包,懒加载等)
  2. 减少关键资源RTT的时间(Gzip压缩,边缘节点CDN

交互阶段:

  1. JS代码不可占用主线程太久,与首屏无关的脚本加上延后处理(aysnc/defer)属性,与DOM无关的交给Web Worker
  2. CSS用对选择器(尽可能绑定ClassId),否则会遍历多次。
  3. 首屏渲染中如果有动画,加上will-change属性,浏览器会开辟新的层处理(触发合成机制)
  4. 避免强制同步布局,避免布局抖动。
  5. 图片懒加载(有四种方式)

埋点数据上报的方案做过吗?

前端架构思考,你是如何考量部门的技术栈的?

前端重构思考,老项目在新业务紧急与重构技术债务间如何衡量轻重?

链接:https://juejin.im/post/5ecc0cbef265da770274b2a5