Uniclode: yet another demo of Eleventy Serverless
unicode-range value that can be used in font subsetting.
On first page render, each individual character is a hyperlink containing a new
unicode-range set containing the current
unicode-range of characters with the addition of itself.
When the links are clicked and the page is re-rendered, all of the link
href attributes are recalculated. If a character is already present in the
unicode-range, the hyperlink will contain a new set that has it removed. If a character is not yet in the
unicode-range, the hyperlink will add it.
This is an interesting use case for Eleventy Serverless, in that it maintains state in the URL and re-renders the template based on that state. One might argue that this is a state machine, but I will not be pressured into assuming that role.
This demo shows that multiple URL paths can be assigned to a single serverless template, e.g.:
--- permalink: serverless: ["/", "/:chars/"] ---
This demo also makes use of On-demand Builders. That means that once a template is generated for a specific
unicode-range, it will serve that cached page instead of re-rendering. This saves on both Netlify Functions quotas and run-time performance.
While this is a fully-functioning demo, I would consider it to be a demo and not a finished product. For this use case specifically, full page refreshes to select a character in a list is not the best-case UX. What this does show is that Eleventy Serverless allows a new class of projects to be built with a progressive enhancement friendly baseline that previously weren’t possible with static build-time templates alone.