critters

🦔 A Webpack plugin to inline your critical CSS and lazy-load the rest. (by GoogleChromeLabs)

Critters Alternatives

Similar projects and alternatives to critters

NOTE: The number of mentions on this list indicates mentions on common posts plus user suggested alternatives. Hence, a higher number means a better critters alternative or higher similarity.

critters reviews and mentions

Posts with mentions or reviews of critters. We have used some of these posts to build our list of alternatives and similar projects. The last one was on 2024-03-25.
  • Show HN: Jampack – Optimizes static websites as a post-processing step
    3 projects | news.ycombinator.com | 25 Mar 2024
    I'm interested in the notion of identifying "critical" CSS that should be inlined rather than live in its own stylesheet.

    I was hoping there was some principled way of identifying critical and non-critical CSS (e.g. user interaction effects like :hover would always be considered non-critical), but it looks like the library it's using just tries to render your page and do a best-effort detection on which rules are considered critical, which is a little unsatisfying: https://github.com/GoogleChromeLabs/critters

  • Optimize CSS with SAT Solving
    5 projects | news.ycombinator.com | 17 Mar 2024
    https://github.com/GoogleChromeLabs/critters Might be a good starting point. It’s designed to inline the css afterward so it’s more focused on extracting used css than removing unused.
  • Critical CSS and Next.js App Directory
    1 project | /r/nextjs | 26 Nov 2023
    With the Pages dir, we had experimental support for critters. That was good enough for me
  • Remove CSS Styles and Apply Styles to All Elements
    1 project | /r/css | 7 May 2023
    Critters does something similar but it is intended to inline only the CSS that is visible upon the page load (top of the page). There is also a Vite plugin that inlines everything that is possible to inline
  • Optimizing CSS Performance in Nuxt with Critters
    2 projects | dev.to | 26 Dec 2022
    // nuxt.config.js import { defineNuxtConfig } from 'nuxt' export default defineNuxtConfig({ modules: ['@nuxtjs/critters'], critters: { // Options passed directly to critters: https://github.com/GoogleChromeLabs/critters#critters-2 config: { // Default: 'media' preload: 'swap', }, }, })
  • Critical CSS? Not So Fast
    5 projects | news.ycombinator.com | 10 Sep 2022
    I find critters[0] quite easy to work with and well worth implementing on my nextjs or Astro projects.

    I build a lot of landing pages so there are very few multi page visits.

    [0] https://github.com/GoogleChromeLabs/critters

  • Vue Webpack - possible to extract some CSS but not all?
    1 project | /r/vuejs | 24 Dec 2021
    Doesn't critters do this already? https://github.com/GoogleChromeLabs/critters I could be wrong though
  • A note from our sponsor - WorkOS
    workos.com | 23 Apr 2024
    The APIs are flexible and easy-to-use, supporting authentication, user identity, and complex enterprise features like SSO and SCIM provisioning. Learn more →

Stats

Basic critters repo stats
7
3,374
6.6
about 2 months ago

Sponsored
Power Real-Time Data Analytics at Scale
Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.
www.influxdata.com