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

batis

Package Overview
Dependencies
Maintainers
1
Versions
32
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

batis

General reactive JavaScript programming using the idea of React Hooks.

  • 14.0.0
  • latest
  • Source
  • npm
  • Socket score

Version published
Weekly downloads
4
decreased by-63.64%
Maintainers
1
Weekly downloads
 
Created
Source

batis

General reactive JavaScript programming using the idea of React Hooks.

Introduction

Even though React Hooks are actually a constrained solution for using state and managing side effects in functional stateless components, they have proven to be very elegant in their design. I wanted to use this kind of reactive programming in areas other than React development, so I wrote Batis.

Batis essentially revolves around the concept of a Hook and its host. Running a functional stateless Hook requires a host that manages the state and effects and reports asynchronous state changes that should result in a new run.

Installation

npm install batis

Usage

import {Host, useEffect, useLayoutEffect, useMemo, useState} from 'batis';
function useGreeting(salutation) {
  const [name, setName] = useState(`John`);

  useLayoutEffect(() => {
    setName(`Jane`);
  }, []);

  useEffect(() => {
    // Unlike React, Batis always applies all state changes, whether
    // synchronous or asynchronous, in batches. Therefore, Janie is not
    // greeted individually.
    setName(`Janie`);
    setName((prevName) => `${prevName} and Johnny`);

    const handle = setTimeout(() => setName(`World`), 0);

    return () => clearTimeout(handle);
  }, []);

  return useMemo(() => `${salutation} ${name}!`, [salutation, name]);
}
const greeting = new Host(useGreeting);

console.log(greeting.run(`Hi`));
console.log(greeting.rerun());

greeting.reset();

console.log(greeting.run(`Bye`));
console.log(greeting.rerun());

await greeting.nextAsyncStateChange;

console.log(greeting.run(`Hello`));
[ 'Hi Jane!', 'Hi John!' ]
[ 'Hi Janie and Johnny!' ]
[ 'Bye Jane!', 'Bye John!' ]
[ 'Bye Janie and Johnny!' ]
[ 'Hello World!' ]

API reference

The React Hooks API reference also applies to this library and should be consulted.

Implementation status

Below you can see the subset of React Hooks implemented by Batis:

React HookStatus
useState✅Implemented
useEffect✅Implemented
useLayoutEffect✅Implemented
useMemo✅Implemented
useCallback✅Implemented
useRef✅Implemented
useReducer✅Implemented
useContext❌Not implemented
useImperativeHandle❌Not implemented
useDebugValue❌Not implemented

FAQs

Package last updated on 26 Mar 2023

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