By Jody —

0.52.0: Instant Loading Placeholders Everywhere

Version 0.52.0 is out. This release focuses on navigation that feels faster: every page and every overlay now shows a loading placeholder straight away while the real content loads.

Placeholders for every page

Before, a loading skeleton only appeared for some links: posts, pages, tags and author profiles. Other links left the old page on screen until the new one arrived.

Now every page sets a default placeholder. When a link or form doesn't name a placeholder of its own, the site shows a generic document skeleton the moment you click, then swaps in the real page when it arrives.

  • The skeleton is preloaded when the page first opens and again after each navigation, so it is ready before you click.
  • It is drawn for the current section, so the header and sidebar stay the same while the body loads.
  • The Docs link in the top menu uses the Docs version of the skeleton, so switching sections looks right too.

This works for any page, including ones from your own views. You don't have to wire anything up.

Opting out

A link or form that should not show a placeholder can pass an empty one:

<a href="/somewhere" data-placeholder="">Somewhere</a>

A link with its own data-placeholder URL still uses that URL. The automatic background update that a form makes while you type never shows a placeholder.

Placeholders for every overlay

Overlays now get a placeholder by default as well. Before, only one overlay (the newsletter subscription holding page) passed one. The default comes from the blognami-overlay-default-placeholder meta tag in the shell, which points to /_placeholders/overlay.

Removed placeholder views

The one document skeleton replaces the old per-type views. These URLs have been removed:

  • /_placeholders/post
  • /_placeholders/page
  • /_placeholders/tag
  • /_placeholders/user

If your own views or theme still link to one of these with data-placeholder, the preload will now return a 404. Remove the attribute and the default placeholder will take over.

Upgrading

Bump your packages to 0.52.0. For a new project, run npx blognami@latest. There are no migrations or configuration changes.

If you have custom views, search them for /_placeholders/ and remove any reference to the views listed above.

To check the release is working, click any internal link on your site. A grey skeleton of the page should appear straight away, before the content loads.