# barbajs/barba

Create badass, fluid and smooth transitions between your website’s pages

Repository: https://github.com/barbajs/barba
Canonical: https://ross.abutalabs.com/products/barba
Homepage: https://barba.js.org/
Language: TypeScript
License: MIT
License Family: permissive
Topics: transition, prefetch, page, barba, animation, router, barbajs, css, library, plugin-system, single-page-application, smooth, page-transitions, fluid, spa
Last push: 2024-12-02T22:33:28+00:00

## Health v2 (maintenance only)
Score: 23/100 (v2, computed 2026-09-03T02:20:16.233290+00:00)
- activity 0, release rhythm 8, longevity 100
- inputs: {"age_days": 3947, "days_push": 639, "days_rel": null, "gap_med": null, "n_releases_24m": 0}
- flags: none
- formula: round(0.45*activity + 0.35*rhythm + 0.20*longevity); archived -> min(score, 10)

## Adoption (not part of the score)
Stars 12973, forks 497 (observed 2026-08-28T04:11:00.286344+00:00)

## What it is
Barba.js is a small (~7kb) TypeScript library that creates fluid, smooth transitions between website pages, making a multi-page site behave like a single-page application. It offers a hook-based lifecycle, transition rules, sync mode, and official plugins for routing, prefetching, and CSS-only transitions.

## Use cases
- add smooth page transitions to a website
- make a multi-page site feel like an SPA
- animate between pages without a full framework
- prefetch pages to speed up navigation
- route-based page transition rules
- crossfade page content on navigation

## When to choose
- you want SPA-like fluid page transitions on a traditional multi-page site
- you need fine-grained control over transition lifecycle hooks and rules
- you want a lightweight, framework-agnostic solution with a plugin system

## When to avoid
- you already use React, Vue, or Next.js with built-in routing and transitions
- you need full SPA state management rather than just page transitions
- you require SEO-critical server-rendered behavior without careful setup

## Facets
- artifact type: library
- maturity: stable
- function: animation, routing, plugin-system, frontend-framework
- domain: web-development, frontend
- platform: browser
- tags: page-transitions, spa, smooth-animations, prefetch, progressive-enhancement, typescript, nodejs

## Member repositories
- barbajs/barba (main) score 23

## Provenance
- Observed fields: from GitHub, fetched 2026-08-28T04:11:00.286344+00:00.
- Health v2: computed from the inputs above; adoption is never an input.
- Inferred fields (summary, facets, guidance): AI-extracted, prompt v1, taxonomy v1, on 2026-08-29T17:13:38.565093+00:00, confidence not recorded.
  - readme: https://github.com/barbajs/barba (fetched 2026-08-28T04:11:00.286344+00:00, sha a4d41dc0d613)
  - homepage: https://barba.js.org/ (fetched 2026-08-29T08:09:52.416520+00:00, sha ed6847062244)
  - site_page: https://barba.js.org/features/user-friendly (fetched 2026-08-29T08:09:52.427523+00:00, sha 5d3a8e582600)
  - site_page: https://barba.js.org/features/easy-peasy (fetched 2026-08-29T08:09:52.430295+00:00, sha ffd965d796d0)
  - site_page: https://barba.js.org/features/smart (fetched 2026-08-29T08:09:52.433517+00:00, sha 5da239dff16b)
  - site_page: https://barba.js.org/features/extensible (fetched 2026-08-29T08:09:52.435637+00:00, sha b67bf8f55b16)
  - site_page: https://barba.js.org/features/futureproof (fetched 2026-08-29T08:09:52.437625+00:00, sha 79d77b7d59dd)
  - site_page: https://barba.js.org/features/community (fetched 2026-08-29T08:09:52.439926+00:00, sha bf19e4fceba2)
  - site_page: https://barba.js.org/docs/getstarted/intro (fetched 2026-08-29T08:09:52.441801+00:00, sha f1fac0427e06)
  - site_page: https://barba.js.org/faq (fetched 2026-08-29T08:09:52.443819+00:00, sha 14fa1fd3bb78)
- Data as of 2026-08-30T08:39:29.467469+00:00.