Live data from Hacker News

UseHooks – A Collection of Server Component Safe React Hooks

usehooks.com

51–60 of 62 posts

Re: UseHooks – A Collection of Server Component Safe React Hooks

#51
post #34

How telling is it that a basic core function like useFetch has a warning that it “depends on React’s experimental useEffectEvent”? Almost a decade later and simple data fetching is still an unsolved “problem” in React land.

I can’t seem to even find useFetch in the source….

It's not ideal, but on the website if you open the sources you can search for them (You'll need to click on the hook first so it loads the demo). However they're not typed of course. On Chromium it's just control+p then useFetch and you should see it.

Re: UseHooks – A Collection of Server Component Safe React Hooks

#52
post #17
post #4

I think it's great to have a repo of all the hooks, but I wonder if implementing each from scratch is the right approach. For example, there is an exceptional useDebounce package [0] that handles many more cases than the simplified one on UseHooks, and I think it could be even more useful to highlight exceptional work that has already been done and maintained in the community rather than in-housing everything. I also…

I don’t want to pull in one package for every little piece of functionality. I prefer a package, that includes a bigger set of hooks that I can use. For example like date-fns for date/time.

This. In combination with tree shaking, I think this approach covers most of the use cases.

Re: UseHooks – A Collection of Server Component Safe React Hooks

#53

Earlier quoted context omitted.

react is a rendering engine, not a framework; there is no opinionated way to fetch data. react-query is a delightful library that has made data fetching/cacheing a breeze for me - https://tanstack.com/query/v3/docs/react/overview

This may very well change. I won't be surprised to see react have to become more opinionated about days fetching now that they are dancing between client and server with some form of an rpc. For performance and security I could see them pushing for all data loading to be done on the server, complete with helpers and server-only hooks for fetching and streaming data from the server.

> This may very well change. I won't be surprised to see react have to become more opinionated about days fetching

This is already happening, as I understand it they're even going as far as monkey-patching the Fetch API: https://nextjs.org/docs/app/building-your-application/data-f...

(But maybe let's leave discussion on that particular approach to different posts, we're going off-topic enough as it is.)

Re: UseHooks – A Collection of Server Component Safe React Hooks

#54
post #17

Earlier quoted context omitted.

I don’t want to pull in one package for every little piece of functionality. I prefer a package, that includes a bigger set of hooks that I can use. For example like date-fns for date/time.

I agree with you. We will actually start playing around with use hooks. One package that has multiple utilities maintained by one entity is great. When you have multiple dependencies from multiple entities in your code, the surface area for supply chain attack is larger.

It's not just about supply chain attacks. It's also about convenience and practicality. After a few months or years there will be some major dependency version updates to do, and often there is some manual work associated with that. Maybe reading changelogs and documentation, or checking if the package is still maintained and looking for alternatives. Doing that for 5 packages is reasonable, doing it for 20 or 30 packages is a liability.

Re: UseHooks – A Collection of Server Component Safe React Hooks

#55
post #49

I saw `useDebounce` and thought "what the hell does debounce have anything to do with react render cycle?". When I check the code, `useDebounce` does... I don't even know what it does, delayed set state? https://github.com/uidotdev/usehooks/blob/380e83fa267157832e...

If you have state that changes too quickly (like the value of an input field), then you can use `useDebounce` to derive a state that only changes every `n` milliseconds.

Re: UseHooks – A Collection of Server Component Safe React Hooks

#56

Earlier quoted context omitted.

react is a rendering engine, not a framework; there is no opinionated way to fetch data. react-query is a delightful library that has made data fetching/cacheing a breeze for me - https://tanstack.com/query/v3/docs/react/overview

That ceased to be true long ago. How do you use native fetch() with a functional component achieving correct/expected behaviour? It’s not possible without buying into react’s [very opinionated] hooks. In fact, the toolbox this whole HN entry is about is a great example of how React is not just a rendering engine. It wouldn’t even be necessary otherwise. Peek at the code and what you’ll see is intense use of a DSL and…

I'm quite experienced with React itself (and have given RSC a spin more recently) - but I've been trying to understand, aside from using a top-level `await fetch` in a server component, is there a possible route to implementing this in client components themselves? Without using a useEffect to call the fetch and populate state with a DIY / ReactQuery style error/loading/component, that is.

My understand was previously that it wasn't really feasible, but seeing the RSC additions (as well as Next's own explorations into calling Server-side code from client components) I was wondering if it wasn't just avoided to go the route away from hooks since they're such a large 'caveat' already that it's only worth doubling down on them.

Re: UseHooks – A Collection of Server Component Safe React Hooks

#58

I don’t understand why this should be distributed as a package of many hooks. Unless if a hook is unusually complicated, I much rather copy-paste it into my code. You should really share the implementations of each of them on the website. I don’t want to pull in 100 hooks just because I don’t want to write 1 from scratch.

I like how TailwindUI does it. Provides nice examples/source code and easy to copy/paste

Re: UseHooks – A Collection of Server Component Safe React Hooks

#59

Earlier quoted context omitted.

I don't blame you for this. The React team recently talking about "React Server Components" as though most React users are running it on NodeJS backends and introducing magic "use client" strings is putting everyone in a confused position and I don't think there's a good phrasing for you.

Something like "compatible for server-side rendering in non react server components" :) And people suggest juniors to start on the front-end because it's less complicated...

I've read "Server component safe" and thought that doesn't make sense from the get go. It's 100% only bad communication here

Re: UseHooks – A Collection of Server Component Safe React Hooks

#60
post #44
post #39

I strongly dislike having to think about the color of functions while I’m programming. I want the type system to know

Are you referring to this https://journal.stuffwithstuff.com/2015/02/01/what-color-is-... ?

Yeah vaguely
Post reply on HN