小程序知识 学习

129 阅读2分钟

小程序知识 学习| 青训营笔记

这是我参与「第四届青训营 」笔记创作活动的的第17天

1小游戏开发 这部分可以看作是小程序的一种

  • 游戏引擎是指一些已编写好的可编辑电脑游戏系统或者一些交互式实时图像应用程序的核心组件
  • 具有目的、规则的一些任务
  • canvas webgl

渲染原理

  • 创建渲染器、从根节点开始渲染、深度优先遍历
  • webgl渲染流程

技能树

  • 计算机网络 操作系统 js 算法 设计模式 游戏引擎
  • git 工程化技术

2了解小程序

  • 产品价值:帮助微信注入了很多价值,微信为小程序带来了更多入口
  • 发展历程:2017-2018微信小程序 后来有支付宝小程序 后来百度小程序 QQ小程序
  • 小程序生态:各种企业 APP 等等
  • 特点
  1. 固定的语法
  2. 统一的平台发布与管理
  3. 流畅度更好
  4. 便捷
  5. 为很多场景带来导流
  6. 开发成本低

原生的痛点:结构繁琐 命名不规范 --------框架:复杂应用 一次开发可以跨多个端

  • Taro 京东vue、react
  • remax:react
  • megalo:网易
  • mpvue:美团
  • uniapp:Hbuild

框架原理 逻辑层生成的虚拟dom与js代码======传递给渲染层 渲染层根据虚拟dom 组合模板 生成要渲染的元素

编译时:通过AST 解析 替换 生成

运行时:虚拟dom template组件 动态生成

  • WebView
  • JSBridge:调用一些app的功能,作为js与native的桥梁,让两者之间能够调用与沟通
  • 可以用注入等实现

优化

无网络用户体验:门槛低 html css js 网页切换:接近原生-----资源离线化;渲染减少---多个webview承接,其他的页面不销毁 安全方面:保证安全可控----web灵活性,不能js操作dom 而是用一种独立的js沙箱

架构

渲染层与逻辑层分离

native-----渲染层webview:渲染页面
|
|
|
逻辑层JSCore:传递数据

原理

  • TTML
  • JS
  • TTSS
  • json配置

<view> html中 {{}}展示动态数据

bindtap事件绑定

时间格式化:s------>minutes senconds /60 %60

定时器:每隔一段时间执行回调------setIntervalm,直到清除了定时器