// the find
danielroe/beasties
A library to inline your app's critical CSS and lazy-load the rest.
Beasties is a maintained fork of Google's abandoned Critters library that inlines critical CSS into HTML and defers the rest. It works by parsing the DOM statically rather than spinning up a headless browser, which makes it fast but means it inlines all CSS that matches any element in the document, not just above-the-fold styles. Best fit for SSR/prerendered SPAs where you want better FCP without the overhead of Puppeteer.
No headless browser dependency keeps the build pipeline fast and avoids Chromium download weight. The `data-beasties-container` attribute is a practical escape hatch for large documents where you actually do want to scope evaluation to the visible region. The `data-beasties-skip` attribute on individual `<link>` tags covers the real-world case of runtime-injected or tenant-specific stylesheets that shouldn't be touched. Multiple preload strategies (swap, media, js-lazy, etc.) mean you can match the exact browser behavior you need without hacking around the output.
The core limitation is upfront in the README: it inlines all CSS matching any document element, not just above-the-fold. This means on content-heavy pages you can end up inlining far more CSS than necessary, potentially making the `<style>` block larger than the deferred stylesheet it's trying to optimize. No viewport simulation also means it can't handle dynamic classes added by JS after paint — if your framework adds classes at runtime, those rules won't be inlined. The fork is actively maintained by a single person (danielroe), which is fine for now but is a bus-factor concern for a library that sits in the critical path of your build. Star count (677) is low for something this foundational, suggesting most users don't know this fork exists and are still on the unmaintained original.