Socket
Socket
Sign inDemoInstall

@webreflection/signal

Package Overview
Dependencies
0
Maintainers
1
Versions
20
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    @webreflection/signal

A minimalistic signals implementation


Version published
Weekly downloads
659
increased by14.41%
Maintainers
1
Created
Weekly downloads
 

Readme

Source

@webreflection/signal

Coverage Status build status

Social Media Photo by Louis Reed on Unsplash

A minimalistic signals implementation, derived from the post Signals: the nitty-gritty, which size, once minified and brotlied, is 528 bytes.

  • no automatic effect disposal except when an outer effect has inner effects and the outer effect dispose() is invoked
  • computed are lazily initialied but updated per each signal change they depend on, unless a batch operation is updating all inner signals at once
  • no fancy features from other libraries

For anything more complex please check usignal out.

exports

  • signal(value) to create a new signal with a reactive .value
  • computed(fn[, initialValue]) to create a computed signal with a read-only .value
  • effect(fn) to create an effect and return a dispose function
  • batch(fn) to update multiple signals at once and invoke related effects once
  • untracked(fn) to make a callback that can read some signals without subscription to them
  • Signal to compare via instanceof Signal instances
  • Computed to compare via instanceof Computed instances

Computed accepts an initial value to pass to the callback. The callback will keep receiving the previous value on each new invoke.

example

// import {signal, effect} from 'https://unpkg.com/@webreflection/signal';
// const {signal, effect} = require('@webreflection/signal');
import {signal, effect} from '@webreflection/signal';

const single = signal(1);
const double = signal(10);
const triple = signal(100);

const dispose1 = effect(() => {
  console.log(`
  #1 effect
    single: ${single}
    double: ${double}
  `);
});

const dispose2 = effect(() => {
  console.log(`
  #2 effect
    double: ${double}
    triple: ${triple}
  `);
});

++double.value;
// logs single 1, double 11
// logs double 11, triple 100

dispose2();

++double.value;
// logs single 1, double 11

Keywords

FAQs

Last updated on 18 Apr 2024

Did you know?

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

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc