VueConf PPT讲演总结

497 阅读3分钟

链接地址 www.yuque.com/vueconf/201…

1. vue单元测试

不管是什么项目,检查应用是否正常工作,运行是否为预期,是尤为重要的。然而,为了保证业务正常运行,我们的项目,每做一次更新,都要对所有功能做一次回归测试,随着项目的增大,重复的测试工作越来越多,越来越乏味,手工测试将变成一个恶心的事情。正因如此,自动化测试诞生了,它可以随时监测我们的代码是否正常工作,运行结果是否符合预期。

  • 有保障,自然更有信心更改代码
  • 单元测试是很好的文档
  • 把时间花在有意义的事情上

vue.js vue和jest

使你的测试代码易于维护 -检视你的代码

tips 1: 使用factory方法标准化 Componen omponent的创建

tips 2: 创建自定义的Matcher 以简化verify

tips 3: 留意每个单元测试的副作用 并及时作出清理

tips 4: 以文档的方式 来组织单元测试用例

测试的 {FIRST} {FIRST} 原则

  1. Fast 快速
  2. Isolated 独立,隔离性好
  3. Repeatable 可重复的
  4. Self-Validating 简单直白正确性
  5. Timely 及时书写

测试改善生产代码 PPT www.yuque.com/preview/yuq…

2.VuePress 1.x

  1. 什么是VuePress Vue 驱动的静态网站生成器(布局系统 插件系统 主题系统) www.vuepress.cn/theme/
  2. 快速上手

create-vuepress

VuePress 1.x 给我们带来了 强大的 插件 API 增强的 主题 系统 新增的 博客 主题

PPT www.yuque.com/preview/yuq…

Mars

Mars - Vue 驱动的多端开发框架。一处开发,多端运行 已支持 百度智能小程序、微信小程序、H5 (PWA)

支持 H5 同构并提供完整适配开发方案 支持小程序自定义组件 支持尽量多的 Vue 特性 极致性能优化 PPT www.yuque.com/preview/yuq…

vue开发ECharts 踩坑指南

  1. 每秒传输帧数 每秒画面数,渲染速度

风扇大,卡顿

解决: 将动效和非动效使用Zlevel分层; 减少setOption次数; 降低屏幕分辨率; instance对象不能Reactive(Vue-Echarts); 注意去重

  1. 内存崩溃问题

解决: instance对象不能Reactive(Vue-Echarts); 注意实例事件回收 关注Performance=>Memory=>Allocation 巧用延时器缓解浏览器压力

总结 降低到只有ECharts部分,再逐步加上业务逻辑 chartInstance。getZr()能获取到zrender params.event.target 能获取对象(慎用)

Vue开发小程序之性能优化

  1. 小程序开发生态

wepy 腾讯 mpvue美团 uni-app

nui-app

继承Vue.js 完整的 Vue.js 开发体验,彻底的组件化开发 能力,方便的Vuex数据管理方案, 可以编译到App、小程序、H5等多个 平台,保证其正确运行并达到优秀;

vue开发小程序实现思路 编译器 + 运行时 配合实现

运行 小程序 uni-appruntime Vue

性能优化 • 启动加载性能 • 页面渲染性能

Winter - 使用Vue实现0代码交互

  1. 声明式编程

主要的编程范式有三种:命令式编程,声明式编程和函数式编程。 www.cnblogs.com/sirkevin/p/…

  1. 数据的双向绑定