ICode9

精准搜索请尝试: 精确搜索
首页 > 系统相关> 文章详细

vivo蓝河操作系统实践教程-》避免高耗性能操作

2023-11-14 10:46:18  阅读:88  来源: 互联网

标签:


在蓝河应用上,一些比较消耗性能的操作是需要开发时记住的,下面将会介绍这些操作。

避免使用后代选择器

推荐级别:强烈

后代选择器在 web 开发中可以非常好地避免样式污染。但是在蓝河应用中页面和组件天生就具有样式隔离的能力,不使用后代选择器可以更快的渲染页面。

反例 1

.list {
  .item {
    color: red;
  }
}

反例 2

.list .item {
  color: red;
}

正例

.item {
  color: red;
}

打印日志简短

推荐级别:强烈

非必须不建议打日志,如必要打印,日志的内容尽量简短。

反例

export default {
  fn1(obj) {
    console.log(`obj = ${JSON.stringfiy(obj)}`)
  },
}

正例

export default {
  fn1(obj) {
    console.log(`obj.id = ${obj.id}`)
  },
}

非必须不要主动抛出错误

推荐级别:建议

主动抛出 Error 或者 Promise.reject 都会引发性能问题,非必须的场景需尽量避免。

反例 1

function getData(params) {
  if (!params) {
    return new Error('参数不能为空')
  }
}

反例 2

function getData(params) {
  if (!params) {
    return Promise.reject(new Error('参数不能为空'))
  }
}

正例

function getData(params) {
  if (!params) {
    return {
      isSuccess: false,
      msg: '参数不能为空',
    }
  }
}

大数据存放 native

推荐级别:强烈

内容较多的大型静态数据变量(大 object、长 string 等),能下放尽量下放,下放的方式可以是放在 native、也可以是通过 feature 去存取。

反例

// 这里的heartRateList是个超大数据,不能使用js存放
import heartRateList from './heartRateList'
export default {
  data: {
    heartRateList: [],
  },
  onInit() {
    this.heartRateList = heartRateList
  },
}

正例

import health from '@blueos.health.health'

export default {
  data: {
    heartRateList: [],
  },
  onInit() {
    health.getRecentSamples({
      dataTypes: 0,
      success(res) {
        this.heartRateList = res
      },
    })
  },
}

避免使用 JSON.parse、JSON.stringify、Object.assign

推荐级别:强烈

JSON.parse、JSON.stringify、Object.assign 为极消耗性能操作,对象越大越明显。在应用开发中,使用这些方法的目的一般是用于数据的处理,对于 js 做密集 cpu 运行的操作原则上都应由 native 去做。

减少使用 border-radius

推荐级别:建议

border-radius 为耗性能属性,非必须不使用组件圆角,在设计层面上避免出现圆角,如有图片出现圆角要首先考虑使用切图实现。

避免后台堆积

后台刷新 UI 容易造成系统卡顿,影响系统稳定性,尽量避免这些行为。如果 Page 有接收 event 后刷新 UI 的行为,或者有类似行为可以使用暂存数据的方式避免后台刷新 UI

// 临时变量暂存后台刷新数据
let tempData
export default {
  data: {
    text: '应用开发',
    bgData: [1, 2],
    showing: false,
  },
  onInit() {
    const evtId = event.subscribe({
      eventName: 'new_data',
      callback: function (res) {
        if (!this.showing) {
          tempData = res.data
        } else {
          this.bgData = res.data
        }
      },
    })
  },
  onShow() {
    this.showing = true
    if (tempData) {
      this.bgData = tempData
    }
  },
  onHide() {
    this.showing = false
  },
}

标签:
来源:

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有