百度小程序——基础原理篇

背景

出于兴趣和业务需要的双重要求，开始学习一下百度智能小程序的开发。本文侧重原生百度小程序的学习，后续会涉及到小程序框架okam的学习。

简介

智能小程序，是百度提供的一种技术解决方案。开发者基于此开发出来的服务，在各类宿主环境（手机 App、车载系统、IOT 设备等）中，可做到用户无感知安装过程即点即用。

小程序使用了双线程模型,包括逻辑层和渲染层。逻辑层作为一个单独的线程执行js代码，控制小程序数据的生成和处理；渲染层使用WebView线程，处理页面的渲染和用户的事件交互行为。

基本原理

概览

小程序开发包括全局配置文件、页面配置文件。开发者可通过app.json和app.js文件对小程序进行全局配置；通过.css、.js、.json和.swan文件进行页面配置。具体结构如下：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
├── app.js
├── app.json
├── app.css
├── project.swan.json
└──  pages
    └── index
        ├── index.swan
        ├── index.css
        ├── index.js
        └── index.json
    └── detail
        ├── detail.swan
        ├── detail.css
        ├── detail.js
        └── detail.json

我们可以看到以下几类的文件：

  1. .json为后缀的JSON配置文件，配置了智能小程序所有页面的路径和界面展现样式等；
  2. .swan结尾的SWAN模板文件，用来描述当前这个页面的文件结构，类似于网页中的HTMK文件；
  3. .css结尾的CSS文件，描述页面样式；
  4. .js结尾的JS文件，处理这个页面和用户的交互。

全局app.json

app.json是小程序全局配置文件，设置SWAN的界面、路