跳至主要內容
浅谈性能优化

JavaScript代码

  • 作用域 随着作用域链中的作用域数量的增加,访问当前作用域以外的变量的时间也在增加。访问全局变量总是要比访问局部变量慢,因为要遍历作用域链。
    1. 避免全局查找(少用全局变量):将在一个函数中会多次用到的全局对象存储为局部变量总是没错的。
    2. 避免 with 语句:with会创建自己的作用域,因此会增加其中执行代码的 作用域链的长度
  • DOM
    1. innerHTML 代替DOM操作,减少DOM操作次数。
    2. setTimeout 避免页面失去响应。
  • 用变量保存 Ajax请求 结果,操作本地变量时不用请求,减少请求次数。
  • 尽量使用 事件委托模式,避免批量绑定事件。

石怜安大约 7 分钟性能优化不咋滴的性能优化
性能优化方法

Vue 框架通过数据双向绑定和虚拟 DOM 技术,帮我们处理了前端开发中最脏最累的 DOM 操作部分,

使得我们不再需要去考虑如何操作 DOM 以及如何最高效地操作 DOM。

但 Vue 项目中仍然存在项目首屏优化、Webpack 编译配置优化等问题,

所以我们仍然需要去关注 Vue 项目性能方面的优化,使项目具有更高效的性能、更好的用户体验。本文内容分为以下三部分组成:

  • Vue 代码层面的优化
  • webpack 配置层面的优化
  • 基础的 Web 技术层面的优化

Vue 代码层面的优化


石怜安大约 8 分钟性能优化不咋滴的性能优化