Meta tags:
description=Today s Talk explores the use of the useEffect hook in React development, covering topics such as fetching data, handling race conditions and cleanup, and optimizing performance. It also discusses the correct use of useEffect in React 18, the distinction between Activity Effects and Action Effects, and the potential misuse of useEffect. The Talk highlights the benefits of using useQuery or SWR for data fetching, the problems with using useEffect for initializing global singletons, and the use of state machines for handling effects. The speaker also recommends exploring the beta React docs and using tools like the stately.ai editor for visualizing state machines.;

Headings (most frequently used words):

use, and, effects, effect, fetching, with, data, in, useeffect, to, handling, using, effectively, faq, comments, introduction, race, condition, cleanup, react, 18, correct, understanding, action, executing, event, handlers, exploring, misuses, of, optimizing, query, 10, problems, 11, state, machines, 12, tools, for, real, world, 13, linting, rules, alternatives, 14, discussion, conclusion, check, out, more, articles, videos, workshops, on, related, topic, subscribe, the, top, dev, conferences, available, other, languages,

Text of the page (most frequently used words):
and (256), the (255), you (174), react (167), use (141), that (136), this (115), #effects (98), for (84), effect (75), state (68), with (64), like (59), but (53), going (52), are (51), about (44), not (44), what (44), have (43), your (41), using (40), when (39), all (37), just (35), #fetching (34), then (34), useeffect (33), know (32), where (32), event (31), more (29), rendering (29), data (28), here (28), because (27), don (26), which (26), performance (25), really (25), can (24), there (24), they (23), how (23), right (23), one (23), talk (23), hook (21), david (21), need (20), some (20), docs (20), action (20), learn (19), will (19), let (19), 2026 (18), get (18), was (18), should (18), something (18), advanced (17), think (17), could (17), instead (17), top (16), change (16), now (16), might (16), put (16), want (15), management (15), hooks (15), next (15), content (15), query (15), short (15), component (15), doing (15), lot (14), way (14), side (14), description (14), directly (14), inside (14), development (13), workshop (13), min (13), these (13), okay (13), sort (13), fetch (13), activity (13), new (12), from (12), components (12), only (12), server (12), things (12), did (12), forget (12), very (12), dependency (12), handlers (12), much (11), those (11), into (11), developers (11), also (11), yeah (11), machines (11), example (11), start (11), thing (11), execute (11), cleanup (11), handler (11), code (10), summit (10), little (10), flashlist (10), why (10), make (10), out (10), see (10), concurrent (10), well (10), render (10), handling (10), stately (10), happen (10), trigger (10), over (10), events (9), tools (9), api (9), first (9), work (9), global (9), time (9), remix (9), actually (9), good (9), outside (9), read (9), beta (9), even (9), 2027 (8), our (8), best (8), web (8), people (8), together (8), keep (8), issues (8), most (8), better (8), user (8), memo (8), everything (8), problem (8), problems (8), them (8), stuff (8), again (8), set (8), prop (8), indirection (8), move (8), same (8), london (7), practices (7), typescript (7), before (7), had (7), simple (7), mode (7), benefits (7), handle (7), didn (7), pinia (7), store (7), idea (7), doesn (7), redux (7), slides (7), thank (7), bit (7), reducer (7), functions (7), say (7), guess (7), avoid (7), video (7), ref (7), race (7), shouldn (7), library (6), subscribe (6), vue (6), three (6), featured (6), 2021 (6), complex (6), profiler (6), optimizing (6), many (6), understanding (6), used (6), behavior (6), synchronization (6), would (6), try (6), until (6), around (6), app (6), any (6), logic (6), source (6), framework (6), check (6), array (6), form (6), possible (6), focus (6), gonna (6), basically (6), remember (6), transitions (6), declarative (6), executing (6), putting (6), cache (6), infinite (6), imperative (6), caused (6), learned (6), corschied (6), conditions (5), berlin (5), day (5), edition (5), talks (5), devtools (5), two (5), part (5), show (5), performant (5), still (5), built (5), props (5), build (5), 2022 (5), full (5), applications (5), load (5), actions (5), optimize (5), ivan (5), other (5), too (5), won (5), has (5), stores (5), value (5), real (5), different (5), without (5), great (5), maybe (5), add (5), does (5), external (5), rules (5), depending (5), indicate (5), wanted (5), executed (5), playing (5), whole (5), sure (5), feels (5), condition (5), strict (5), isfocused (5), authors (4), core (4), dev (4), free (4), native (4), today (4), list (4), team (4), dive (4), based (4), ways (4), look (4), changes (4), potential (4), explore (4), understand (4), building (4), back (4), few (4), later (4), who (4), future (4), discusses (4), meta (4), open (4), create (4), com (4), guide (4), old (4), such (4), double (4), effectively (4), online (4), twitter (4), piano (4), actual (4), probably (4), tool (4), machine (4), promise (4), editor (4), questions (4), thinking (4), approach (4), submit (4), hey (4), early (4), linting (4), lint (4), said (4), nice (4), summary (4), imagine (4), types (4), goes (4), favorite (4), works (4), loading (4), true (4), wrong (4), twice (4), call (4), waterfalls (4), cetera (4), reason (4), misuse (4), happens (4), while (4), watching (4), documentation (4), arrays (4), tip (4), gitnation (3), terms (3), support (3), feedback (3), faq (3), tech (3), conferences (3), sign (3), updates (3), may (3), coding (3), oct (3), york (3), nov (3), upcoming (3), follow (3), workshops (3), testing (3), quality (3), node (3), popular (3), articles (3), discover (3), driven (3), both (3), key (3), along (3), tips (3), take (3), etc (3), plugins (3), fix (3), deep (3), class (3), often (3), simpler (3), improve (3), pros (3), remote (3), suspense (3), long (3), easy (3), topics (3), end (3), their (3), utilize (3), 2023 (3), debugging (3), were (3), random (3), help (3), close (3), step (3), hear (3), solution (3), process (3), custom (3), compiler (3), elimination (3), offers (3), version (3), kent (3), rather (3), than (3), examples (3), eliminate (3), solve (3), html (3), transcription (3), looking (3), uso (3), efectivo (3), available (3), cool (3), says (3), closed (3), question (3), play (3), pretty (3), alternatives (3), supposed (3), arguments (3), request (3), down (3), through (3), feel (3), world (3), post (3), official (3), honestly (3), talked (3), least (3), transition (3), screen (3), false (3), setting (3), type (3), talking (3), initializing (3), singletons (3), done (3), run (3), recommend (3), dan (3), function (3), whatever (3), spinners (3), notice (3), swr (3), whenever (3), big (3), subscribing (3), rid (3), parts (3), tell (3), onopen (3), onclose (3), course (3), loop (3), highlights (3), total (3), makes (3), saying (3), common (3), loops (3), though (3), causes (3), every (3), forward (3), fire (3), ongoing (3), off (3), capital (3), signs (3), missing (3), calls (3), mounts (3), discovered (3), recommends (3), async (3), 2018 (3), syntax (3), excited (3), visualizing (3), khourshid (3), nation (2), stats (2), product (2), amsterdam (2), jsnation (2), singapore (2), apr (2), asia (2), dec (2), insights (2), conference (2), css (2), builders (2), founders (2), javascript (2), tags (2), multipass (2), main (2), test (2), reactjs (2), wildly (2), thus (2), supported (2), increasingly (2), find (2), topic (2), getting (2), ide (2), tdd (2), created (2), shopify (2), flatlist (2), flipper (2), teach (2), cover (2), cases (2), presentation (2), write (2), introducing (2), quite (2), functional (2), each (2), various (2), versus (2), usereducer (2), maurice (2), beijer (2), release (2), finally (2), affect (2), application (2), switch (2), interactive (2), adventures (2), techniques (2), needed (2), rendered (2), between (2), ssr (2), including (2), implement (2), mutation (2), seo (2), overall (2), debug (2), slow (2), interaction (2), chrome (2), clicking (2), frustration (2), times (2), solutions (2), usememo (2), suited (2), engineers (2), already (2), familiar (2), covering (2), word (2), masterclass (2), challenges (2), discussed (2), introduced (2), break (2), aims (2), explores (2), automatically (2), dependencies (2), dead (2), idiomatic (2), allows (2), error (2), recommended (2), per (2), efficient (2), compared (2), beyond (2), live (2), dodds (2), concept (2), introduces (2), importance (2), uses (2), easier (2), constantly (2), frameworks (2), focuses (2), provides (2), functionality (2), websites (2), videos (2), posted (2), ever (2), contributing (2), yes (2), contribute (2), once (2), weird (2), visualize (2), slide (2), containers (2), press (2), button (2), point (2), gets (2), far (2), crash (2), answer (2), thoughts (2), rule (2), become (2), job (2), blog (2), resource (2), order (2), ensure (2), mean (2), watch (2), ask (2), sli (2), software (2), beautiful (2), wrap (2), last (2), having (2), telling (2), purpose (2), declaratively (2), expressing (2), mini (2), toggle (2), haven (2), bigger (2), checking (2), second (2), listening (2), ending (2), looks (2), send (2), maintain (2), biggest (2), submitting (2), bunch (2), abstract (2), another (2), place (2), calling (2), flag (2), stick (2), screaming (2), everywhere (2), chasing (2), unloading (2), soon (2), kill (2), guarantee (2), beginning (2), interesting (2), specific (2), whether (2), usesyncexternalstore (2), maintainers (2), libraries (2), isopen (2), calculating (2), anyway (2), communicating (2), parents (2), transforming (2), items (2), derived (2), values (2), called (2), sections (2), longer (2), exploring (2), result (2), sorry (2), tried (2), single (2), seen (2), equals (2), possibility (2), impossible (2), multiple (2), input (2), fancy (2), lifecycle (2), specifically (2), listen (2), turn (2), onsubmit (2), tie (2), closer (2), tying (2), unmount (2), realized (2), exec (2), breaks (2), conditionals (2), conditional (2), hoc (2), correct (2), dance (2), canceled (2), copy (2), paste (2), worked (2), however (2), crucial (2), empty (2), aws (2), yelled (2), await (2), wow (2), hello (2), everyone (2), name (2), within (2), running (2), sentry (2), october (2), rights, reserved, community, conduct, privacy, policy, legal, rss, feeds, assistance, promote, contact, careers, company, techlead, conf, adopting, orgs, nyc, sponsor, grow, depth, engineer, leader, teams, experts, companies, miss, deal, discounted, tickets, newsletter, design, systems, fullstack, frontend, svelte, mentors, menu, given, quickly, hard, accurate, learning, materials, jetbrains, ides, combination, series, meaning, steps, productive, projects, emphasize, tricks, paul, everitt, 174, minimum, effort, own, benchmarking, notch, quick, migrating, teaching, utilizing, provided, mainly, usebenchmark, flame, graph, lists, fps, gettype, sample, tasks, uncover, addition, major, almost, deceptively, plenty, mess, turns, cons, usestate, usecontext, efficiently, uselayouteffect, 177, awaited, upgrade, yet, aware, subjects, join, laptop, suspenselist, starttransition, 132, nextjs, delve, concepts, empower, harness, hands, equipping, skills, high, informed, architectural, decisions, able, role, differentiate, edge, runtime, project, requirements, streaming, parallel, sequential, caching, strategies, enhanced, reduced, social, sharing, discoverability, engagement, adrian, hajdin, 157, debugger, attempts, chaotic, optimization, trying, optimizations, found, gave, recording, poke, minutes, knows, exactly, pinpoint, bottleneck, repeat, several, regular, comes, analyze, note, speed, lighthouse, akulov, 170, related, placing, asynchronous, demonstrates, extracting, fixing, optimistic, showcased, mutations, concludes, invitation, nozzle, tanner, linsley, 2020, client, memoization, vision, determine, named, pun, builds, enable, plans, focused, ensuring, its, limited, transitioning, significant, centralized, compatible, providing, extensibility, similar, vuex, less, verbose, powerful, inspection, file, organization, rex, eduardo, san, martin, morote, solving, tree, avoiding, creating, prematurely, tesla, electric, engine, illustrate, emphasizes, trade, offs, taking, path, evaluate, approaches, creator, epicweb, epicreact, testingjavascript, router, fundamentals, accessibility, flexibility, delivers, automatic, updating, styles, features, login, session, enhance, sites, require, basic, documents, flexible, technologies, stacks, training, michael, jackson, brief, explains, comparing, elements, pure, covers, batching, context, valuable, replay, mark, erikson, spark, git, interest, skill, stellar, career, languages, expand, timeout, wait, minute, timeouts, contribution, shifting, fiber, unapproachable, devs, fair, planted, discussion, conclusion, bundle, isn, reduce, likes, killing, mentioned, indicating, middleware, runs, sounds, depend, initiates, coming, fill, initiating, passed, caring, definitely, cheers, meant, states, love, gal, overcomplicate, notes, conscious, blabbing, stop, reading, during, couple, amazing, please, office, fascinating, funny, appreciate, 2124, usual, lazy, keynote, super, plus, customize, magic, present, offline, technically, gives, visual, tangle, mind, absolutely, presentations, provide, resources, xseed, afterwards, declare, brilliantly, pausing, xstate, standard, thumbnail, click, videoref, pause, previous, escape, zushan, similarly, consider, closing, variables, indirect, extra, isolating, easily, starts, authenticate, red, entire, internally, window, undefined, conditionally, scream, inject, story, instant, initial, parent, child, clients, prefetch, subject, acts, rfc, google, kidding, shipped, important, means, tutorials, feature, prevents, unnecessary, avoids, reasons, likely, loader, hopefully, counter, subscriptions, connected, unsubscribe, local, variable, getsnapshot, snapshot, date, brilliant, fired, seeing, preact, signal, ahead, sync, changing, lots, becomes, straightforward, cause, leading, never, default, warn, view, number, sense, section, especially, ones, ooh, thankful, exist, org, header, years, ago, commonly, case, option, arise, additionally, prevent, misuses, spicy, clean, sight, extremely, disable, explanation, offscreen, lose, isfocus, refactor, consume, grab, screenshotting, being, guy, recommending, intently, subscription, stream, head, lettuce, explicitly, care, brexit, listener, resize, mouse, anymore, activities, television, matter, channel, imposing, turning, bbc, cut, person, stopped, awkward, reality, alternative, mental, model, helps, ability, tied, completely, refactoring, give, link, specify, particular, difference, refers, confusing, duration, happening, looked, saw, mount, simulating, remounting, wondering, heck, digging, threads, felt, defective, calmed, researched, surprise, tale, environments, eviction, symptoms, themselves, littered, throughout, telltale, someone, torys, simulates, remount, incorrect, lesson, decide, cast, resolve, cancel, ignored, totally, fine, ids, cancellation, mechanism, proper, others, initially, scrolled, information, current, skipping, since, sideways, agonized, developer, void, fetched, happened, fail, occur, cannot, infer, promises, return, 2015, thought, figured, failed, due, continuous, adding, comprehensive, came, admit, convenient, life, cycle, making, bulky, classes, matice, him, npm, modules, talented, yesterday, asked, 100, confident, hell, remembers, showing, shortly, enough, prime, minister, simplifies, introduction, shortened, español, distinction, usequery, speaker, jan, nicely, explained, natalia, comment, register, comments, share, include, execution, causing, additional, complexity, face, offer, methods, managing, processes, watched, typically, handled, preventing, primarily, suggesting, certain, been, presented, latest, codebase, negatively, fighting, apis, sources, honest, demystify, maintainable, apps, started, crashes, slowdowns, regressions, prod, seer, unifies, traces, replays, errors, profiles, root, fast, faster, promoted, rate, bookmark, diving, shown, ticket, holders, english, log,

