小程序技术全解|青训营笔记

58 阅读2分钟

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

通过本节的学习,我们需要认识和了解小程序的业务产品价值,学习和掌握小程序相关技术原理

1.发展历程

2017 年开始从微信开始探索

image.png

image.png

image.png

2.业务价值

2.1 与Web的区别

  1. 有着固定的语法及统一的版本管理,平台可以更方便的进行审核
  2. 平台能够控制各个入口,如二维码,文章内嵌,端内分享,入口上也能够带来更好的用户体验
  3. 小程序基于特殊的架构,在流畅度上比Web更好,有更优秀的跳转体验

2.2 三大价值

  1. 渠道价值

    由于小程序的便捷性,依托于超级平台,小程序能够充分为很多场景导流,如美团和美团优选微信小程序带来的流量占比分别是40%和80%

  2. 业务探索价值

    相比原生APP来说,小程序的开发难度和成本都降低了很多,这就创造了很多场景开发者能够用小程序来快速试错,不断探索新的业务价值

  3. 数字升级价值

    线下到线上如何做?从请消费的快餐、茶饮到地产汽车等大众消费,小程序都展示了良好的容错范围。我们线下场景的小程序覆盖范围很广

3.技术解析

第三方开发应用最简单最方便的方式:WebView+JSBridge

WebView:是一个基于webkit的引擎,可以解析DOM 元素,展示html页面的控件。

JSBridge:JS与native代码的桥梁,让两者之间能够沟通和调用。

当前存在的问题:

  1. 无网络的情况体验不佳
  2. 网页切换体验不佳
  3. 如何管控保证安全?

4.相关拓展

跨端框架介绍:(解决)复杂应用构建、一次开发可以跨多端

image.png

跨端框架原理:

编译时:

image.png 运行时:

虚拟DOM、Template组件(动态生成模板)

image.png

总结

小程序在我们的生活中很常见了,给我们带来了便利,学了此节的内容,让我对小程序的了解和开发又多了一层理解