🏅
Sharp collection of tools for front-end development, created with performance in mind. 🗡
Our primary concerns are: maximum FPS and minimum bundle size 🚀
You can visualize it as a bag full of ninja tools for you to pick and use to tackle your front-end challenges.
It is meant to level-up and ease-in your web-development routines.
It's designed so that you can drop-in as much or as less you want, by importing just what you actually use, up to a single function level, so that your final bundle will stay slim.
It is always evolving and open to contributons from OSS peers.
It is not meant to replace the tools you already have, but rather offer battle-tested solutions to common routine tasks; sometimes it offers a cheaper alternative.
It does not impose choiches and integrates smoothly with frameworks you already use.
We strive to achieve affidability and affordability.
This way tree-shake and uglification can work at their best.
Being dependency-free you always know what you're using and can look it up in our API, no surpises.
We don't put something in until it is actually needed.
We strictly check for duplication and complexity, and take charge of some development pain in order to keep bundle size small.
Metrics matter, so our CI tools help us by enforcing 100% coverage and A maintainability.
No line makes it into master if the overall code quality gets degraded.
We could state that our API is 100% documented, but we still have no tests in place to back this metric up... so we don't 🤡
You can grab all Okiba Core packages by using npx installer:
npx @okiba/coreOkiba Core packages are not transpiled, so don't forget to transpile them with your favourite bundler. For example, using Babel with Webpack, you should prevent imports from okiba to be excluded from transpilation, like follows:
{
test: /\.js$/,
exclude: /node_modules\/(?!(@okiba)\/).*/,
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
}Array utils for okiba js
Utilities that operate on classes
Manages a DOM component, binds UI and recursively binds child components. Can be extended or instantiated
Utilities to work with dom elements and selectors
byId, qs, qsa, on, off, eventCoords, offset, getElements, matches, isChildOf, delegate, createCustomEvent
Emits drag events for all common pointers kinds (touch & mouse)
Collection of easings to alter a value
Emits events that can be listened and unlistened to. Allows for a catch-all event which is always triggered.
on, off, emit, hasListeners, destroy
A component that has events. Extends Component and composes with EventEmitter, inerithing both's method sets.
A collection of contextless utility functions
Collection of math functions
Manages a dinamically grown pool of DOM Elements import PoolSystem from '@okiba/pool-system'
constructor, ensure, get, free, destroy
Manages loading of resources trough fetch to boost caching. Transparently relies on a WebWorker if possible to load on a separate thread.
Search utilities
A store module to implement state management. It allows registering to prop updates, as well as any update trough the catch-all callback.
constructor, set, get, getState, setState, reset, clear, subscribe, unsubscribe
Maps progress ovrer time, normalized between 0 and 1
Set of useful functions to ease WebWorkers development