• 从小程序看react


    小程序采用双线程模型,这里主要是为了安全,采用双线程模型是指 一个线程负责渲染界面,一个线程负责执行js代码。那么 两个线程是如何合作的呢?

    渲染线程需要监听用户的事件,然后通知到执行线程,同样 执行线程如果希望更改界面,也需要通知到渲染线程,如何开辟一个线程来运行js代码,下面我们讨论这三个问题。
    第一个问题 可以采用react的事件机制来解决:
    https://www.cnblogs.com/forcheng/p/13187388.html

    第二个关于界面的渲染:
    通过createElement方法创建出node对象,此为新的Node对象,保存到新的虚拟dom对象中,框架中使用setTimeout或者promise 循环对比新老虚拟dom,在不断的对比中不断得到差异,然后不断更新dom。在这里 更新dom的频率远远低于createElement被调用的次数,所以 需要建立一个缓存机制,将多次的createElement操作汇聚在一起,然后最后一起对比。

    第三个问题:
    第三个问题实际上和react没有关系,它涉及到的知识点更加多,包括线程,web core, js core,事件循环等多个知识点。

    客户端提供js运行环境,业务层代码与渲染层通过标记位联系,在webview加载了一个组件后,通知执行线程加载对应的业务代码,执行线程 获取到对应的业务代码后,放在js core里面执行,业务代码内部 如果调用了setData则 会通过native通知到渲染线程,渲染线程使用虚拟dom维护 data。同时 渲染线程在接受到事件后,将事件通知到执行线程,执行线程执行该事件。

    react原理:
    react通过组件树构建出node树,然后通过对比新老node树完成界面更新,同时通过自己的事件机制完成 组件与事件的绑定。


    虚拟dom实现了 按照业务逻辑绘制界面的诉求
    事件机制实现了 渲染端与业务代码端的分离
    事件循环实现了充分利用cpu的能力和避免多线程编程的困难
    JS Core提供了单独的js运行环境,使得界面绘制与代码执行在物理层面隔离开来
    组件化实现了代码复杂度的降低

  • 相关阅读:
    We Never Told Him He Couldn't Do It
    我是天蝎
    学习生活,有感动的时候
    .NET中AOP方便之神SheepAspect
    Effective Java (类和接口)
    Step By Step(Java 系列的目录)
    Linux Shel高级技巧(目录)
    Linux Shell经典实例解析Oracle启动脚本(下)
    Java和C++在细节上的差异(目录)
    Linux Shell经典实例解析Oracle启动脚本(上)
  • 原文地址:https://www.cnblogs.com/mrzhu/p/13574281.html
Copyright © 2020-2023  润新知