Barba.js

Modern page transition library for creating fluid, smooth transitions between website pages. Barba.js makes multi-page websites feel like Single Page Applications (SPAs) by hijacking navigation and managing transitions without full page reloads.

Overview

Barba.js is a lightweight (7kb minified and compressed) JavaScript library that intercepts navigation between pages, fetches new content via AJAX, and smoothly transitions between old and new containers. It reduces page load delays and HTTP requests while maintaining the benefits of traditional multi-page architecture.

Maintenance status (as of mid-2026): @barba/core is at v2.10.3 (published August 2024); the last commit to the GitHub repo was December 2024. The project is not archived, but it is functionally stagnant, no new features or fixes are landing. Treat it as a mature, frozen dependency with a stable API rather than an actively evolving one. For simple multi-page transitions, evaluate the native View Transitions API first, it now covers same-document transitions in all major browsers and cross-document transitions in Chrome/Edge and Safari (no Firefox yet) — see the modern-web-design skill's View Transitions section. Reach for Barba when broader browser support, richer transition-selection rules (namespace/route targeting, lifecycle hooks), or GSAP-driven choreography are required.

Core Features:

• Smooth page transitions without full reloads
• Lifecycle hooks for precise control over transition phases
• View-based logic for page-specific behaviors
• Built-in routing with @barba/router plugin
• Extensible plugin system
• Small footprint and high performance
• Framework-agnostic (works with vanilla JS, GSAP, anime.js, etc.)