Socket
Socket
Sign inDemoInstall

swup

Package Overview
Dependencies
Maintainers
3
Versions
142
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

swup

Versatile and extensible page transition library for server-rendered websites


Version published
Weekly downloads
14K
increased by11.85%
Maintainers
3
Weekly downloads
 
Created
Source

swup 4 is released  🎉  Check out the release notes and upgrade guide.


swup


Swup

Versatile and extensible page transition library for server-rendered websites.

FeaturesDemosPluginsThemesDocumentationDiscussions

Overview

Swup adds page transitions to server-rendered websites. It manages the complete page load lifecycle and smoothly animates between the current and next page. In addition, it offers many other quality-of-life improvements like caching, smart preloading, native browser history and enhanced accessibility.

Make your site feel like a snappy single-page app — without any of the complexity.

Features

  • ✏️ Works out of the box with minimal markup
  • ✨ Auto-detects CSS transitions & animations for perfect timing
  • 🔗 Updates URLs and preserves native browser history
  • 🏓 Manages the scroll position between pages and anchor links
  • 🚀 Uses a cache to speed up subsequent page loads
  • 📡 Offers hooks to customize and extend the page load lifecycle
  • 🔌 Has a powerful plugin system and many official and third-party plugins
  • 🎨 Provides ready-to-go themes to get started quickly

Demos

Explore our interactive demos to see swup in action.

Documentation

Visit our official documentation to learn more.

Plugins

Swup is small by design. Extended features can be added via plugins:

Check out the list of official plugins and third-party integrations.

Themes

Get started quickly with one of three official themes: fade, slide, and overlay.

Examples

Take a look at the interactive demos and sites using swup for more examples.

Having trouble?

If you're having trouble implementing swup, check out the Common Issues section of the docs, look at closed issues or create a new discussion.

Want to Contribute?

We're looking for maintainers!   👀

Become a sponsor on Open Collective or support development through GitHub sponsors.

This project is tested with BrowserStack.

Keywords

FAQs

Package last updated on 25 Mar 2024

Did you know?

Socket

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc