In a blog post by Jim Nielson titled Building Websites with Lots of Little HTML Pages, the author lists a few techniques where a developer might be able to use CSS page transitions and HTML pages over JS client-side operations. This isn't 100% true - there's still some JavaScript, but there are still some key takeaways.
In the first example, of allowing the user to switch between Latest, Trending, and Hacker News Hits filters for his blog posts, he opts for generating static HTML pages for each of these. It's a fairly trivial approach, but he makes use of CSS page transitions to make it feel like client-side navigation (on supported browsers), which is pretty interesting.
The second example was about how to handle the opening and closing of the nav menu via a hamburger icon. Traditionally, there would be some chunk of HTML inside the document that's hidden on the page or synthesized via JS that would become visible when the user clicks on the open icon or invisible once the user clicks on the close icon. A JS strategy that's fairly common is to add/remove a class name for this hidden menu and let the CSS styles do the work. A no-JS strategy that I've also seen (and employed) is by employing the Checkbox Hack, where you use an html label, input[type="checkbox"], and the CSS :checked property combined with the sibling selector to hide/show the mobile menu when the checkbox changes state. It's a neat trick and lets you achieve that client-side interaction without JS. The approach in this blog post is neither of those and is more similar to something like HTMX, where the user action would instead request an HTML blob that gets injected into the page. In this blog post, the user's click instead initiates a document request like normal and presents to the user a page which contains the mobile navigation. It's pretty simple in concept and is also easy to understand.
The neat trick about the HTML page nav menu is that the close button on this page uses a bit of JS to improve the user experience. This is the opening tag:
<a href="/" onclick="return document.referrer?history.back():window.location.href="/",!1" aria-label="Close menu (back)">...</a>
Notice the onclick attribute which makes this link act like the browser's back button if there's any history, but otherwise sends them back to the home page. If JS isn't enabled, it just acts like a normal link. The beauty of this is that a backwards page navigation doesn't perform another HTTP request, so although it still technically uses JS, it lets the browser take care of the job of presenting the previous page, rather than putting that task on whatever client-side solution is present (even though toggling a class on a hidden element is already pretty simple to maintain). To me, this is the perfect example of "graceful degradation" and it's the kind of web magic that makes you feel like elegant solutions are right there waiting to be discovered.