skills folder in Langfuse codebase.

In this article, we review skills folder in Langsude codebase. You will learn:

1. vercel-react-best-practices

2. vercel-composition-patterns

Skills

I review skills in the OSS codebases to identify the best practices that go into defining the skills that are used in a codebase. When I write about skills, I tend to keep it to the meta and overview of the sections defined.

vercel-react-best-practices

This skill is defined in web/.agents/skills folder and it has the following metadata:

---
name: vercel-react-best-practices
description: React and Next.js performance optimization guidelines from Vercel Engineering. This skill should be used when writing, reviewing, or refactoring React/Next.js code to ensure optimal performance patterns. Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements.
license: MIT
metadata:
  author: vercel
  version: "1.0.0"
---

The description defined the following things:

1. When this skill should be used:

• should be used when writing, reviewing, or refactoring React/Next.js code

2. When this skill should be triggered:

• Triggers on tasks involving React components, Next.js pages, data fetching, bundle optimization, or performance improvements

Usually, you can expect the rest of skills document elaborating on description in metadata.

There’s also rules folder where it has

rules/async-parallel.md
rules/bundle-barrel-imports.md

vercel-composition-patterns

This skill is defined in web/.agents/skills and it has the following metadata:

---
name: vercel-composition-patterns
description:
  React composition patterns that scale. Use when refactoring components with
  boolean prop proliferation, building flexible component libraries, or
  designing reusable APIs. Triggers on tasks involving compound components,
  render props, context providers, or component architecture. Includes React 19
  API changes.
license: MIT
metadata:
  author: vercel
  version: '1.0.0'
---

The description defined the following things:

1. When this skill should be used?

• Use when refactoring components with boolean prop proliferation, etc., or

• Building flexible component libraries or

• Designing reusable APIs.

2. When this skill should be triggered?

• Triggers on tasks involving compound components etc.,

Usually, you can expect the rest of skills document elaborating on description in metadata.

This skill also has rules folder:

rules/architecture-avoid-boolean-props.md
rules/state-context-interface.md

About me:

Hey, my name is Ramu Narasinga. Email: ramu.narasinga@gmail.com

Tired of AI slop?

I spent 3+ years studying OSS codebases and wrote 350+ articles on what makes them production-grade. I built an open source tool that reviews your PR against your existing codebase patterns.

Your codebase. Your patterns. Enforced.

Get started for free — thinkthroo.com

References

1. langfuse/web/.agents/skills/vercel-react-best-practices/SKILL.md

2. langfuse/web/.agents/skills/vercel-composition-patterns

3. langfuse/web/.agents/skills