Locked Video

Please log in or buy the course to watch

Buy Now

Recipe Analytics

Prerequisites: Before diving in, ensure you’re using Panda CSS version 0.50.0 or above, as Panda Analytics is only available from this version upwards.

What does Panda Analytics for Config Recipes do?

Panda Analytics provides a detailed report that offers insights into how your config recipes are defined and used in your project. This helps you:

  • Spot redundant or unused recipes
  • Improve maintainability
  • Streamline your design system

Running the Analysis

To analyze your config recipes, simply run the following command in your terminal:

pnpm panda analyze --scope=recipe

This command scopes the analysis specifically to your recipes, giving you a clear view of how they are defined and used.

Understanding the Output

The output of the analysis will show various columns with insights into your recipes:

  • Recipe: The name of the recipe (e.g., button, navbar).
  • Variant values: The variant options defined for the recipe.
  • Usage in percentage: The percentage of defined variants that are actually used.
  • Most used: The most frequently applied variant values.
  • Found in files: The number of files where the recipe is used.
  • Used as: How the recipe is being used (e.g., function, JSX component).