- 🤖 Introduction
- ⚙️ Tech Stack
- 🔋 Features
- ⚡ Performance
This is my interactive 3D portfolio, crafted using React, Three.js, React Three Fiber, React Three Drei, Tailwind CSS, and Framer Motion.
The site focuses on delivering a cinematic, three-dimensional experience while maintaining production-grade performance. It features immersive 3D models, real-time weather effects, and motion-driven interactions — all carefully optimized to ensure fast load times, smooth animations, and responsive user interactions across devices.
- React.js
- Three.js
- React Three Fiber
- React Three Drei
- JavaScript
- Tailwind CSS
- Framer Motion
- EmailJS
- Vite
👉 Immersive 3D Experience
A fully interactive 3D portfolio experience built with Three.js and React Three Fiber, creating depth, motion, and realism across multiple sections.
👉 Advanced Animations
Smooth, physics-inspired animations powered by Framer Motion, designed to enhance storytelling without compromising performance.
👉 Real-Time Visual Effects
Dynamic elements such as clouds, rain, lightning, and environmental lighting add atmosphere and realism to the interface.
👉 Responsive & Adaptive Design
A mobile-first, fully responsive layout built with Tailwind CSS to ensure consistent visuals and usability across all screen sizes.
👉 Performance-Focused Architecture
Despite heavy use of WebGL, 3D models, and animations, the application is architected to prioritize fast rendering, minimal layout shifts, and smooth interactions.
👉 Integrated Contact & Resume Access
Built-in email functionality and a downloadable resume allow visitors to connect effortlessly.
👉 Project Showcase
A curated display of my mobile and web development projects, highlighting both technical depth and real-world application.
👉 Clean Code Architecture & Reusability
Components are modular, reusable, and well-structured, following best practices for scalability and maintainability.
Even with heavy 3D models, WebGL rendering, and complex animations, the site achieves excellent real-world performance metrics:
-
Largest Contentful Paint (LCP): 0.31s
→ Primary content renders almost instantly, ensuring a fast perceived load experience. -
Cumulative Layout Shift (CLS): 0.00
→ Zero unexpected layout shifts, resulting in a stable and polished visual experience. -
Interaction to Next Paint (INP): 48ms
→ Near-instant response to user interactions such as clicks and pointer events.
These results demonstrate a careful balance between visual richness and performance optimization, ensuring the site feels smooth, responsive, and production-ready despite its technical complexity.
Overall, this portfolio serves as a testament to who I am, what I am passionate about, and the depth of my capabilities — combining advanced visuals, clean architecture, and real-world performance discipline.