dBLog

前端开发 - 性能优化@CSS

CSS 性能优化- 加载性能 - 从减少文件体积, 减少阻塞加载, 提高并发方面入手的

  • css 中不使用 @import, @import 非异步加载且会阻塞渲染; 使用普通 link 标签代替
  • 样式放到最前面, 避免浏览器出现白屏或者无样式, 提高用户体验
  • 减少不必要代码书写量
    • Color 缩写 #fff
    • 浮点数缩写 .1
  • 压缩 CSS 代码, 压缩方式会抽取共同公共样式并进行代码压缩...
Continue Reading

前端开发 - 性能优化@Javascript

Javascript 性能优化- 使用变量缓存

  • 缓存正则对象, 正则对象创建非常缓慢
  • Object.keys()
    • 可以得到自身可枚举的属性, 但得不到原型链上的属性
  • Object.getOwnPropertyNames()
    • 可以得到自身所有的属性 (包括不可枚举 enumerable), 但得不到原型链上的属性, Symbols 属性也得不到
    • 减少递归递推的使用
    • 使用全等...
Continue Reading

前端开发 - 性能优化@网页

网页性能优化- 使用 HTTP2.0

  • 使用 CDN
  • 使用 GZIP 压缩传输
  • 减少 HTTP 请求
  • 使用 DNS 预解析
  • 减少 DNS 解析 - 域名少一点, 浏览器会缓存
  • 减少 DOM 节点
  • 减少 DOM 节点的操作
    • 必要时可以先缓存, 减少不必要的查找
    • 通过 document.createDocumentFragment 创建临时存放空间, 进行操作再一次性修改
  • ...
Continue Reading