Text of the page (random words):
hen you try to go back because components are going to try to load again no initial html content so you re going to have even more loading spinners and you re chasing waterfalls because the parent s going to load and when that s unloading the child s going to load when that s unloading et cetera et cetera and so you want to avoid those things okay so another thing you don t need use effect for initializing global singletons so here s what i mean let s say we ve done this a lot where we execute some sort of effect right when our app starts and so we re like use effect is the right place for effects so we re calling this store api authenticate but we know that in react 18 this is going to run twice so instead we use a ref and we say hey did this already run maybe not but this is honestly sort of a red flag so i recommend you not do it so instead of using a ref we could just stick that outside but guess what why don t we just stick the entire thing outside look how simple that is a lot of you might be internally screaming this is something that dan recommended on twitter so i feel okay putting this on the screen but if you re using next you can check if type of window is undefined or not and call it conditionally like that and if you re going to scream about testing just wrap it in a function you know you could even inject that story api do whatever you want to do you know just do it outside of the component and then the biggest one for me you don t need use effects for handling user events and so this goes to activity effects versus action effects so now we re talking about action effects so in this one we are submitting a form and we re setting all of these variables so set is loading is true set the form data to the event and so that s going to be indirect and trigger a change this is wrong what you should do is move it inside of the event handler so move it inside of submit and then you know you might need to add a whole bunch of extra logic but because you re not using use effect and you re isolating it to that event handler you could easily abstract that to a hook 11 handling effects with state machines 20 54 short description my favorite type of hook is use reducer it s a library i maintain it works similarly to redux let s consider a bigger example where we have a cool video we use three use effects to handle various actions such as playing ending and closing the video by thinking in terms of declarative effects and using a state machine we can execute effects directly on transitions my favorite type of hook looks like this where you have a state and a send and all you have to do in your components is send events this is use reducer this is x day it s a library i maintain this is redux zushan sort of works the same way yeah but so here is a bigger example i wanted to just make this cool video where it s a thumbnail but when you click it it goes full screen and then there s many ways to close it there s three use effects that are handling this so the first one we are checking is playing and so if we are playing the videoref is you know we have to play it or we have to pause it if it s not the second one we are listening for the video to end and if it s not ending then we have to set is playing to false and remember this is going to trigger some indirection it s going to trigger the state s change and then the state is going to trigger the previous effect and the same thing over here when we press the escape key again we are setting is playing to false and now we have a little bit of cleanup too so the way i like to think about these instead in terms of declarative effects is by using a state machine and no i m not going to talk about xseed in this talk but you can talk to me afterwards about it so with state machines you declare the effects that are going to execute directly on the transition and i think this is brilliantly simple so for example when we re in mini and we transition to full we re doing it on a toggle and we play the video same thing when we re going from full to mini we go from toggle and we re pausing the video and then we do the transition so if you haven t used xstate just imagine this as redux or your standard reducer imagine if you could execute effects directly inside of your reducer it s basically the same idea 12 effects and tools for real world use 22 40 short description imagine executing effects directly inside your reducer state machines are purpose built for declaratively expressing effects action effects go in state transitions executed around the same time as event handlers use effect is for synchronization activity effects go in use effects action effects go in event handlers render as you fetch and state transitions trigger effects thank you all you can ask questions on sli do i use slides com for my beautiful presentations let s talk about tools for real world use watch my talks read the beta react docs and avoid the old docs they provide resources and examples of when not to use use effect imagine if you could execute effects directly inside of your reducer it s basically the same idea i really like this because it really gives you a visual way and a declarative way of thinking about all of your effects without having to just tangle your mind and think okay when is this effect going to execute i have absolutely no idea so yeah this is just my way of telling you to start looking into i guess state machines because state machines are purpose built for declaratively expressing all of these types of effects so in summary or not summary but where do action effects go not really event handlers but technically they do go in state transitions which happen to be executed at around the same time as event handlers now i don t have much time so let s wrap up with a summary use effect is for synchronization activity effects go in use effects action effects go in event handlers you should render as you fetch and last but not least state transitions trigger effects so with that said i want to thank you all very much amazing please step into my office thank you so much david that was fascinating and also very funny which i appreciate remember you can ask questions on the sli do the code is 2124 as per usual the people want to know what presentation software are you using because it s beautiful this is slides com because i m too lazy to learn keynote also slides com is super easy plus you can customize it with css they have that magic move thing too it s really nice and present offline that s what i use oh yes let s talk about effects i love a you might not need concept because i m a simple gal i don t like to overcomplicate things but if i wanted to take all of this into say the real world a team a job are there any tools we could use some linting some notes a blog post any sort of resource in order to ensure we re conscious of these things good question i mean i guess you could watch my talks but then they re gonna be like oh this is just david blabbing on about use effects so i ll write a blog post about it the official react docs the beta docs honestly stop reading the old docs read the beta docs those are gonna be the resource for basically everything i talked about during this talk and they even have a couple more examples of where you should not use a use effect 13 linting rules and fetching alternatives 25 24 short description as far as linting rules just let react 18 make your app crash in development what are your thoughts on the lint rule that says not to put functions in your event handlers don t add lint rules until they become a problem when depending on arguments for your request start fetching as early as possible react rendering is not about events but rather the user or external actions usereducer and redux are state containers not meant for fetching effects with state machines indicate new states and the effects to happen so definitely read through that as far as linting rules just let react 18 make your app crash in development and be like oh why d that happen probably a use effect i feel like i know the answer to this but what are your thoughts on that lint rule that s like don t put functions in your event handlers don t put how about don t add lint rules until they actually become a problem how s that that s great cheers for that all right we have a few questions all right fetch as you render sounds good until you depend on arguments for your request what is the best approach then well think about when those arguments happen the user probably initiates it or it s coming from an outside source so for example the user might press a button might fill out a form and then when they submit a form that point where they submit a form that s when you should be initiating the request what a lot of react developers do is they ll submit a form that gets set to state or that gets passed down as a prop to a component and then the component s like oh hey i have a prop now i can read that prop and fetch data based on that prop but there is a lot of indirection there so start fetching as early as possible you re going to learn that react rendering is not an event or it s not the events that you should be caring about the user actually doing stuff or some external thing doing stuff that s what you have to focus on there s a lot of questions and i m going to sort of bundle them together about all the alternatives so isn t use reduce good for fetching or do you think we re going to use redux again or when would you use use effect without a dependency array what about use event all the uses so use event s dead you know react likes killing stuff so yeah what were the other alternatives things like all right use reducer redux etc these are state containers they re not really ways that you would fetch effects but like i mentioned you know with state machines you should be thinking about when your state changes you should have some sort of way of indicating this is a new state and these are the effects that are supposed to happen a lot of times when we think about it we re like here s a new state and then we have some middleware that runs where it s like okay maybe i ll fetch 14 discussion and conclusion 27 51 short description but i think that both of those should go together what tool did you use to visualize the state machine in your slide it is a stately ai editor did you ever think about contributing to the react docs i did contribute once their actual source code might as well be closed source great talk are your slides going to be posted online follow david on twitter at david k piano thank you david but i think that both of those should go together thank you david what tool did you use to visualize the state machine in your slide good question not a planted question i promise it is a stately ai editor it s free to use play around with it it s really pretty yeah okay one more oh actually maybe two more did you ever think about contributing to the react docs yes so i did contribute to the react docs once because they had used timeout ms that was for a very very old suspense api but i was like wait a minute it just says use timeouts in the docs i could add that little ms to the side that was my first react contribution because their actual source code might as well be closed source there s like bit shifting and all of these weird fiber stuff and i m like that is very unapproachable for any dev who does not work at meta and probably most devs who work at meta that s fair and then finally great talk are your slides now or later going to be posted online yeah cool follow david on twitter at david k piano david k piano thank you david thank you expand available in other languages en using useeffect effectively es uso efectivo de useeffect check out more articles and videos we constantly think of articles and videos that might spark git people interest skill us up or help building a stellar career a guide to react rendering behavior react advanced 2022 25 min a guide to react rendering behavior top content mark erikson replay io this transcription provides a brief guide to react rendering behavior it explains the process of rendering comparing new and old elements and the importance of pure rendering without side effects it also covers topics such as batching and double rendering optimizing rendering and using context and redux in react overall it offers valuable insights for developers looking to understand and optimize react rendering react performance deep dive react rendering building better websites with remix react summit remote edition 2021 33 min building better websites with remix top content michael jackson react training remix is a web framework built on react router that focuses on web fundamentals accessibility performance and flexibility it delivers real html and seo benefits and allows for automatic updating of meta tags and styles it provides features like login functionality session management and error handling remix is a server rendered framework that can enhance sites with javascript but doesn t require it for basic functionality it aims to create quality html driven documents and is flexible for use with different web technologies and stacks react remix frameworks don t solve problems eliminate them react advanced 2021 39 min don t solve problems eliminate them top content kent c dodds creator of epicweb dev epicreact dev testingjavascript com kent c dodds discusses the concept of problem elimination rather than just problem solving he introduces the idea of a problem tree and the importance of avoiding creating solutions prematurely kent uses examples like tesla s electric engine and remix framework to illustrate the benefits of problem elimination he emphasizes the value of trade offs and taking the easier path as well as the need to constantly re evaluate and change approaches to eliminate problems remix best practices web development everything beyond state management in stores with pinia vue js london live 2021 34 min everything beyond state management in stores with pinia top content eduardo san martin morote vue js core team state management is not limited to complex applications and transitioning to a store offers significant benefits pinia is a centralized state management solution compatible with vue 2 and vue 3 providing advanced devtools support and extensibility with plugins the core api of pinia is similar to vuex but with a less verbose version of stores and powerful plugins pinia allows for easy state inspection error handling and testing it is recommended to create one file per store for better organization and pinia offers a more efficient performance compared to v rex state management vue pinia react react compiler understanding idiomatic react react forget react advanced 2023 33 min react compiler understanding idiomatic react react forget top content 2 authors the talk discusses react forget a compiler built at meta that aims to optimize client side ...