开发回顾

  1. 列表与列表勾选(多选)如何解耦【mark 微信端】
  2. 微信签名逻辑封装在组件内后,在同一个页面有多个该组件时,如何避免重复签名致使的签名失败:去抖并收集resolve,在签名成功后才集中触发resolve,通知各个组件签名成功
  3. vue指令scrollToView
  4. 表单组件
  5. request的装饰器
  6. 三层数据架构
  7. 基于npm script自动化三层数据架构
  8. 跟随项目的组件库持续化迭代与二次开发
  9. 基于vue-cli3插件化的项目模板搭建
  10. next方法将请求的数据回填到组件

性能优化:css

  • http网络层面html

    1. 开启gzip
    2. cdn
    3. 减小请求,与请求的大小
    4. 减少图片体积
    5. Preload
    6. Prefetch
    7. 强制使用缓存Expires/cache-control
  • 图片层片vue

    1. 使用雪碧图组合普通图片或svg图
    2. 使用字体图标或svg,减小请求,可更改颜色,加阴影,高清不糊
    3. 针对不一样分辨率的屏幕加载不一样的质量的图片srcset
    4. 图片使用离散余弦算法压缩图片,以便获得从模糊到清晰的加载行为
  • 发布包层面es6

    1. 发布es6到线上 type=module nomodule
    2. 将更新频率不一样的代码,打包到不一样的js文件,如工具库,ui等放到vender.js,项目内部工具方法等放到lib.js等
  • 样式层面web

    1. 按重要程度决定记载时间
    2. 避免将重要的样式使用@import导入,被导入的样式文件会在该文件加载完成后才发起请求加载
  • 逻辑层面算法

    1. 使用去抖,节流函数
    2. 尽可能使用面向对象方式,方便复用避免污染全局
    3. 函数惰性化处理
  • css样式vue-cli

    1. BEM原则(块(block)、元素(element)、修饰符(modifier))
    2. css modules

页面渲染流程npm

web安全缓存

将来:安全

  1. 单元测试
  2. 持续化自动集成
相关文章
相关标签/搜索