The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
🚀 Rendering 100k+ items in React? Here’s what actually works.
Large lists can easily kill performance if handled the wrong way. This is how I approach it in real projects:
• Virtualization
Render only what’s visible using libraries like react-window. Massive win.
• Memoization
React.memo, useMemo, and useCallback help avoid unnecessary re-renders.
• Pagination / Infinite Scroll
If users can’t see it yet, don’t render it yet.
• Lightweight DOM
Shallow, simple components render and update much faster.
Rule of thumb:
If you’re rendering 100k items at once, the issue is usually architectural, not React itself.
Always curious how others tackle large-scale UI performance.
#React #Frontend #Performance #WebDevelopment #JavaScript #TypeScript
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Related posts
All looks so clean!
Don't just make Ecommerce 2d boring site. Make something that your users remembers😎
built by nextJS, Framer Motion, Lenis, Gsap, TailwimdCSS
Framer Website DesignwebdesignsaaswebsiteNext.jsInteractive DesignWeb DesignFramerVisual Studio Code
We spent way too long on the physics of shaking a can of soda that doesn't exist.
BLORP is a concept project — a made-up soda brand, no client. One page, built in Framer, where every section gives you something to play with instead of something to read.
The brand is fake. The science isn't:
Fizz-o-meter — drag the slider and see carbonation in actual volumes of CO2, lined up against lager, cola and champagne.
Shake lab — shake the can, watch the nucleation gauge climb, then crack it for the foam burst. It remembers your best crack.
Flavor switcher — Cherry, Yuzu, Razz, Lime. The whole page repaints: colours, can, copy.
Plus bubbles you can pop with a live counter, a can you can drag to spin and click to crack, flavour cards that pour when you tap them, and a sticker wall you can fling around.
Built in Framer. The bubbles, the can, the flavour switch, the fizz-o-meter, the shake lab and the sticker wall are all custom React code components, with separate desktop, tablet and phone layouts.
Go shake the can -> blorp.store Case study -> contra.com/p/7PMeFqPW-blorp-soda-co-interactive-framer-concept-site
What's your best crack? Screenshot the gauge.