Partial hydration with 11ty and Preact | Markus Oberlehner

A great rundown of how to build a site using Preact and Eleventy that gives you the best of SPA-lite hydration and the speed/resilience of SSGs, all with the power of progressive enhancement.

Markus uses some very clever techniques, including "lazy" hydration (only run hydration when components are within/just outside the viewport) and a
component explicitly designed to bring hydration to 11ty/Preact in the first place.

Also, this perfectly sums up why I prefer working with tools like NextJS or Gatsby (or 11ty):

Component-based workflows make frontend development fun again, and it is a lot easier to do with modern frontend frameworks than with using templating languages like Nunjucks or Handlebars.

Explore Other Notes

⬅ Newer

A11y style guide

A great resource for finding accessible patterns for common UI requirements, as well as including stacks of accessibility best practices […]
  • A great rundown of how to build a site using Preact and Eleventy that gives you the best of SPA-lite hydration and the speed/resilience of SSGs, all with the power of progressive […]
  • Murray Adcock.
Journal permalink

Made By Me, But Made Possible By:

CMS:

Build: Gatsby

Deployment: GitHub

Hosting: Netlify

Connect With Me:

Twitter Twitter

Instagram Instragram

500px 500px

GitHub GitHub

Keep Up To Date:

All Posts RSS feed.

Articles RSS feed.

Journal RSS feed.

Notes RSS feed.