@foundit/broadcasterjs
TypeScript icon, indicating that this package has built-in type declarations

1.1.2 • Public • Published

broadcasterjs

A simple yet powerful pub/sub javascript event bus


Usage

No need to initialize separately. Import the 'broadcast' factory function and use to your hearts content.

npm install @foundit/broadcasterjs

import { broadcast } from '@foundit/broadcasterjs'

START A SUBSCRIPTION IN A REACT COMPONENT
useEffect(() => {
  return broadcast.on(['MYBROADCAST-ID', myFlagEmittedCallbackFunction])
}, [myFlagEmittedCallbackFunction])

broadcast.on() returns a unsubscribe function which comes in handy when you want to cleanup on component unmount. If your listener handler function does not depend on the React component it is instanciated, in you can of course omit the return to make it persist.

START SUBSCRIPTION VANILLA JS
const off() = broadcast.on([
  'MYBROADCAST-ID',
  ({ detail }) => {
    document.body.append(detail + ' ')
  },
])
const off() = broadcast.once([
  'MYBROADCAST-ID',
  ({ detail }) => {
    document.body.append(detail + ' ')
  },
])
END SUBSCRIPTION
off() // Use the subscribers return function.
PUBLISH IN REACT & VANILLLA JS (place anywhere)
broadcast.emit('MYBROADCAST-ID', 'Hello world')
TO VISUALLY INSPECT

Click elements tab i chrome devtools, select event-listeners tab in second pane. Active listeners begin with 'broadcast-' + flag name. Expand each listener to see each unique subscriber.

TO DEBUG

Add ?debug=broadcasterjs to your url and open your devtools console.

ADVANCED

The broadcaster functions on,once takes an optional third value and emit takes an optional third argument in the form of a settings object.

{
  debug: boolean (false)
  debugGlobal: boolean (false)
  allowDoublettesSubscribers: boolean (false)
  useLatestSubscriberScope?: boolean (false) // <- internal use
  suppresDebug?: boolean (false) // <- internal use
}

Change log

v 1.1.0 The subscribe functions 'on' and 'once' now return a unsubscribe function (no arguments) that is much more user friendly than the previous off function. 'off' is still available but removed from the documentation.

Commands

Publish to npm: npm publish --access=public Compile typescript: tsc Develop: yarn start

Install

npm i @foundit/broadcasterjs

DownloadsWeekly Downloads

13

Version

1.1.2

License

MIT

Unpacked Size

25.3 kB

Total Files

6

Last publish

Collaborators

  • nicolashervy