Fun Facts
Fun Facts (for tech folk)
- Everything here was hand-written for optimal performance This page is 99.99848% the size of googles homepage and loads 3.5 times faster - .2 seconds
- Pages were built for speed. Delivered in under 15kbs, as a single html file, on a single line. Html renders first, then css, and then js Near all JS frameworks are over 15kb compressed. That's before even using it! .
Sounds good? We are just getting started.
- It's a mobile-first JAMSTACK that supports multiple nested SPA's with each their own fallbacks, manifests, and service workers.
- It also boasts a perfect lighthouse score Lighthouse wont check my PWA because the manifest and service worker are only loaded once a user navigates from the page
But that's not even the half of it:
- The design is understated and soft. It has 15+ GPU accelerated animations and plenty of effects that all run at a cool, non-interrupting, 60fps.
- By default, pages are enhanced by, but not dependent on, JS.
- It also uses semantic html and was built with accessibility in mind.
- Webpack compresses every single assets during the build step and
- Each page gets prerendered and the loading script gets teased apart for optimal lazy loading or removal entirely Typical rehydration strategies have got nothing on my loading strategy.
Very considerate, I know. But wait! There's more!
- Relevant pages are SEO enriched using JSON-LD and are listed in the sitemap.txt file.
- I'm using all the good meta tags. You know the ones ;)
And here's the best part :D
- Content is pulled and converted, from IPYNB's to HTML using a mix of markdown and special syntax's. Inspired by NbDev, these footnotes are an example of special ipynb markup
- On a per-page basis, IPYNB frontmatter (YAML) is used for setting the template, meta-tags, progress bars, sitemaps, table of contents, and more.
- The use of IPYNB's also means I can publish exploratory analysis's effortlessly. Special tooling There are lots of python libraries that spit out or export javascript. To name a few: Plotly, ObservableHQ, dataplay (A mapping library I made using leaflet), and more! means the output can even be interactive online! But that typicaly breaks the 15kb size limits.