←back to thread

Show HN: JavaScript-free (X)HTML Includes

(github.com)
210 points Evidlo | 1 comments | 22 Aug 25 18:47 UTC | HN request time: 0.202s | source

(spoiler: its XSLT)

I've been working on a little demo for how to avoid copy-pasting header/footer boilerplate on a simple static webpage. My goal is to approximate the experience of Jekyll/Hugo but eliminate the need for a build step before publishing. This demo shows how to get basic templating features with XSL so you could write a blog post which looks like

  <?xml version="1.0"?>
  <?xml-stylesheet type="text/xsl" href="/template.xsl"?>
  <page>
      <title>My Article</title>
      <content>
          some content
          <ul>
              <li>hello</li>
              <li>hello</li>
          </ul>
      </content>
  </page>
Some properties which set this approach apart from other methods:

  - no build step (no need to setup Jekyll on the client or configure Github/Gitlab actions)
  - works on any webserver (e.g. as opposed to server-side includes, actions)
  - normal looking URLs (e.g. `example.com/foobar` as opposed to `example.com/#page=foobar`)
There's been some talk about removing XSLT support from the HTML spec [0], so I figured I would show this proof of concept while it still works.

[0]: https://news.ycombinator.com/item?id=44952185

See also: grug-brain XSLT https://news.ycombinator.com/item?id=44393817

Show context
b_e_n_t_o_n ◴[23 Aug 25 00:05 UTC] No.44991549[source]▶
This works client side right? So when a user navigates to this page, it recursively fetches content from the server? And if you have nested includes it would waterfall?

Even single page app frameworks have mostly solved this by doing the rendering on the server instead of making multiple round trips from the client. This feels like the no-JavaScript version of Spinnergeddon.

Does the browser wait for all the includes to resolve before showing the page or does it flicker in?

replies(2): >>44991846 #>>44992318 #
bawolff ◴[23 Aug 25 00:51 UTC] No.44991846[source]▶
Looking at the xslt stylesheet , it doesn't look like there are nested includes, its just one stylesheet which doesn't include anything else. So its not that different in terms of requests than how css would work.
replies(1): >>44992671 #
magicalist ◴[23 Aug 25 02:56 UTC] No.44992671[source]▶
> Looking at the xslt stylesheet , it doesn't look like there are nested includes, its just one stylesheet which doesn't include anything else

At least the browser has to load template.xsl before it can know it has to load the css file though, right? And this is just a simple demo page.

replies(2): >>44993223 #>>44994012 #
1. bawolff ◴[23 Aug 25 07:21 UTC] No.44994012[source]▶
I guess its ine extra layer, but its not like we've gone 14 layers deep or something.

I imagine preloading the css file using the http link header would solve this problem.