Add solid adapter

[birkskyum]

This sets up the solid-pacer package, and examples, and docs

[changeset-bot]

🦋 Changeset detected

Latest commit: de8e88c

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 3 packages

Name	Type
@tanstack/react-pacer	Minor
@tanstack/solid-pacer	Minor
@tanstack/pacer	Minor

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[birkskyum]

@KevinVandy , can you see what the problem is for eslint here that make the test suite fail?

[KevinVandy]

Great PR. Don't know if you saw in this repos history, but I started out with a Solid adapter before I temporarily removed it a couple weeks ago to speed up the initial development. 8debd03

Your contribution is going to speed up the process a lot

[KevinVandy]

All package.json's need to have a unique package name in the monorepo, or else pnpm i and pnpm build will probably fail. The solid examples still seem to have the react examples' names.

[KevinVandy]

back when I was experimenting with making my own solid adapter, I think I had discovered that most of the code in the solid adapter would be unnecessary. Like it could be as simple as createAsyncDebouncer = () => new AsyncDebouncer(options)`

[pkg-pr-new]

More templates

• @tanstack/pacer-example-react-async-debounce
• @tanstack/pacer-example-react-async-rate-limit
• @tanstack/pacer-example-react-async-throttle
• @tanstack/pacer-example-react-debounce
• @tanstack/pacer-example-react-queue
• @tanstack/pacer-example-react-rate-limit
• @tanstack/pacer-example-react-throttle
• @tanstack/pacer-example-react-use-async-debouncer
• @tanstack/pacer-example-react-use-async-queuer
• @tanstack/pacer-example-react-use-async-queuer-state
• @tanstack/pacer-example-react-use-async-rate-limiter
• @tanstack/pacer-example-react-use-async-throttler
• @tanstack/pacer-example-react-use-debounced-callback
• @tanstack/pacer-example-react-use-debounced-state
• @tanstack/pacer-example-react-use-debounced-value
• @tanstack/pacer-example-react-use-debouncer
• @tanstack/pacer-example-react-use-queuer
• @tanstack/pacer-example-react-use-queuer-state
• @tanstack/pacer-example-react-use-rate-limited-callback
• @tanstack/pacer-example-react-use-rate-limited-state
• @tanstack/pacer-example-react-use-rate-limited-value
• @tanstack/pacer-example-react-use-rate-limiter
• @tanstack/pacer-example-react-use-throttled-callback
• @tanstack/pacer-example-react-use-throttled-state
• @tanstack/pacer-example-react-use-throttled-value
• @tanstack/pacer-example-react-use-throttler
• @tanstack/pacer-example-solid-async-debounce
• @tanstack/pacer-example-solid-async-rate-limit
• @tanstack/pacer-example-solid-async-throttle
• @tanstack/pacer-example-solid-create-async-debouncer
• @tanstack/pacer-example-solid-create-async-queuer
• @tanstack/pacer-example-solid-create-async-rate-limiter
• @tanstack/pacer-example-solid-create-async-throttler
• @tanstack/pacer-example-solid-create-debounced-signal
• @tanstack/pacer-example-solid-create-debounced-value
• @tanstack/pacer-example-solid-create-debouncer
• @tanstack/pacer-example-solid-create-queuer
• @tanstack/pacer-example-solid-create-rate-limited-signal
• @tanstack/pacer-example-solid-create-rate-limited-value
• @tanstack/pacer-example-solid-create-rate-limiter
• @tanstack/pacer-example-solid-create-throttled-signal
• @tanstack/pacer-example-solid-create-throttled-value
• @tanstack/pacer-example-solid-create-throttler
• @tanstack/pacer-example-solid-debounce
• @tanstack/pacer-example-solid-queue
• @tanstack/pacer-example-solid-rate-limit
• @tanstack/pacer-example-solid-throttle

npm i https://pkg.pr.new/TanStack/pacer/@tanstack/pacer@6

npm i https://pkg.pr.new/TanStack/pacer/@tanstack/react-pacer@6

npm i https://pkg.pr.new/TanStack/pacer/@tanstack/solid-pacer@6

commit: de8e88c

[birkskyum]

@KevinVandy there is something working here - not all, but quite a lot.

If we merge this, there will be docs, and we can easily browse the examples and fix the remainder.

[birkskyum]

I've removed the dependency arrays from memo/effect - maybe the Callback versions aren't necessary at all for solid, since the useCallback isn't there.

[KevinVandy]

I'll check out the PR and clean up som stuff. I'd like it to be mostly correct / on the right path before merging, or at least before releasing. We can merge and not release, but might as well work in this branch for a bit.

[birkskyum]

Sounds good - I imagine there are quite a few lambda wrappers that can be removed.

[KevinVandy]

I added 1 commit in the solid throttler area where I renamed and refactored some things to go in the correct direction. I won't be able to work on this again till tomorrow if you or someone wants to pick up the work again.

• simplify the useDebouncer and similar (createDebouncer) to just return a new instance directly
• "create" instead of use
• "signal" instead of state
• get rid of callbacks
• options in examples act as a constructor. To change options in a solid app, you must use the setOptions API in an effect or event.
• Morre changes in examples are needed like reading values from a queuer/debouncer, etc. in a render will need to use the onUpdate, or onGetNextItem callbacks to actually pull live values.

[birkskyum]

i opted for keeping the api surface intentionally, since it makes the docs easier to maintain, and they redirect correctly when you switch framework there - the use keyword is popular amongst all of react, vue and svelte 5 and solid, so it's nice to have solid just be the same as the more adopted frameworks, to avoid unnecessary migration steps for anyone giving solid a shot. It's also how things are done for solid in tanstack router (useParams, useSearch, useRouter ..) and query (useQuery, useMutation ..), store (useStore) and the "official" solid router (useNavigate, useMatch ..)

[KevinVandy]

@birkskyum Pretty happy with the refactors I've done here. Would love for you to take a look.

The solid adapted hooks now keep mirror state in signals now, so they are effectively reactive. Solid devs should not need to manually use the onUpdate, or onExecute callbacks unless they want extra side effects.

What's left to do in this PR?

1. Refactor AsyncQueuer and react/solid hooks the same way I just did for Queuer
2. Update JSDoc to be more accurate with all the new refactors. Solid JSDoc especially - (Markdown docs get auto generated by pnpm docs:generate from the jsdoc, so don't spend time modifying api reference md files)
3. Add a getOptions method to each class so that the solid hooks can call getOptions instead of initialOptions?.onUpdate()

[KevinVandy]

I need to update the changeset to document all the changes to pacer and react-pacer, but otherwise, this will be good to go tonight.