After weeks of development, I'm excited to share ZProximity Engine - a React library for creating proximity-based animations.

🎯 The Problem

Creating magnetic cursors, hover effects, and scroll animations in React usually requires:

Manual event listeners

Complex trigonometry

Performance optimization headaches

✨ The Solution

ZProximity Engine abstracts all of this into a simple API:

import { Proximity } from ' z-proximity-engine ' ;

< Proximity preset = "scale-magnetic" reach = { 2 } > < div className = "prox-item" > Hover me! </ div > </ Proximity >

Enter fullscreen mode

Exit fullscreen mode

🏗️ Technical Highlights

1. Zero Re-renders

Uses GSAP's ticker system instead of React's render cycle.

2. Smart Batching

Pre-caches quickTo functions on mount - no property lookups per frame.

3. Spatial Grid

150px spatial hash grid - only checks nearby elements, not all 100+.

4.…