3 years on

[mindplay-dk]

hey Garnet,

I was wondering, where did this project trail off? are you still coding? not much Github activity.

I really liked this idea and still end up on this page by various routes now and then.

last night, I kind of took the idea and ran with it - I have nothing that works, probably, haven't attempted to run anything, but I do have an interesting looking prototype of something that builds on your idea of explicit context passing... it seems like a good direction, but I don't know if I'm smart enough of have the time/energy to see it to completion. 😅

if you'd like to see some code, my DMs are open on Twitter. (I don't want to post this half baked idea in public yet.)

hope you're doing well :-)

[abhishiv]

hey @mindplay-dk

Do you mind sharing what your idea is here?

Background: I have been working on something similar to haptic, but a bit more complete with support for stores, SVG, dangerouslySetInnerHTML, ref, <Fragment>, <Portal /> and react-router like router. You can find it here with the kitchen sink here

In case you find it interesting I would love some feedback! I have been using it for simple low traffic marketing site, so it's mostly feature complete. The major thing which is missing is that <Each> implementation is a bit incomplete but I intend to fix it in the next few days.

https://github.com/abhishiv/alfama/blob/759c2f4a8fce708ec85deb83d84c66a430c73bcb/src/stdlib/Each/index.tsx#L92-L94

Btw, thanks a lot for opening up issues on haptic. It was a first for me, so I learned a lot from the discussions you had with nettybun. I really love open source software for this reason!

And ofcourse thanks @nettybun for the amazing work on haptic! It was really eye opening for me.

[mindplay-dk]

@abhishiv I have honestly no recollection of what I was doing in february. Going by the date, it might have been this, which lead me into this, although it may have started somewhere different, I just don't recall...

This is probably closer to RxJS than to Haptic though - I was trying to understand RxJS with those explorations, and I remember thinking, the resulting pattern sort of resembled Haptic's explicit context passing, although in my half baked code, the $ thing isn't a "token", but actually an "entangled" pipe function bound to a context-specific teardown signal/effect. The idea being that, when components would create signals or apply operators/listeners, they would call this context-specific pipe function, which would implicitly apply a teardown operator. I was following (or at least trying to) the RxJS approach and trying to be "purely functional".

I wonder how similar it is to what you've built, in practice? 🙂

[abhishiv]

Hey @mindplay-dk, sorry was late reply, since I was busy fixing my Each implementation.

ah interesting! I haven't used RxJS so am not sure with its paradigm, but I do get a concern with teardown.

I think I handle teardown by having users create signals and stores not by a top level imported function as is common, but by a function passed as 2nd param to component definition. They are then saved in the VElement tree and cleaned up when component unmounts.

export const HomePage = component<{ name: string }>(
  "HomePage",
  (props, { signal, wire }) => {
    const $count = signal("count", 0);
  }
);

Also the signals/stores and components are named because I wanted real first class HMR and that makes it super easy to hydrate/rehydrate on hot reload while preserving state.