微信小程序 | 小程序配置和架构

coderHing[专注前端] coderHing[专注前端] 博客等级 墨衍会员 · AI 创作全网分发 墨衍智能分发 本文由作者通过墨衍一键同步至各平台 1分发平台 8.2k累计阅读 8.2k平均单平台 已同步平台 优快云 微信公众号 微博 知乎 掘金 百家号 博客园 抖音 小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年，写一次发全网 我也要 码龄4年
关注
VIP免费 原创 最新推荐文章于 2026-03-20 15:16:55 发布 8.2k 阅读 AI 写同款· GEO 优化 ›
【微信小程序框架的详细介绍】 微信小程序是一种不需要下载安装即可使用的应用，它实现了应用“触手可及”的梦想，用户扫一扫或搜一下即可打开应用，由于其便捷性，微信小程序受到了广泛的欢迎，微信小程序有自己的一套框架，包括视图层（WXML+WXSS）和逻辑层（JavaScript），以及它们之间的数据通讯。 阅读详情

🖥️ 微信小程序 专栏：小程序配置和架构
🧑‍💼 个人简介：一个不甘平庸的平凡人🍬

✨ 个人主页：CoderHing的个人主页

🍀 格言: ☀️ 路漫漫其修远兮,吾将上下而求索☀️

👉 你的一键三连是我更新的最大动力❤️

目录

一、小程序的双线程模型

二、不同配置文件的区分

小程序的配置文件

三、全局配置文件app.json

全局app配置文件

四、页面配置文件page.json

页面page配置文件

五、注册App实例的操作

注册小程序 - App函数

App函数中的参数

作用一:判断用户打开场景

作用二:定义全局App的数据

作用三: 生命周期函数

六、注册Page实例的操作

注册页面 - Page函数

注册页面时 做什么? 

Page页面的生命周期

上拉和下拉的监听

一、小程序的双线程模型

谁是小程序的宿主环境?  => 微信客户端

        宿主环境是为了执行小程序的各种文件:wxml文件 wxss文件 js文件

当小程序基于WebView环境下时 WebView的Js逻辑 DOM树创建 CSS解析 样式计算 Layout Paint(composite)都发生在同一线程,在WebView上执行过多的Js逻辑可能阻塞渲染 导致界面卡顿

以此为前提，小程序同时考虑了性能与安全，采用了目前称为「双线程模型」的架构。

双线程模型：

        WXML模块和WXSS样式运行于 渲染层，渲染层使用 WebView线程渲染（一个程序有多个页面，会使用多个 WebView的线程）。

        JS脚本（app/home.js等）运行于 逻辑层，逻辑层使 用JsCore运行JS脚本。

        这两个线程都会经由微信客户端（Native）进行中转交互。

二、不同配置文件的区分

小程序的配置文件

小程序的很多 开发需求 被规定在了 配置文件 中

  • 这样做可以更有利于我们的开发效率
  • 可以保证开发出来的小程序的某些风格比较一致
  • 如 导航栏 顶部TabBar栏 以及 页面路由

常见的配置文件有哪些?

  • project.config.json => 项目配置文件
  • sitemap.json => 小程序搜索相关
  • app.json => 全局配置
  • page.json => 页面配置

三、全局配置文件app.json

全局app配置文件

完整的可查看官方文档 =>  打开开发文档 => 框架 => 全局配置

属性

类型

必填

描述

pages

String[]

是

页面路径列表
最低0.47元/天 解锁文章
标签
#小程序 #微信小程序
浅析微信小程序的底层架构原理 一、小程序基础知识 　　小程序是基于WEB规范，采用HTML、CSS和JS等搭建的一套框架，微信官方给它们取的名字：WXML、WXSS，但本质上还是在整个WEB体系之下构建的。WXML说到底就是xml的一个子集。WXML采用微信自定义的少量标签WXSS，大家可以理解为就是自定义的CSS。实现逻辑部分的JS还是通用的ES规范，并且runtime还是Webview（IOS WKWEBVIEW、ANDROID X5） 1、小程序的组成结构 　　一个完整的小程序主要由以下几部分组成： 　　一个入口文件：ap 阅读详情

相关推荐

【小程序开篇】小程序架构和配置

介于H5页面和APP之间的一项技术，自身也具有很大的有优势。体验比传统H5页面要好很多，相当于传统的App，使用起来更加方便，不需要在应用商店中下载安装，甚至注册登录等麻烦的操作；每一个小程序页面也可以使用 .json 文件来对本页面的窗口表现进行配置。页面中配置项在当前页面会覆盖 app.json 的 window 中相同的配置项。微信小程序：https://developers.weixin.qq.com/miniprogram/dev/framework/app.json：全局配置；

