快应用开发与架构概述

目录

  • 快应用开发与架构概述
    • 1背景介绍:
    • 2技术实现:
      • 技术优缺点对比
    • 3开发体验:
      • 项目脚手架:
      • 调整样式:
      • 系统能力:
      • 事件响应:
      • 原生组件:
      • 调试开发:
      • 开发体验总结:
    • 4架构概述
      • 整体思路:
      • 编译时:
      • 运行时:
      • JS层架构:
      • DOM模型:
      • 页面渲染:
      • 架构概述总结:

快应用开发与架构概述

1背景介绍:

目标: 即点即用,

快应用平台的统一:

联盟共建, 统一标准, 基于ROM

多场景融入:

浏览器, 全局搜索,应用商店;

2技术实现:

技术优缺点对比

移动网页:无需安装, 升级容易。 性能差, 功能缺失

原声应用:下载安装,版本问题,性能好, 功能完整

快应用:秒开, 容易管理,性能好,功能完整

项目地址:

quickappcn/todos

3开发体验:

一:H5脚手架生成项目:

  1. 静态页面
  2. 页面样式
  3. Http请求
  4. 渲染模板
  5. 自测无误
  6. 联调测试

二: 快应用脚手架生成项目:

  1. 静态页面
  2. 页面样式
  3. 系统能力
  4. 模板渲染
  5. 事件响应
  6. 生命周期
  7. 组件化
  8. 引入动画

项目脚手架:

快应用开发与架构概述_第1张图片

调整样式:

快应用开发与架构概述_第2张图片

系统能力:

快应用开发与架构概述_第3张图片

事件响应:

快应用开发与架构概述_第4张图片

原生组件:

快应用开发与架构概述_第5张图片

调试开发:

快应用开发与架构概述_第6张图片

开发体验总结:

前端概念 + MVVM编程模式 + 组件化思维

4架构概述

整体思路:

快应用开发与架构概述_第7张图片

编译时:

快应用开发与架构概述_第8张图片

运行时:

快应用开发与架构概述_第9张图片

JS层架构:

快应用开发与架构概述_第10张图片

DOM模型:

快应用开发与架构概述_第11张图片

快应用开发与架构概述_第12张图片

页面渲染:

快应用开发与架构概述_第13张图片

架构概述总结:

数据驱动 + DOM模型 + 应用管理

你可能感兴趣的:(快应用开发与架构概述)