微信小程序框架知识学习

---

前言

本篇文章主要是，学习小程序框架实现的理论知识和一些底层用到得东西，但不是深入每一个技术原理，可以用于面试，或者是想要了解小程序底层是用什么实现的。都可以用作参考。还会有一些小程序如何做优化得东西。

---

一、宿主

宿主环境

1、微信小程序是从微信app打开所以我们说小程序宿主环境就是微信app。
2、那么小程序能实现多大的能力，就要看微信app提供给小程序提供的功能有多大。

二、运行

1、微信app在打开小程序之前，会把整个小程序的代码包下载到本地。

2、运行环境

小程序的运行环境分成 渲染层 和 逻辑层
① WXML 模板和 WXSS 样式工作在渲染层（说白了就类似于html和css，基本一样）
② JS 脚本工作在逻辑层

一、具体实现：

1、渲染层：

使用webView进行渲染

2、逻辑层：

使用jsCore线程运行js脚本（jsCore就是一个运行js脚本的）

3、平台差异

因为不同设备如ios和Android不同所以对js支持也会有差异。所以小程序我们可以使用es6+开发，但是最后还是需要编译成es5来增强兼容性。

4、运行机制

1、小程序启动分为两种类型，一种是我们冷启动（后台清空，销毁），一种是热启动（后台没清空，只是切换应用）

2、运行状态
①挂起状态，即小程序切换至后台，目前官方说是5秒后会停止小程序的js线程。
（遇到的问题：用定时器写过一个倒计时，但是当用户切换到后台后，倒计时就结束了，所以时间会造成不准确问题，所以需要使用new Date计算倒计时剩余时间，其实还是不准确的。）
②如果小程序长时间后台小程序会被销毁，官方说目前是30分钟。

二、小程序优化

1、启动优化
启动环节：用户打开小程序为起点，到用户看到小程序首页为止。
优化方法：优化包体积、代码注入优化、首屏渲染优化
①使用分包，主包尽量只放启动必备页面，其他功能页面放置分包内，并且，公共组件非必要，如果放入公共组件包内，同样会占用主包代码体积。分包优势：降低体积，降低首次加载。
②静态资源，如图片、音频、视频、字体尽可能放在服务器上，记得压缩。
③还有去除非必要的依赖。
④启动过程中避免同步执行方法，在生命周期函数中避免复杂的计算逻辑。
⑤在页面中，比较想说的就是，尽量不要把和渲染视图没关系的数据也放在data中
⑥数据缓存，不要使用storge做全局数据共享，但一些可以提高启动速度加载页面的数据可以使用缓存，可以一定程度上提高用户体验。

---

总结

当然如果一次要兼容多端运行，还是使用uniapp有更好得兼容性。但是如果想要有更多的扩展功能，可以看微信小程序官方文档比较好。

先这么多。。。