# zoink + lookbook + day 3

> jornal

**Published by:** [0xea99](https://paragraph.com/@0xea990ae72939b8751cb680919c6b64a05b8e1451/)
**Published on:** 2025-04-10
**Categories:** farcaster, mini, app, zora, coins, sdk, cursor, ai, zoink
**URL:** https://paragraph.com/@0xea990ae72939b8751cb680919c6b64a05b8e1451/zoink-lookbook-day-3

## Content

Today's motivationspeed going ham on the xiaolongbao feed reminded me there is a speed / performance issue in zoink that must be addressed!!asking cursor the important questions now..Likely Performance Issues (according to Gemini)no data caching between page navigationsmultiple API calls in sequence (waterfall)no loading state management during transitionsno data prefetchinghowever, the real problem with the noticeable lag/delay navigating to a different page was none of the above issues; it was more to do with React and the mounting/unmounting that is being done as state changes in the child component and I am returning a different DOM sub-tree from thereasking more real questions - Link tag, why???Link nav lag solution (along with tanstack useSuspenseQuery)learning about React rendering behaviour - what we want is suspended components with a fallback specified by parent componentSuspense + useSuspenseQuery = nav delay problem solvedok but let's go EVEN FASTERSome additional optimizations that Cursor didEager Data Loading (moved prefetching to root layout for earlier loading)Smooth Transitions (framer-motion)SwiftUIsafeAreaInsets mentionedRoot Page Nightmaresnavigating to other pages fine but root page still lags like crazythings i trieddynamic import components using fdkwrapping a whole component in Suspense instead of just a part of the component's DOMfiddling with the useEffect in FrameProvider that loads the contextthe thing that was causing the issue for me was using the exported useFrame hook in components that needed Farcaster context dataI'm not entirely sure where or how to use this useFrame hook if it is to be exported like thisevery time I would use this useFrame hook in a component, it would create all these additional states but I'm not sure if that's the intended behaviour or usage of this hook?useFrame solution - useFrameContextthis way, we're just keeping one instance of the frame context state and using the useFrameContext in any component that needs the data; this will not trigger the useEffects in the useFrame hookexample usage - would use it like useFrame but instead of re-invoking the full setup like before, it uses shared stateso, the question is, is there an anti-pattern in the Farcaster Mini App quick start CLI command a.k.a npm create @farcaster/mini-app ???fight the allegations here!!p.s. the zoink repo was created using the neynar quick start CLI command tbf; @neynar/create-farcaster-mini-appday 3 trello board

## Publication Information

- [0xea99](https://paragraph.com/@0xea990ae72939b8751cb680919c6b64a05b8e1451/): Publication homepage
- [All Posts](https://paragraph.com/@0xea990ae72939b8751cb680919c6b64a05b8e1451/): More posts from this publication
- [RSS Feed](https://api.paragraph.com/blogs/rss/@0xea990ae72939b8751cb680919c6b64a05b8e1451): Subscribe to updates

## Optional

- [Collect as NFT](https://paragraph.com/@0xea990ae72939b8751cb680919c6b64a05b8e1451/zoink-lookbook-day-3): Support the author by collecting this post
- [View Collectors](https://paragraph.com/@0xea990ae72939b8751cb680919c6b64a05b8e1451/zoink-lookbook-day-3/collectors): See who has collected this post