awesome-reveal/react-awesome-reveal
این کتابخانه یک مجموعه از کامپوننت‌های React است که به راحتی امکان اضافه کردن انیمیشن‌های نمایشی (Reveal) را هنگام اسکرول کردن صفحه فراهم می‌کند.
از Intersection Observer API و CSS Animations برای عملکرد بدون لگ (smooth) و بهینه استفاده می‌کند.
کاربرد:
برای ایجاد انیمیشن‌های جذاب هنگام ورود یک بخش از صفحه به دید کاربر (مثلاً هنگام اسکرول) استفاده می‌شه.
این کار باعث جذابیت بصری بیشتر و تجربه کاربری بهتر می‌شه.
در چه شرایطی بهتره استفاده شود؟
وقتی می‌خوای سایتت حس مدرن و پویا داشته باشه، مخصوصاً در صفحات لندینگ، نمونه کارها، یا بخش‌های معرفی محصول.
همچنین وقتی می‌خوای عملکرد بالایی داشته باشی و از انیمیشن‌های سنگین جاوااسکریپت جلوگیری کنی.
چند مثال از موارد استفاده:
- نمایش تدریجی عکس‌ها و متن‌ها در یک بخش اسکرولی
- انیمیشن ورود آیتم‌های منو یا کارت‌های محصول
- ایجاد افکت "fadeIn"، "slideIn" یا "zoomIn" هنگام دیده شدن بخشی از صفحه
- ##react
- ##animation
- ##intersectionobserver
- ##cssanimation
- ##webdevelopment
- ##frontend
- ##landingpage
- ##uiux
- ##javascript
- ##reactcomponents