返回专题

专题 2021

小程序原理

小程序原理学习总结

MiniAppNotebook必读系列

烧鸡同学阅读记录

题目一句话评论TagsURL创建时间
智能小程序档案馆——真机调试 - 知乎Debug, MiniApp, Remote Debughttps://zhuanlan.zhihu.com/p/47185925December 23, 2022 10:29 AM
史上最短小程序调试链路 - 知乎- 第一阶段:真机预览
- 第二阶段:chrome 远程调试之 CDP
- 第三阶段:chrome 跑 js bundle
Debug, MiniApphttps://zhuanlan.zhihu.com/p/421943103December 22, 2022 5:38 PM
如何评价微信小程序新渲染引擎skyline - 知乎跟浏览器、Flutter 越来越像了MiniApphttps://www.zhihu.com/question/546709238/answer/2639705680August 23, 2022 11:37 AM
基于 Flutter 的⼩程序框架实践-任宇杰基于 Flutter 的小程序设计MiniApp, Tutorialhttps://techsummit.ctrip.com/pdf/renyujie.pdfAugust 23, 2022 11:34 AM
didi-mpx- Mpx,一款具有优秀开发体验和深度性能优化的增强型跨端小程序框架小程序跨端框架MiniApp, 跨端https://github.com/didi/mpxJuly 26, 2022 9:47 AM
使用Flutter + V8开发小程序引擎(一) - 掘金使用 flutter 编写一些组件,JS 的执行放到 V8 里Flutter, Hybrid App, MiniApphttps://juejin.cn/post/6844903928249729038July 12, 2022 11:20 AM
淘宝小部件 Canvas 渲染流程与原理全解析跨端渲染原理Browser, Canvas, MiniApp, V8, 原理解析https://mp.weixin.qq.com/s/HMQxKgy1vkzxx2o4GW_m2AJanuary 29, 2022 10:37 AM
跨平台Web Canvas渲染引擎架构的设计与思考(内含实现方案)跨平台渲染引擎架构,技术选型为 skiaBrowser, Canvas, Cross-plantform, MiniApp, 原理解析https://mp.weixin.qq.com/s/-_4KZx54DblCylzh-kjJtwJanuary 29, 2022 10:37 AM
githubliruiyuan-HybridFlutter- Flutter + V8-JsCore 动态化Flutter, Hybrid App, MiniApphttps://github.com/githubliruiyuan/HybridFlutterJanuary 15, 2022 5:09 PM
finogeeks-mop-flutter-sdk- FinClip 小程序 Flutter SDK 插件,用于在 Flutter 应用中运行小程序 - Flutter SDK for FinClipFlutter, Hybrid App, MiniApphttps://github.com/finogeeks/mop-flutter-sdkJanuary 15, 2022 5:09 PM
使用Flutter + V8开发小程序引擎(一) - 掘金 2混合渲染技术,小程序原理Flutter, Hybrid App, MiniApp, Tutorialhttps://juejin.cn/post/6844903928249729038January 8, 2022 5:47 PM
wechat-miniprogram-miniprogram-simulate- 小程序自定义组件测试工具集小程序单元测试MiniApp, Testing, Toolshttps://github.com/wechat-miniprogram/miniprogram-simulateDecember 28, 2021 10:03 AM
小程序单元测试实践之miniprogram-simulate - 知乎小程序单元测试MiniApp, Testing, Toolshttps://zhuanlan.zhihu.com/p/80856263December 28, 2021 10:02 AM
w3c-miniapp- MiniApp Standardization- w3c 小程序标准 githubMiniApp, W3Chttps://github.com/w3c/miniappDecember 13, 2021 10:34 AM
MiniApp Standardization White Paper- 小程序标准白皮书MiniApp, W3Chttps://www.w3.org/TR/mini-app-white-paper/#way-forward-in-w3cDecember 13, 2021 10:18 AM
全球开发者,都来感受被小程序支配的恐惧吧- 小程序与 MiniApps 标准发展进程MiniApphttps://mp.weixin.qq.com/s/eZvqP8H4T8rwxW5EfnoahADecember 13, 2021 10:00 AM

小程序调试原理

微信小程序架构分析 (上)

相信不少上手试用了微信小程序开发者工具的开发者都会对其实现有些疑惑, 本文试图对其架构模型进行一些解析。如有错误之处,欢迎留言指出。 本文分为以下几个部分: 微信开发者工具默认禁用了右键打开调试面板功能,我们可以修改开发者工具部分代码移除该限制。 执行完以上操作就可以右键打开页面的调试面板了,需要特别注意的是, 使用 view 页面的面板后会导致 wxml 面板不可用,touch 事件无法响应等种种问题,请慎重使用。 通过代码可以发现,在配置目录下添加 config.
https://zhuanlan.zhihu.com/p/22754296

一起脱去小程序的外套 - 微信小程序架构解析

微信小程序的公测掀起了学习小程序开发的浪潮,天生跨平台,即用即走、媲美原生体验、完善的文档、高效的开发框架,小程序给开发者带来了很多惊喜。通过这篇文章和大家一起分析小程序的架构,分享开发经验。 1、小程序特点 2、小程序演示 视频地址: https://v.
https://mp.weixin.qq.com/s/3QE3g0NmaBAi91lbrihhVw

小程序

小青年,匠心,小青年博客,匠心博客,前端开发,android,技术宅,菜鸟教程,一个神奇的博客。
https://zhaomenghuan.js.org/note/miniprogram/awesome-miniprogram.html

微信小程序技术原理分析

互联网生态演进:超级 APP + 小程序成为「轻应用时代」下的新生态。 一方面微信、支付宝等各家小程序平台遍地开花,另一方面移动开发插件化技术逐渐没落,移动应用构建的方式在悄悄的发生变化。对于企业应用形态而言,也在逐步发生变化,超级 APP(移动门户)+ 轻应用是一种新的流行趋势。微信、支付宝是互联网生态下的"移动门户",手机银行是金融典型的 ToC "移动门户"。 小程序方式构建应用是大趋势,被越来越多的企业用户看到其中的优势,构建一个跨多端平台的小程序开发平台是一种思路,帮助企业用户构建一个具备小程序能力的"移动门户"也是一种思路。本文主要调研微信小程序运行时的基本原理,从而构建一个适合我们自己平台的小程序运行框架。 小程序的渲染层和逻辑层分别由两个线程管理:渲染层的界面使用 WebView 进行渲染;逻辑层采用 JSCore 运行 JavaScript 代码。一个小程序存在多个界面,所以渲染层存在多个 WebView。这两个线程间的通信经由小程序 Native 侧中转,逻辑层发送网络请求也经由 Native 侧转发,小程序的通信模型下图所示。 小程序的双层架构思想可以追溯到 PWA,但又有所扬弃。 小程序框架与 PWA 相比,小程序的开发者可以更聚焦于业务逻辑,而无需关注静态资源的缓存。小程序包的缓存和更新机制交由小程序框架自动完成,开发者可以在适当时机通过 API 影响这一过程。小程序的渲染层由多个 WebView 组成的页面栈构成,这与 PWA 相比有着更接近移动端原生应用的用户体验。同时,小程序的开发者也能更从容地处理多页面间跳转时页面状态的变化。 类似于微信 JSSDK 这样的 Hybrid 技术,微信小程序的界面主要由成熟的 Web 技术渲染,辅之以大量的接口提供丰富的客户端原生能力。同时,每个小程序页面都是用不同的 WebView 去渲染,这样可以提供更好的交互体验,更贴近原生体验,也避免了单个 WebView 的任务过于繁重。此外,界面渲染这一块我们定义了一套内置组件以统一体验,并且提供一些基础和通用的能力,进一步降低开发者的学习门槛。值得一提的是,内置组件有一部分较复杂组件是用客户端原生实现的同层渲染,以提供更好的性能。 为什么要这么设计呢? 为了管控和安全,微信小程序阻止开发者使用一些浏览器提供的,诸如跳转页面、操作 DOM、动态执行脚本的开放性接口。将逻辑层与视图层进行分离,视图层和逻辑层之间只有数据的通信,可以防止开发者随意操作界面,更好的保证了用户数据安全。 微信小程序视图层是 WebView,逻辑层是 JS
https://zhaomenghuan.js.org/blog/wechat-miniprogram-principle-analysis.html#%E6%80%BB%E7%BB%93

返回首页
上一篇架构学习下一篇小程序调试原理

Discussion

留言与讨论

想法、补充和不同意见都欢迎。