为了账号安全,请及时绑定邮箱和手机立即绑定

前端性能优化-通用的缓存SDK

难度中级
时长 4小时28分
学习人数
综合评分9.6
17人评价 查看评价
9.8 内容实用
9.6 简洁易懂
9.5 逻辑清晰
简介:性能优化成神之路的必看之课,是前端性能优化基础简介的后续篇章,作为一门前端性能优化的进阶课程,本课程介绍了常用的性能优化方法,以及老师自己在工作中摸索出来的,并且在大厂使用的课程。

1章 实战项目初始化

主要接介绍nodejs、grunt的常用方法,以及clone下来我们的实验项目。
  1. 1-1 环境搭建 (02:35)
  2. 1-2 介绍nodejs、npm (05:49)
  3. 1-3 项目安装 (16:21)
  4. 1-4 问题解决+结语 (02:31)

2章 常用的图片优化方法

讲解实战项目中图片的加载方式,以及常用图片类型,使用场景。最后使用grunt,优化一下我们项目的图片问题
  1. 2-1 图片与css (02:31)
  2. 2-2 图片分类 (03:01)
  3. 2-3 图片的加载方式 (02:55)
  4. 2-4 CSSSprites简介 (06:44)
  5. 2-5 CSSSprites实战 (07:05)
  6. 2-6 未来方法+结语 (03:52)

3章 常用视频优化方法

本章节简单介绍了视频站点中最核心的优化点都有哪些,以及附带跟大家一起制作一个自定义播放器皮肤的事例。
  1. 3-1 视频播放器简介 (05:42)
  2. 3-2 自定义播放器 (09:43)
  3. 3-3 js前置 (06:27)
  4. 3-4 资源提前 (03:38)

4章 介绍常用缓存方式

介绍cookie/sessionstroage/localstroage/userData/openData等业内常用的存储方式,以及他们的优缺点,何种情况下使用他们。
  1. 4-1 简介技术选型 (02:57)
  2. 4-2 sessionStorage (08:14)
  3. 4-3 userData+cookie (03:07)
  4. 4-4 openData+localstorage (14:39)
  5. 4-5 localstroage边界值+结尾 (05:51)

6章 高性能的dom

主要介绍造成性能优化dom时候,主要碰到的重绘以及回流问题。介绍他们的成因以及解决方案,最后实际写出代码验证方案。
  1. 6-1 什么是dom (04:14)
  2. 6-2 回流和重绘 (02:49)
  3. 6-3 为什么避免回流和重绘 (04:51)
  4. 6-4 如何避免回流和重绘 (03:35)
  5. 6-5 如何分辨重绘 (06:58)
  6. 6-6 结语 (01:52)
课程须知
1、对html基础知识已经掌握。 2、最好看过上一节前端性能优化的基础认知
老师告诉你能学到什么?
1、一个针对实际存在项目做的优化 2、业内通用的必须掌握的优化方案 3、高性能dom的实战 4、图片加载的原理,以及优化方案 5、自定义一个高性能的播放器。 6、一起开发一个所有项目都能使用的性能优化工具类。 7、从一个bug的出现到,分析、解决的方法论
意见反馈 常见问题 APP下载
官方微信
hv128