shun

playing with Nextjs

[shun @shunnode]

@ccssmnn @infinterenders @aidenybai @shivamhwp I understand this. just wanted to be sure we were saying the same thing

[shun @shunnode]

@mrchidipascal @richsongocrazy what what seriously boss

[shun @shunnode]

@ccssmnn @infinterenders @aidenybai @shivamhwp oh I get, event listeners that are not user triggered right?

[shun @shunnode]

@ccssmnn @infinterenders @aidenybai @shivamhwp you're joking right? 😂

[render @infinterenders]

useffect is a escape hatch react team mentioned it clearly in docs it steps outside reacts sandbox react is meant for deterministic nature as state-ui projection engine so entire arc relays on ui =f(state)

within reacts sandbox eveything is fine predictable, batched, and synchronized by the fiber scheduler moment you write useffect it’s outside of sandbox so reacts itself saying it’s not reacts fault everything is manual in your hand memory cleanup and sync that’s what escape hatch meaning :)

idk why people make useffect as a meme

[shun @shunnode]

@Devinda_me @infinterenders @aidenybai @shivamhwp very few people understand react the way he does

[shun @shunnode]

takes me time to read through and understand ( to an extent) all he's saying here so I just break the reply down in paragraphs and try reading on each.

takes vast level of experience to be this good at react ngl and that's where I aim for.

genius stuff

[render @infinterenders]

imo effect is great . but i feel using native react things are quite better for me this many sound weird all people hyped with effect i too love effect

but for remote data ingestion rsc’s + native promise streaming (use()) + suspense works for me and work for every kinda application

for state transmission (derived state ) never trigger a second render pass by updating state inside an effect when an existing prop or state shifts just compute the transformation inline on cpu during the initial render pass, optionally wrapping the calculation in useMemo to preserve structural references between execution frame

interactivity side effects localStorage writes, and API triggers directly inside your Event Handlers in the exact same V8 execution tick as your state mutations so it forces side-effects to be clean, atomic consequences of user actions, entirely eliminating reactive tracking loops so it look great

real time streams binding high-freq channels (WebSockets, Workers, SSE) straight to the framework scheduler using useSyncExternalStore (trust me it works ) it forces a synchronized memory handshake that eliminates data tearing and keeps your UI pinned to a locked so fucking great FPS rendering profile

go with direct dom manipulation just here drop standard post-paint checks for raw engine configurations (WebGL, Canvas, Observers)

use functional Callback Refs to grab the element pointer the exact microsecond the node hits the layout engine, running your initialization logic out-of-band before a single pixel is painted

react-fiber is greatest thing of all time idk people always think react it’s a templating thing lol it was never meant for being a template seen many tweets here they don’t understands how React leverages V8 exceptions to simulate algebraic effects, or how it batches to microtasks yielding to browser

this are thing would be replacement entirely rather then using effect it’s the choice of engineer at the end I want raw nature if the framework rather then using some great library which was loved by good good engg

browser view layer is inherently volatile and non-deterministic so effects feels over engineering for the problem we had at for view-layer

[shun @shunnode]

@Devvictor_ what's this all about? I mean the running process

[shun @shunnode]

@x_shipwChi i just read through the earlier conversations. I was misunderstanding you. no vex

[shun @shunnode]

@x_shipwChi well for me, Shakira's " Waka Waka " in 2010 was arguably the best

[shun @shunnode]

mutateAsync from TanStack Query exists for a reason, but I guess I found out about it much later, which means i would be refactoring this code later.

can already see how many fewer lines i would have had if I opted for mutateAsync

I learned a lot building this particular app

[shun @shunnode]

shadcn really did favor Controller with Field over FormField for React Hook Form. Don't know why though.

really fucked with the first approach though

[shun @shunnode]

turns out I had to ditch the Vercel AI SDK because the backend was streaming responses as SSE.

I had to write a new api route to serve as middleware also because for some reason I was getting CORS errors when sending messages.

Nextjs server -> Render and cors is gone

[shun @shunnode]

It looks good if you ask me. i had to paint out the brand name and logo, which explains the white spaces and gaps.

[shun @shunnode]

everybody loves react

[Devansh @thenowhereway]

Why has Vercel become the default hosting platform for vibe coders?

There are plenty of alternatives.

What made Vercel win?

[Ayọ̀ Ọlá Emmanuel @king_leo4u]

The difference in a junior software developer and a senior can be observed from how they declare variables.

Junior: var arsenalUCL = 0
Senior: const arsenalUCL = 0

[shun @shunnode]

you were watching another game

[-𝓌𝑜𝓁𝒻𝑔𝒶𝓃𝑔- @macxxxxx0]

@xxfw1da we were in charge of that game until that red card

[shun @shunnode]

@ginidika @evaetese @AdemoyeJohn I'm not there anymore

[shun @shunnode]

this tweet is the main cope

[-valar morghulis- @eldivine]

Arteta coached a master class and he almost won it. All you people's banter is just cope.

[shun @shunnode]

@mikedotwill @eldivine they have every right to banter you because you've not won a European trophy in your entire history. they have completed football before your eyes