Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

motx

Package Overview
Dependencies
Maintainers
1
Versions
22
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

motx

A lightweight application state transfer and storage tool based on the mediator pattern and provides efficient solutions to communication problems between multiple processes or closed modules

  • 3.1.4
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
3
increased by200%
Maintainers
1
Weekly downloads
 
Created
Source

MotX

一个基于中介者模式实现的轻量级应用状态传递和存储的工具,并为多进程或封闭模块之间的通讯问题提供高效的解决方案

Start

npm i motx --save

内置 TypeScript 声明文件


    // #############################################
    // 以下代码跑在worker进程

    import MotX from 'motx'
    const motx = new MotX({
        // 使用存储状态前需先定义存储字段及初始状态
        store: {
            bean: { count: 1 }
        },
        // 注册频道
        channels:[
            // 用户通知更改bean数量
            'change-count'
        ]
    })

    // 订阅
    motx.subscribe('change-count', (count)=>{
        // 更新store状态
        motx.setState('bean', {count})
    })

    // 默认初始同步执行一次,以及bean状态变更后自动异步执行,同步多次变更状态会自动节流
    motx.autorun(({bean})=>{
        console.log(bean.count)
    })

    // 发布
    motx.publish('change-count', 2)

    console.log(motx.getState('bean').count) // 2

    // 接收来自master进程的消息并发布相应消息
    process.on('message', (message)=>{
        motx.onReceive(message)
    })

    //#################################################
    // 以下代码跑在master进程

    import MotX from 'motx'
    const worker = ... // worker handler
    const motx = new MotX({
        pipes:{
            // 定义 worker 数据传送管道
            worker(jsonStringifyed) {
                // 向 worker process 发送motx消息json字符串
                worker.send(jsonStringifyed)
            }
        }
    })
    // 通过 worker 管道将消息传送到 worker 进程
    motx.pipe('worker').publish('change-count', 3)


work with Vue

In entry
import MotxVue from 'motx/motx-vue'
const motx = new MotxVue({ store: { hello: `hello world ~ ~` } })
Vue.use(motx)
In vue components
<template>
    <section>{{ hell }}</section>
</template>
<script lang="ts">
import { Component, Vue } from 'vue-property-decorator'
import { State } from 'motx/motx-vue'
@Component({})
export default class App extends Vue {
    @State('hello')
    protected hell
}
</script>

基础概念

Mediator

MotX 基于中介者模式实现消息发布和订阅机制,实现组件间松耦合通讯,订阅和发布都基于特定频道(channel), publish(channel, data1, data2, ...) subscribe(channel, data1, data2, ...)

为了更好地理解与维护这些 channel,MotX 限制使用 channel 前须先注册

Store & State

MotX 支持缓存全局应用状态,store 用于存储状态树数据,state 是 store 某字段当前状态快照,默认进行对象引用隔离

通过 getState 方法获得指定字段的 state,通过 setState 更改 store 的存储状态

订阅发布的数据不会流入 store,默认也会进行对象引用隔离

Hooks

MotX 作为 '中介',提供三个可以改变发布与更新缓存状态默认流程的钩子,让你可以灵活拓展 '中介' 的能力

Pipe

Motx 通过 pipe 联通多个进程或多个隔离模块,实现多进程或多隔离模块之间相互发布消息,pipe 需要你基于具体应用场景去定义如何传送 motx 消息字符串数据

同一全局上下文含有 name 属性的 MotX 实例可使用 name 作为 pipe 通道名,无需在 MotXOption.pipes 定义

API

MotXOptions

MotXOptions {
    name: string;
    store: Store;
    hooks?: Hooks;
    pipes?: {
        [pipeName: string]: Pipe;
    };
    isolate?: boolean;
    channels?: string[];
}
  • name 实例名,用于同一全局上下通过管道文传输消息,实例名作为管道名

  • store 定义存储状态字段和初始数据

    初始化后不可动态创建字段,也不支持赋值 undefined

    store 负责存储在 motx 内部的状态数据,只能通过 setStatepublish 变更消息来触发 store 的变更

  • isolate 定义数据传输过程是否需要隔离引用

  • hooks: 全局钩子

    • willPublish?(channel: string, args: any[]): boolean; 发布前执行,返回 false 可拦截发布
    • didPublish?(channel: string, args: any[]): void 发布之后执行
    • willSetState?(fieldName: string, newState: State, isolate: boolean, store: Store): State | undefined; 更改 store 数据前执行,返回非 undefined 数据可作为变更数据,返回 undefined 则停止更改数据
    • didSetState?(fieldName: string, newState: State, isolate: boolean, store?: Store): void 更改 store 数据后执行
  • pipes:{[pipeName: string]: (jsonStringifyed: string): void}: 定义向其他进程或隔离模块传送数据的方式

    发布的 channel 前加上 pipeName# 即可向该管道传送经过JSON.stringify 的 publish 相关数据,使 publish 动作应用在目标进程或隔离模块

    同一全局上下文不需要定义,默认使用 MotXOption.name 作为 pipeName

  • channels: string[] 注册频道

Methods

  • publish(channel: string, ...args: any[]): void

    发布消息,传递数据,支持多个参数

  • subscribe(channel: string, handler: Handler): void

    订阅消息

  • unsubscribe(channel: string, handler?: Handler): void

    取消订阅消息

  • getState(fieldName: string): State

    获得指定字段的当前状态数据

  • setState(fieldName: string, newState: State, silent?: boolean): void

    变更 store 状态,支持 silent 模式,为 true 时将不会自动发布字段变更消息

  • autorun(handler: (rootState: { [key: string]: any; }, isInitRun: boolean) => {}): RemoveAutorunFunction

  • 初始同步执行传入的handler,依赖的state变更后异步执行

  • pipe(rule: string): Pipe

    返回管道对象,支持publish和setState

    通过MotXOption.pipes定义的发送方式,向目标进程发送publish或setState动作相关json字符串

  • onReceive

    当前进程或隔离模块接收到其他进程或隔离模块通过管道发送来的数据后,需要执行该方法并将 json 字符串数据传入即可执行对应publish或setState动作

  • dispose()

    注销MotX实例

Keywords

FAQs

Package last updated on 20 Apr 2020

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc