1. 小程序简介

1. 小程序的特点

2. 小程序演示

视频地址：

3、小程序为什么这么快？

页

预加载额外的

打开指定页面时直接以默认数据渲染，当请求的数据返回时部分更新

返回显示历史视图

退出小程序，View状态未被销毁

4. 小程序入口

扫描二维码进入小程序

搜索小程序

将小程序发送到桌面()

寄给朋友

2. 小程序架构

微信小程序的框架由两部分组成：View层和App逻辑层。View层用于渲染页面结构，App层用于逻辑处理、数据请求、接口调用。它们运行在两个线程中。

视图层使用渲染，逻辑层使用执行。

视图层与逻辑层通过系统层进行通信，逻辑层将数据变化通知给视图层，触发视图层页面更新，视图层将触发的事件通知给逻辑层进行业务处理。

小程序启动时，会从CDN下载小程序完整包

3. 视图（页面浏览量）

视图层使用WXML和WXSS编写，通过组件的方式展示。

逻辑层的数据反映到视图中，视图层的事件发送给逻辑层。

1. 视图 - WXML

WXML（）

支持数据绑定

支持逻辑运算

支持模板、参考

支持添加事件（）

wxml编译器：wcc将wxml文件转换为js 执行方法：wcc.wxml

2. 视图 - WXSS

WXSS( )

支持大多数 CSS 功能

增加尺寸单位rpx，可以自适应屏幕宽度

使用@语句导入外部样式表

不支持多层选择器——避免被组件内部的结构破坏

wxss编译器：wcsc 将wxss文件转换成js 执行方法：wcsc .wxss

3. 视图 – WXSS

WXSS 目前支持以下选择器：

4. 查看 -

小程序提供了一系列的组件供业务功能开发，按照功能和标签进行对比如下：

小程序组件基于Web标准

使用框架实现 Web

5. 查看 -

目前实施的组件包括

组件层位于层之上

4.应用程序（逻辑层）

逻辑层对数据进行处理并发送给视图层，同时接收视图层的事件反馈。

1. App（ ）是小程序的入口点；Page（ ）是页面的入口点

3、提供丰富API，如微信用户数据、扫一扫、支付等微信独有的能力。

4.每个页面都有独立的作用域，并提供模块化功能。

5.数据绑定、事件分发、生命周期管理、路由管理

操作环境

iOS -

-X5 JS解析器

-nwjs内核

1. 应用程序 -

数据绑定使用语法（双花括号）包裹变量，动态数据来自于对应Page的数据，可以通过方法修改数据。

事件绑定的写法和组件属性一样，都是key, 的形式，key以bind或 开头，后面跟着事件的类型，如 , ，为字符串，需要在对应Page中定义同名函数。

2. 应用程序 - 生活

3. 应用程序 - API

API 通过以下方式进行通信

4. 应用程序 -

（）

保留当前页面并跳转到应用程序中的某个页面。您可以使用

（）

关闭当前页面并跳转到应用程序中的某个页面。

（）

关闭当前页面并返回上一页或多页，可以使用()获取当前页面堆栈，并决定返回几级。

5. 小程序开发经验

1. 小程序存在的问题

小程序依然使用渲染，而非原生渲染

需要独立开发，无法在非微信环境中运行。

开发人员无法扩展新的组件。

服务端接口返回的无法执行，例如：Set-。

依赖浏览器环境的JS库因为执行后没有对象所以无法使用。

WXSS 不能使用本地内容（图像、字体等）。

为了兼容rpx，WXSS被转换为js而不是css。

WXSS 不支持级联选择器。

小程序无法打开页面，无法启动APP。

小程序不能和公众号同名，所以小程序名字就变成了：自选股+、滴滴出行DiDi。

2. 小程序可以借鉴的优势

提前创建一个新页面，准备渲染。

View层与逻辑层分离，通过数据驱动，不直接操作DOM。

使用 DOM 执行部分更新。