微信小程序框架知识学习


前言

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


一、宿主

宿主环境

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有更好得兼容性。但是如果想要有更多的扩展功能,可以看微信小程序官方文档比较好。

先这么多。。。

猜你喜欢

转载自blog.csdn.net/qq_43205326/article/details/129512790
今日推荐