贤蛋大眼萌 6037

基于微信小程序实现点餐系统【内附项目源码】

基于B/S的软件数据库之间都是独立使用的，因此是非常可靠的。开发人员在使用微信开发者工具新建一个完整的小程序项目后，小程序项目会自动生成几个默认文件，分别是全局样式:APP.wxss，APP.json，APP.js，其中app.wxss是微信小程序全局的样式，app.json是微信小程序全局的配置，app.js是微信小程序逻辑全局的入口。它们对所有的页面都是有效的。同时对于非全局的pages来说，存在着视图层的两个文件和逻辑层的两个文件，分别是视图层的wxml，wxss，和逻辑层的js，json。

ybigbear的博客 628

小白学习微信小程序的开发流程和项目架构

二、微信小程序项目架构 微信小程序的项目架构主要分为三个部分：视图层（WXML）、逻辑层（JS）、样式层（WXSS）。以上是一个简单的微信小程序开发流程和项目架构的介绍，当然实际开发中会涉及到更多的内容，比如数据交互、页面跳转、组件封装等。创建小程序项目 在微信开发者工具中，点击新建项目，填写小程序的名称、AppID等信息，选择一个合适的目录作为项目的存放位置。调试运行 在微信开发者工具中点击调试按钮，可以在模拟器中查看小程序的运行效果，同时可以在控制台中查看输出的日志信息。一、微信小程序开发流程。

吃不胖. 534

微信小程序底层框架实现原理:开篇-双线程架构

介绍章节我们聊了一下“小程序”的一些概念和发展历程，并且拓展了一下思路。我们从本章节开始讲解小程序的架构。小程序的双线程架构设计。双线程对比单线程的优势在哪里。传统h5开发环境有什么弊端。Native层在双线程架构中起到怎样的作用。如何解决传统h5的安全管控问题。

斌擎科技 2247

【逆强化学习-1】学徒学习（Apprenticeship Learning）

逆强化学习算法1：学徒学习。算法原理+算法步骤+代码+仿真：一个基于gym的小车上山的仿真。附赠学徒学习+Q-Table及学徒学习+DQN的全套代码。

体会编程语言独到的美 7495

使用Python下载ECMWF的ERA-5数据

一、注册账号 [官网]https://www.ecmwf.int/ 二、登录后获取下载key https://cds.climate.copernicus.eu/api-how-to 如图右侧红色框中的内容复制保存为TXT文件，并重命名为“.cdsapirc”，注意前面有点，保存在 C:\Users\username\.cdsapirc，（WINDOWS系统），username指当前电脑登录账户。 三、安装cdsapi库 以pycharm为例： 在pycharm中依次打开：File>setting

wise_sun的博客 7708

Speedtree学习笔记（案例）——拥有多种材质的植物如何导入使用（以草为例）

注：Speedtree无论保存还是导入模型其存储路径不可有中文。 第一步拆分草的模型 根据所需的材质去拆分（例：假若草的果实，茎秆和叶子是不同的材质那么就需拆分为三份；假若画的全部颜色及材质一样就没有必要去拆分模型） 第二步导入草的模型 在Mesh面板中依次导入草的模型——Do nothing additional right now 第三步扩大草的生长区域范围（可省略）...

L人青的博客 5722

Flowable第一篇、快速上手（Flowable安装、配置、集成）

Flowable是一个轻量级、高效可扩展的工作流和业务流程管理（BPM）引擎，支持在Java应用程序中实现复杂的工作流自动化。Flowable最初是作为Activiti项目的一个分支发展而来的，但它现在已经成为一个独立的开源项目，并在企业级应用中得到了广泛使用

Du_XiaoNan的博客 1万+

【Docker】完美解决拉取镜像超时报错：ERROR: Get https://registry-1.docker.io/v2/

因为我们下载的镜像是外网的镜像资源，所以下载的速度会非常的慢，甚至大概率下载时会报错，所以需要我们配置一个国内的服务器镜像地址，国内服务器镜像地址有很多，这里咱们就说一下阿里镜像加速器的配置方法。

liu_chen_yang的博客 12万+

从 Token 到 Agent：一文串起 AI 大模型核心概念

摘要：本文系统解析了现代AI系统的八大核心概念：Token（语言处理的最小单位）、Context（AI的短期记忆）、Prompt（指令接口）、Tool（能力扩展器）、MCP（工具生态协议）、Agent（自主智能体）和AgentSkill（专业技能封装）。文章揭示了这些概念如何共同构成AI从基础语言理解到自主决策的技术脉络，重点阐述了Token对计算成本的影响、Prompt工程的重要性、Tool如何突破AI的能力边界，以及Agent如何通过"感知-规划-执行-反思"循环完成复杂任务。最后指

