【微信小程序】开发实战 之 ，这份 333 页关于性能优化知识点的 PDF 你不能不看

MINA 框架为页面组件提供了一系列事件监听相关的属性（比如 bindtap、bindtouchstart 等），来与 AppService 中的事件处理函数绑定在一起，来实现页面向 AppService 层同步用户交互数据。MINA 框架同时提供了很多方法将 AppService 中的数据与页面进行单向绑定（注意数据的绑定方向是单向的），当 AppService 中的数据变更时，会主动触发对应页面组件的重新渲染。

框架的核心是一个响应式的数据绑定系统，它能让数据与视图很简单的保持同步。只需要在逻辑层修改数据，视图层就会做相应的更新。示例如下：

<view class="apptitle">

<text class="app-avatar">欢迎使用{{appname}}</text>

<button bindtap="changeAppname">更换名称 </button>

</view>

//AppService 应用逻辑层代码

//初始数据

page({

data:{

appname:'易投票'

},

changeAppname:function(e){

this.setData({

appname:'我的小程序'

})

}

})

图 1：初始名称

图 2：点击按钮“更换名称”以后

示例中数据是如何更新的呢？首先，开发者通过框架将 AppService 应用逻辑层数据中的 appname 与页面视图层名为 appname 的变更进行了绑定，页面在刚打开的时候会显示“欢迎使用 易投票。然后，当点击按钮“更换名称”之后，视图层会发送 changeAppname 的 tap 事件给逻辑层，逻辑层找到事件函数 changeAppname。最后，逻辑层 changeAppname 函数执行了 setData 操作，将对象 appname 的值改变为“我的小程序”，因为该对象已经在视图层绑定，所以视图层会显示为图 2 的名称了。

小程序的 MINA 框架有着接近原生 App 的运行速度，在框架层面做了大量的优化，在重功能上（page 或 tab 切换、多媒体、网络连接等）上使用接近于 native 的组件继承，对安卓和 ios 端做出了高度一致的呈现，还有近乎完备的开发、调试工具。

目录结构

典型的小程序目录结构非常简洁，一般一个项目包含两个目录（pages 和 utils）三个文件（app.js、app.json、app.wxss）。pages 目录下包括程序所需的各个页面，一个页面对应一个目录，包含 2 至 4 个文件（.js、.wxml、.json 及.wxss）。utils 目录则包含一些公共的 js 代码文件。当然，我们还可以添加其他的公共目录，如用来存放本地图片资源的 images 目录。

逻辑层

小程序的逻辑层就是所有.js 脚本文件的集合。小程序在逻辑层处理数据并发送至视图层，同时接受视图层发回的事件请求。

MINA 框架的逻辑层是由 JavaScript 编写，在此基础上，微信团队做出了一些优化，以便更高效的开发小程序，这些优化包括：

1、增加 app 方法用来注册程序，增加 page 方法用来注册页面；

2、提供丰富的 API 接口；

3、页面的作用域相对独立，并拥有了模块化的能力；

简单概括，逻辑层就是各个页面的.js 脚本文件。

需要注意的是，小程序的逻辑层由 js 编写，但并不是在浏览器中运行的，所以 JavaScript 在 Web 中的一些能力都不能使用，比如 dom、window 等，这也是我们开发过程中要克服的阻碍。

视图层

对于微信小程序而言，视图层就是所有的.wxml（WeiXin Markup language）文件与.wxss（WeiXin Style Sheet）文件的集合：.wxml 用于描述页面结构而.wxss 用于描述页面样式。

视图层以给定的样式来展现数据并反馈事件给逻辑层，而数据展现是以组件来进行的。组件（Component）是视图的基本组成单元。

数据层

数据层包括临时数据或缓存、文件存储、网络存储与调用。

1、页面临时数据或缓存

在页面 page()中，我们要使用 setData 函数来将数据从逻辑层发送到视图层，同时改变对应的 this.data 的值。this 在小程序中一般指调用页面，广泛情况下指的是包含它的函数作为方法被调用时所属的对象。直接修改 this.data 是无效的，无法改变页面的状态，还会造成数据的不一致。单次设置的数据有一个大小限制，不能超过

《Android学习笔记总结+最新移动架构视频+大厂安卓面试真题+项目实战源码讲义》
浏览器打开：qq.cn.hn/FTe 免费领取

1024KB，避免一次性设置过多的数据。