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

tinar

v0.0.3

Published

🍉 Light-weight MobX like date management library

Downloads

3

Readme

Install

$ yarn add tinar

Motivation

Proxy is an awesome feature feature of ES2015. Base on it, we can do meta-programming and hijack object's native operations easier and more seamless. Tinar is a state manage library based on Proxy and inspired by awesome MobX.

Concept

  • Just Like MobX, the object Tinar return is not a plain object, but an Observable or Computed object which is hijacked by Proxy. All get and set operations are hijacked, which makes it possible to collect dependencies on trigger reactions.
  • A very important issue is that the Computed value needs to be triggered when it is actually updated. Many lightweight class MobX libraries don't implement it, which causes repeated reaction triggers. Tinar start a transaction with the call to set and the function(AOP by Proxy). The reaction triggered in the transaction will not be invoked immediately, but staged and there will only be one copy in stash. And at the end of the outermost transaction, all the reactions will be triggered.
  • Although some test cases have been added, Tinar is still in a prototype phase and needs tinar-react and Devtools.
  • Feel free to leave any message in the issue.

中文:

  • 就像 MobX 一样,Tinar 返回的对象并不是一个 plain object,而是通过 Proxy 代理的一个 Observable 或者 Computed 对象,所有的 get set 操作都会被劫持,这也使得收集依赖于触发反应成为了可能。
  • 有一个很重要的问题就是 Computed 值需要在真正更新时再触发,很多轻量的类 MobX 库没有做到这一点,这会导致重复的反应触发,Tinar 通过对 set 与函数调用的开始与结束进行事务操作,在事务中触发的 reaction 会被暂存而不会触发,并且只会有 one copy,在最外层事务结束的时候,再去触发所有的 reactions。
  • 尽管添加了一些测试样例,但是 Tinar 还处于一个原型阶段,还需要 tinar-react 和 Devtools
  • 欢迎在 issue 中畅所欲言。

Usage

Making things observable

  • [x] observable
  • [x] @observable
  • [x] objects
  • [x] arrays
  • [ ] maps
  • [ ] boxed values
  • [ ] decorators

Reacting to observables

  • [x] computed
  • [x] @computed
  • [x] autorun
  • [x] when
  • [x] reaction
  • [x] @observer

Changing observables

  • [x] action
  • [ ] async actions & flows
  • [ ] Object api

Utility functions

  • [x] toJS
  • [ ] extendObservable
  • [ ] createAtom
  • [ ] intercept & observe

Others

  • [ ] Devtools