【文件属性】:
文件名称:perfmatters:前端纳米学位项目4
文件大小:5.41MB
文件格式:ZIP
更新时间:2021-05-07 17:40:19
JavaScript
网站效果优化组合项目
这是针对Udacity的前端开发人员纳米学位计划的网站优化项目
项目目标
在index.html页面上获得90的PageSpeed得分
在pizza.html中滚动时,以60fps的速度保持一致的帧速率
时间要调整比萨饼小于在布劳尔控制台显示在pizza.html为5ms
演示版
要观看现场演示,请访问
代码优化
-views / js / main.js
消除抖动滚动事件:通过将请求的标志与requestanimationframe一起使用,确保updatePosition仅被排队一次
最小化DOM访问:将DOM节点存储到数组中以保存对DOM元素的引用,然后使用forEach函数访问数组中的每个值而不是DOM
最小化DOM Layout属性访问:
将scrollTop布局属性的读数移出updatePostion(),以避免出现Layout Threashing