Question 1

How to set up smoothState.js on my website?

Accepted Answer

Include jQuery and smoothState.js scripts, add a container with an ID like #main, and initialize it with $('#main').smoothState(). Define animations using hooks such as onStart and onReady for custom transitions, as shown in the getting started section.

Question 2

smoothState.js vs Turbolinks – which is better for page transitions?

Accepted Answer

smoothState.js offers more control over animations via hooks and focuses on progressive enhancement with jQuery, while Turbolinks is Rails-centric and provides simpler caching. Choose smoothState.js for custom designs; Turbolinks for integrated Rails projects.

Question 3

Why do my jQuery plugins stop working after using smoothState.js?

Accepted Answer

smoothState.js injects new content via AJAX, so plugins initialized on document ready aren't re-bound. Re-initialize them in the onAfter callback, scoping to the new content to avoid double-binding, as explained in the FAQ.

Question 4

Can smoothState.js handle form submissions smoothly?

Accepted Answer

Yes, it can bind to forms within the container and handle submissions via AJAX, with options like allowFormCaching to control response storage. However, careful configuration is needed to prevent caching issues.

Question 5

How does smoothState.js affect SEO?

Accepted Answer

It uses progressive enhancement and serves full HTML pages, so search engines can crawl standard links without JavaScript, avoiding negative SEO impact. Ensure your backend returns complete layouts for each URL.

Question 6

How to debug issues with smoothState.js?

Accepted Answer

Enable the debug option to log errors to the console instead of redirecting, and check for messages about missing elements or response issues. The README recommends using stackoverflow or Gitter for support.

SmoothState.js

What is SmoothState.js?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions