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

@slonoed/startup

v1.0.1

Published

Small IoC library with flexible API and async components in mind

Downloads

4

Readme

Startup

Small IoC library with flexible API and async components in mind.

Startup was written with these goals:

  • Easy to add to existing project
  • Easy testing
  • Components can be asynchronous

Why

There are hundreds of npm packages for IoC and DI. Most of them force you to use some structure or special features for you component: classes, decorators, objects with fixed structure or even typescript. Startup don't force you with this. You just need to wrap code into function.

Install

npm install @slonoed/startup

How to use

Startup works with two simple entity: a function and a promise. Each component is a function that returns value. This value can't be null or undefined.

// file simple.js
module.exports = function SimpleComponent() {
  return 'Hello'; // This is value of component
}

If this value is a Promise instance, Startup assume it's async component. And all dependants will wait until it resolves.

// file withTimer.js
module.exports = function ComponentWithTimer() {
  // Async component return promise
  return new Promise(resolve => {
    setTimeout(() => {
      resolve('world'); // This is value of component
    }, 1000);
  });
}

Component itself don't declare what it needs (just function, remember?).

// file composite.js
// arguments is a values from other components
module.exports = function CompositeComponent(simple, withTimer) {
  return simple + ' ' + withTimer;
}

Notice all components don't know anything about Startup. Not tie all three together.

const startup = require('@slonoed/startup');
const SimpleComponent = require('./simple');
const ComponentWithTimer = require('./withTimer');
const CompositeComponent = require('./composite');

startup(
  [SimpleComponent],
  [ComponentWithTimer],
  [CompositeComponent, SimpleComponent, ComponentWithTimer]
).then(system => {
  // All components online
  // If you need value of component just pass it to system
  const value = system(CompositeComponent);
  console.log(value); // "hello world"
})

Passing simple values

You often need to pass not only components values but just values. For example, your component may want some config, or HTMLElement, or any other value. All you need is to pass it when start up your system.

function ConfiguredComponent(config) {
  console.log(config.env)
}

startup(
  [ConfiguredComponent, { env: 'development' }],
  ...
)
// "development"

Destroy system

When need to shut down system you need also shutdown all components. You can't just throw link away and rely on garbage collector, because your components can listen DOM events, wait for fetch request, keep socket connection alive an so on.

Startup allow you to shut down all components in reverse order with respect to async shutdown. Startup has special export called 'destroy'. It is a Symbol. If you component needs to be noticed on shutdown add shutdown function to a component value with this symbol as key. Example says more:

const destroy = require('startup').destroy;

function Component() {
  const handler = () => console.log('event!');
  document.addEventListener('click', handler);

  return {
    [destroy]: () => {
      document.removeEventListener('click', handler);
    }
  };
}

startup(
  [Component]
).then(system => {
  system.destroy(); // call it to destroy all components in reverse order
});

If shutdown function returns promise, Startup will wait until it resolves before kill other components.

API

TBD