npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

shared-state-machine

v0.1.6

Published

A simple library for shared state-machines between client and server. It was designed to simplify developing web-apps. Client-server communication is often done through APIs, but, (i) designing APIs is laborous; (ii) calling the API in the middle of the a

Downloads

9

Readme

Shared State Machine

A simple library for shared state-machines between client and server. It was designed to simplify developing web-apps. Client-server communication is often done through APIs, but, (i) designing APIs is laborous; (ii) calling the API in the middle of the application is an imperactive, state-mutating operation. Instead, shared-state-machine allows you to just define the logic of your app as an initial state and a transaction function. The library then takes care of creating the server, and letting the clients send transactions, and stay synched with the machine's state.

Example: shared random-walk app

This demo implements a random-walk app. Its state is just a number, and it has only one transaction type, which adds a number to the state.

1. Install the lib

npm install shared-state-machine

2. Specify the app

The app specification is just a combination of the initial state and the transaction function.

const walkerApp = {
  init: 0,
  next: tx => state => tx + state
}

3. Start the master state-machine (i.e., the "server")

To start the server, you just need the App specification and a port.

const ssm = require("shared-state-machine");

// Inits master machine
ssm.init(walkerApp, 7171).then(() =>
  console.log("Started master state machine."));

4. Play the state-machine remotely (i.e., the "clients")

To start a client, you just need the App specification and the server URL. It returns a state-machine object, which allows you to send a transaction with ssm.act(tx), and to observe state changes with ssm.get(state => ...).

const ssm = require("shared-state-machine");

 // Plays the state machine remotely
ssm.play(app, "http://localhost:7171").then(ssm => {

  // When the state changes, prints it
  ssm.get(state => console.log("state: " + state));

  // Every second, add a random number to the state
  setInterval(() => ssm.act(Math.random() - 0.5), 1000);

});

Implementation

The library is a very thin, 70-LOC file which depends on just another thin, 50-LOC library. It uses HTTP pooling for state replication, so, on the large scale, its performance could be improved using websockets.

Conclusion

Whenever you have an application where each client has a view of the whole state of the app, and can act to change that state, then using shared-state-machine instead of designing an API might be the most robust way to go. It plays really well with React.