微信小程序运行在三端和常规的前端开发区别

返回列表
来源:成都网站建设,由本站于2021-05-22编辑发布,已经有1531个小伙伴看过这篇文章啦!

微信小程序使用前端技术堆栈JavaScript / WXML / WXSS。但是与常规的前端开发有一些区别:


微信小程序正式文档中有以下段落:


微信小程序在三个终端上运行:iOS,Android和用于调试的开发人员工具


让我们从开发工具开始。


开发工具


小程序的javascript代码在nwjs中运行。 nwjs到底是什么?官方介绍是这样写的:


NW.js(以前称为node-webkit)使您可以直接从DOM调用所有Node.js模块,并提供了一种使用所有Web技术编写应用程序的新方式。


nwjs合并了Browser和Node.js运行时,您可以使用前端开发技术来开发跨平台应用程序。借助Node.js来访问操作系统的本机API,可以开发中型和跨平台的应用程序。 微信小程序开发工具是使用nwjs开发的。如果您是Mac用户,请转到目录/Applications/wechatwebdevtools.app/Contents/Resources/app.nw/app查看开发工具的实现代码。当然,代码被混淆了。原则上,流行的用于破解版本的在线开发工具是修改内部代码。


类似地,一个更受欢迎的项目是GitHub发起的Electron,该项目还结合了Browser和Node.js来开发跨平台应用程序。程序员应该听说过Atom,这是编辑界的后起之秀。包括微在内的柔和的开源社区的vscode编辑器,也是使用Electron开发的。


电子vs nwjs


这两个平台之间有什么区别?为什么微信选择nwjs?我们也可能有一个猜测。


从技术角度来看:


从应用程序的角度来看:


根据该分析,可以推测微信选择了nwjs进行代码保护。毕竟,开发工具可以上传小程序,并且某些接口和数据需要严格保护。谁可以挖掘以查看哪些代码受到了保护。


真实机器的操作环境


以下内容完全是猜测,如果有什么话,那真的很幸运。


微信小程序的操作环境应该更类似于ReactNative,而不是纯HTML5。两者之间最大的区别是ReactNative的接口是由本机控件呈现的,而Html5的接口是由浏览器内核呈现的。两者之间的性能差异很大。如果您有兴趣,可以参考我的另一篇文章“跨平台应用程序开发技术解决方案摘要”。


原则上小程序如何在微信应用中运行?


让我们看一下小程序的加载和运行过程:


这只是开发人员看到的过程的简化版本。实际过程应该比这复杂得多。它涉及浏览器线程(即运行我们的逻辑层代码app.js等的线程)和线程之间的AppService交互。可以从官方网站上的图片中看到线索:


生命周期


关于微信应用如何与小程序的逻辑层javascript交互?可以概括如下:


JavaScript是一种脚本语言,可以在运行时解释和执行。 微信应用包含一个JavaScript引擎,该引擎负责在逻辑层中执行JavaScript代码。那么,如何实现由JavaScript调用的小程序相关API?答案是,它将最终转换为微信 App中实现的本机接口。例如,开发人员调用wx.getLocation(OBJECT)以获取当前地理位置。


18980020603