jundao1997的专栏 251

以 Joule 驱动的生成式开发：把需求文档直接变成可运行的 SAP 应用

摘要：SAP BTP的AI助手Joule正在改变开发方式，支持从自然语言描述自动生成数据模型、服务、UI及测试代码。在SAP Business Application Studio中，Joule能根据业务需求生成结构化代码，并提供代码补全、重构、解释等功能。开发者需注意避免上传敏感数据，并对AI生成的代码进行人工审核。Joule特别针对ABAP开发进行了优化，提供符合SAP规范的代码建议，帮助迁移遗留系统。此外，它还能快速生成CAP项目原型，但所有AI生成内容都需经过严格测试验证。

2007 年 ~ 2025 年，深耕 SAP 技术 18 年 343

前言：为什么要学习爬虫和逆向，该如何学习？

学习爬虫和逆向技术是当今数字化时代的重要技能，尤其在数据分析、安全研究、自动化工具开发等领域有广泛应用。以下是详细的学习理由、路径和方法：

数据知道的博客 1万+

Probability and Statistics - 4th edition

Probability and Statistics - 4th edition

C# WinForm 基于DirectShow.dll编写的程序，可边预览边保存视频，音频和图片

基于微软的DirectShow.dll的二次开发1.自动识别连接的摄像头跟麦克风且可以对其进行选择（默认选中第一个）2.可录制wmv和avi两种格式的视频并且都带有音频，avi可以录制的分辨率和帧数进行选择，wmv默认进行了淸晰度优化如不喜欢可去除代码中有相关提示3.可在预览点开之后进行拍照，也可边录制视频边拍照4.添加了视频和音频的压缩功能（酌情使用）这次二次开发发现C#对DirectShow的相关信息太少，这次做完也不敢藏私共享出来，还望大家指正

贝叶斯统计 [韦来生编]

贝叶斯（Bayes）统计是近几十年来迅速发展起来的数理统计的一个重要分支。贝叶斯方法与经典统计方法的主要不同之处是进行统计推断时除了利用样本信息外，还要利用参数的先验信息，因此可以提高统计推断或统计决策的效果。它在经济、金融、生物、医学、自然科学和社会科学等许多领域具有广泛的应用。贝叶斯方法的研究已渗透到了统计学的几乎所有领域。作者在给中国科学技术大学概率论与数理统计专业本科生开设的“数理统计”课程中有一章专门讲授“贝叶斯方法和统计决策理论”，近十年来也给中国科学技术大学概率统计专业研究生开设过几次“贝叶斯分析”课。本书是在对过去讲稿的内容作了适当的增减和调整的基础上完成的。　　本书共分六章。第1章是绪论，介绍了贝叶斯统计的若干基本概念，同时对必要的数理统计的基础知识有重点地作了回顾。第二章介绍了确定先验分布的若干可供选择的方法。第三章介绍了几类常见统计模型参数的后验分布的主要结果和计算方法。第四章和第五章分别介绍了“贝叶斯统计推断”和“贝叶斯统计决策”的内容。第六章介绍了贝叶斯统计计算的若干方法，包括蒙特卡洛方法和马尔可夫链蒙特卡洛（MCMC）方法以及相关统计软件的简介。本书的每一章附右大量的例题和习题，书末附有常用的几个表格和部分习题解答供读者查用。　　大约可在54学时内讲授本书的第1章至第六章的主要内容，教师可根据学时需要选讲本书第1章至第六章的部分内容。书中标“*”号的章节可略去不讲，留给读者作为阅读材料。第六章例题中的R代码和部分例题的数据文件等可从作者个人主页下载。　　作者在编写本书的过程中参考了J.O.Berger教授的《统计决策论及贝叶斯分析》和茆诗松教授编写的《贝叶斯统计》等书中的一些内容，以及《贝叶斯分析》一书中由张伟平博士编写的有关贝叶斯统计计算的一些内容。在此表示衷心感谢。　　本书编写准备过程中，中国科学技术大学统计与金融系的几个研究生帮助完成了本书部分中文的录入和排版，作者对他们的辛勤工作表示真诚的感谢。高等教育出版社为本书的出版给予了大力支持。在此一并致谢。

android 蓝牙通讯demo

android 下蓝牙通讯demo，实现了发现蓝牙，使能蓝牙，通过蓝牙发送消息。
上一篇： 微信小程序 | 小程序开发
下一篇： 微信小程序 | 小程序的内置组件
点赞 74
评论 15
书签 书签 152
coderHing[专注前端]
coderHing[专注前端]
博客等级 码龄4年 3217粉丝 55原创
+ 关注 专栏目录
评论 15
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

coderHing[专注前端]

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值