微信小程序之数据的同步渲染

2023-10-28

微信小程序之数据的同步渲染

结论: 微信小程序通过setData方法实现数据的同步渲染,直接修改data无法实现同步渲染。

setData工作原理

小程序分为逻辑层和渲染层,而每次逻辑层改变了,要借用Native运行。小程序的渲染层和逻辑层由两个线程管理:渲染层的界面使用了 WebView 进行渲染;逻辑层采用 JsCore 线程运行 JS 脚本。一个小程序存在多个界面,所以渲染层存在多个 WebView 线程,逻辑层和渲染层两个线程的通信会经由微信客户端 Native 做中转,逻辑层发送网络请求也经由 Native 转发。

使用setData方法其实就是将逻辑层的数据通过Native进行中转同步到渲染层,所以我们不要重复 setdata, ,但是也要减少数据的传输量。我们的数据传输实际是一次 Javascript 脚本过程,当数据量过大时会增加脚本的编译执行时间,占用 WebView JS 线程。

方法是去除不必要的事件绑定( WXML 中的 bind 和 catch ),从而减少通信的数据量和次数。

Native

native是使用原生系统内核的,相当于直接在系统上操作。是我们传统意义上的软件,更加稳定。

webView

webView是Android内置webkit内核的高性能浏览器,而WebView则是在这个基础上进行封装后的一个 控件,WebView直译网页视图,我们可以简单的看作一个可以嵌套到界面上的一个浏览器控件!

JsCore

JSCore是WebKit默认内嵌的JS引擎,之所以说是默认内嵌,是因为很多基于WebKit分支开发的浏览器引擎都开发了自家的JS引擎,其中最出名的就是Chrome的V8。这些JS引擎的使命都相同,那就是解释执行JS脚本。而从上面的渲染流程图我们可以看到,JS和DOM树之间存在着互相关联,这是因为浏览器中的JS脚本最主要的功能就是操作DOM树,并与之交互。

相比静态编译语言生成语法树之后,还需要进行链接,装载生成可执行文件等操作,解释型语言在流程上要简化很多。这张流程图右边画框的部分就是JSCore的组成部分:Lexer、Parser、LLInt以及JIT的部分(之所以JIT的部分是用橙色标注,是因为并不是所有的JSCore中都有JIT部分)。接下来我们就搭配整个工作流程介绍每一部分,它主要分为以下三个部分:词法分析、语法分析以及解释执行。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

微信小程序之数据的同步渲染 的相关文章

  • 在 SQL 里描述数据分布情况的时候,有 Cardinality 和 Selectivity 两个概念,有什么区别?

    What is the difference between cardinality and selectivity In SQL cardinality refers to the number of unique values in p
  • 分享一波粉丝面试真题-主要是偏管理方面的

    怎么改善团队低迷现状 改善团队低迷的现状是一个重要的管理挑战 以下是一些可能有助于改善团队状态的方法 深入了解问题 首先 需要了解低迷的原因 这可能涉及与团队成员的个人会谈 收集反馈 观察工作流程等 明确问题的性质对于采取适当的措施至关重要
  • 使用python批量将svg转换成PNG

    CairoSVG介绍 CairoSVG是一个将SVG转为PNG PDF PS格式的库 当前版本的CairoSVG至少需要Python 3 5以上版本 CairoSVG安装和使用 pip install cairosvg 通过命令行你就可以使
  • 数据结构课设:学生信息管理系统(完整版)

    系统介绍 学生信息管理系统是针对学校人事处的大量业务处理工作而开发的管理软件 主要用于学校学生信息管理 总体任务是实现学生信息关系的系统化 科学化 规范化和自动化 其主要任务是用计算机对学生各种信息进行日常管理 如查询 修改 增加 删除 另
  • HTTP协议和web工作原理

    HTTP协议 是web学习的核心 学东东切忌只学配置 不学原理 只学会框架有什么用 要会自己写框架 web学习直接关系到J2EE的学习一 HTTP 超文本传输协议 人类之所发展得如此快 就是因为有自己的语言 1 所谓超文本 即纯文本语言 不
  • 使用git push太慢怎么办

    使用git push太慢怎么办 修改host文件 windows 的路径应该在 C Windows System32 drivers etc hosts 在host文件的最后一行加上 151 101 72 249 github global
  • 现代密码学之安全多方计算

    Secure Multi Party Computation 什么是Secure Multiparty Computation 安全定义 Ideal real model Oblivious transfer OT 1 out of 2 s
  • 拓撲排序學習

    确定比赛名次 Problem Description 有N个比赛队 1 lt N lt 500 编号依次为1 2 3 N进行比赛 比赛结束后 裁判委员会要将所有参赛队伍从前往后依次排名 但现在裁判委员会不能直接获得每个队的比赛成绩 只知道每

