Engineering
Intelligent
Systems
dancodea.tech
Modernizing Multi-Page Architecture with Astro 5 & GSAP
Traditional creative agency and portfolio templates often struggle with bloated runtime dependencies, choppy page loads, and fragile animation lifecycles. When transitioning across dozens of inner routes, re-initializing complex scripts like GSAP and carousel engines frequently leads to memory leaks or DOM collisions.
Xpovio is a cutting-edge creative digital agency and portfolio template engineered with
Astro 5+. Originally refactored from legacy multi-page HTML/PHP markup, it consolidates
repetitive code into modular, reusable components and orchestrates JavaScript lifecycles seamlessly across
Astro's client-side <ClientRouter /> view transitions.
Includes 5 distinct homepage styles (Creative Agency, Digital Agency, IT Solutions, Personal Portfolio, and Interactive Portfolio) in both Dark & Light themes, alongside full service, project, team, blog, testimonial, and FAQ suites.
Delivers instant SPA-like navigation without full page reloads. A central lifecycle controller hooks into astro:before-swap and astro:page-load to cleanly tear down and remount animations without memory leaks.
Features SplitText typography reveals (.title-anim, .folks-text), directional viewport reveals, pinned horizontal showcases, and interactive parallax thumb/tag elements tuned for 60fps responsiveness.
Smooth auto-scrolling ticker bands, multi-breakpoint testimonial sliders, sponsor strips, and dynamic Isotope category-filtered portfolio masonry with animated layout transitions.
Custom outer and inner cursor follower with hover-state expansion on interactive elements, magnetic attraction, and cursor-following floating image cards.
Compiles 25 rich pages in sub-second build times with zero runtime layout thrashing. Native browser scrolling enhanced with GSAP eliminates virtual scrollbar locking.
Visual Showcase & Interface Highlights
Hero Archetype & Dynamic Typography
High-impact dark mode hero with circular media frame, interactive metrics, and magnetic call-to-actions.
Fullscreen Staggered Menu
Accordion-driven multi-level navigation with smooth backdrop blur, social links, and quick page discovery.
Dynamic Isotope Portfolio Gallery
Filterable portfolio showcase with custom hover overlays, zoom interactions, and responsive column grids.
Editorial Insights & Video Modal
Clean typography layout for articles, category filters, and an interactive corner video popup player.
Engineering Highlights & Results
By migrating from legacy multi-file templates to Astro 5's component-driven architecture, Xpovio achieves seamless client-side page transitions, unified design tokens across 25 routes, and sub-second static builds while maintaining full GSAP animation power.