随机推荐

  • connection ftp refused_ftp: connect: Connection refused 解决方法

    redhat下使用ftp出现connection refused报错 通过查询是端口未开启的缘故 以下为解决方法 root localhost vsftpd usr sbin vsftpd 500 OOPS vsftpd does not
  • Flutter 版本更新 和 dart SDK版本跟新

    The current Dart SDK version is 2 19 5 Because pivot chat requires SDK version gt 3 0 0 lt 4 0 0 version solving failed
  • 基于 RxJs 的前端数据层实践

    近来前端社区有越来越多的人开始关注前端数据层的设计 DaoCloud 也遇到了这方面的问题 我们调研了很多种解决方案 最终采用 RxJs 来设计一套数据层 这一想法并非我们的首创 社区里已有很多前辈 大牛分享过关于用 RxJs 设计数据层的
  • 通过C实现sqlite3操作,(增删改查),导入电子词典

    一 插入 include
  • Tesseract-OCR下载和安装

    Y26 Tesseract 一款由HP实验室开发由Google维护的开源OCR Optical Character Recognition 光学字符识别 引擎 与Microsoft Office Document Imaging MODI
  • uni-app从入门到上天视频教程 23讲 我终于卷完了

    大家好 我是锋哥 祝大家新年快乐 过年走亲访友 休息了几天 今天把uni app课程卷完了 23讲 免费基础课程 uni app技术介绍 uni app 是一个使用 Vue js 开发所有前端应用的框架 开发者编写一套代码 可发布到iOS
  • STM32之舵机转动————寄存器版

    以STM32F407VGT6单片机为例 控制舵机转动的角度0 180 include pwm h 函数名 tim3 ch4 pwm 函数功能 舵机配置 返回值 void 形参 void 函数说明 红色线 5V 棕色线 GND 橘色线 PB1
  • java.lang.manament API 简介

    java lang management 包提供管理接口用于监控以及管理 JVM 以及 Java 运行时的其他组件 我们开发的 JVM Agent 就是通过这个包提供的接口 收集到 JVM 中包括内存 GC 线程在内的信息 java lan
  • 《JAVA核心知识》学习笔记(JVM)-1

    JVM 1 基本概念 JVM 是可运行 Java 代码的假想计算机 包括一套字节码指令集 一组寄存器 一个栈 一个垃圾回收 堆 和 一个存储方法域 JVM 是运行在操作系统之上的 它与硬件没有直接 的交互 Hotspot JVM 后台运行的
  • Android 实现ListView 文字+ 图片

    1 ListView item 布局
  • 用Go实现的简易TCP通信框架

    接触到GO之后 GO的网络支持非常令人喜欢 GO实现了在语法层面上可以保持同步语义 但是却又没有牺牲太多性能 底层一样使用了IO路径复用 比如在LINUX下用了EPOLL 在WINDOWS下用了IOCP 但是在开发服务端程序的时候 很多都是
  • 何为 递归 ?

    递归 递 归 的操作 将大问题化解成小问题的过程 为什么可以化解 是因为大问题的处理方式和小问题的处理方式是一样的 1 要调用自己本身 2 要有一个趋于终止的条件 下面以一个求阶乘的例子简单介绍一下 public class recursi
  • Python基础入门—while循环

    Python基础入门 while循环 while循环 while控制语句 例题1 例题2 例题3 例题4 while循环 语法格式 while 条件 执行语句1 执行语句2 适用条件 无限循环 死循环 while True print 条件
  • 1.10.0版本下tensorflow与matplotlib不兼容问题解决

    1 10 0版本tensorflow默认下载numpy 1 14 5 最新版matplotlib要求numpy版本高于1 15 解决办法 先建虚拟环境 下载1 15或更高版本numpy 再安装2 2或2 3版本的matplotlib 最后安
  • 依赖Linux内核源码编译模块报错arch_hweight.h:54:42: error: expected ‘:’ or ‘)’ before ‘POPCNT64

    问题描述 想要编译一个模块 单独加载到开发板上 一次需要依赖开发板的Linux内核源码进行编译这个模块 编译模块的Makefile如下 home beal wu norflash kernel是开发板使用的内核源码路径 执行make之后报错
  • Zookeeper闪退、报错JAVA_HOME is not set 解决方法

    打开服务端闪退 编辑打开zkServer cmd 在末尾添加 pause 查看报错原因 这里的报错原因是JAVA HOME is not set 没有设置JAVA HOME 这里我们可以看到zkService 启动的时候 加载zkEvn文件
  • mac浏览器没有网络,通讯软件(QQ、微信、飞书等)正常

    网上的方法 1 在网络dns里加 114 114 114 114 或者8 8 8 8 我自己试的是没有解决问题 2 关闭网络代理中的一些勾选 我电脑里本来就没有勾选 3 重置DNS 可能是mac版本不同 提示discoveryutil未找到
  • 企业数字化转型之道:3L8P转型模型

    作者 韩磊 摘要 数字化转型的本质是 在 数据 算法 定义的世界中 以数据服务的流动 化解复杂系统的不确定性 优化资源配置效率 企业数字化转型的本质则是以需求为中心 以数据为资产 以技术为手段 以人才为依托 快速构建能满足客户需求的 支持业
  • Java IO流

    1File类 java io File类 文件和文件目录路径的抽象表示形式 与平台无关 File 能新建 删除 重命名文件和目录 但 File不能访问文件内容本身 如果需要访问文件内容本身 则需要使用输入 输出流 想要在Java程序中表示一
  • 微信小程序之数据的同步渲染

    微信小程序之数据的同步渲染 结论 微信小程序通过setData方法实现数据的同步渲染 直接修改data无法实现同步渲染 setData工作原理 小程序分为逻辑层和渲染层 而每次逻辑层改变了 要借用Native运行 小程序的渲染层和逻辑层由两