Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
4 changes: 2 additions & 2 deletions .github/ISSUE_TEMPLATE/bug_report.md
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@ A clear and concise description of what the bug is.
```

**Expected behavior**
What you expected to happen when using `@pure`.
What you expected to happen when using `@blaze`.

**Actual behavior**
What actually happened instead.
Expand All @@ -27,4 +27,4 @@ What actually happened instead.
- Blaze version: [e.g. 1.0.0]

**Additional context**
Add any other context about the problem here (error messages, stack traces, etc.)
Add any other context about the problem here (error messages, stack traces, etc.)
86 changes: 43 additions & 43 deletions AGENTS.md
Original file line number Diff line number Diff line change
Expand Up @@ -6,36 +6,36 @@ This document provides guidance for AI assistants helping users work with Larave

Laravel Blaze is a performance optimization package that pre-renders static portions of Blade components at compile-time, dramatically reducing runtime overhead. It works by:

1. Identifying components marked with the `@pure` directive in their source
1. Identifying components marked with the `@blaze` directive in their source
2. Analyzing component source for runtime dependencies
3. Pre-rendering eligible components during Blade compilation
4. Falling back to normal rendering for unsafe components

## Core Concepts

### The @pure Directive
### The @blaze Directive

The `@pure` directive tells Blaze that a component has no runtime dependencies and can be safely optimized. It must be placed at the top of a component file:
The `@blaze` directive tells Blaze that a component has no runtime dependencies and can be safely optimized. It must be placed at the top of a component file:

```blade
@pure
@blaze

@props(['title'])

<h1 class="text-2xl font-bold">{{ $title }}</h1>
```

The `@pure` directive supports optional parameters to control different optimization strategies:
The `@blaze` directive supports optional parameters to control different optimization strategies:

```blade
{{-- All optimizations enabled (default) --}}
@pure
@blaze

{{-- Explicitly enable all optimizations --}}
@pure(fold: true, memo: true, aware: true)
@blaze(fold: true, memo: true, aware: true)

{{-- Disable specific optimizations --}}
@pure(fold: false, memo: true, aware: false)
@blaze(fold: false, memo: true, aware: false)
```

**Parameters:**
Expand All @@ -45,7 +45,7 @@ The `@pure` directive supports optional parameters to control different optimiza

### Code Folding Process

When a `@pure` component is encountered, Blaze:
When a `@blaze` component is encountered, Blaze:
1. Replaces dynamic content being passed in via attributes or slots with placeholders
2. Renders the component with placeholders
3. Validates that placeholders are preserved
Expand All @@ -58,7 +58,7 @@ When a component can't be folded (due to dynamic content), Blaze automatically f

## Helping Users Analyze Components

When a user asks about adding `@pure` to a component or wants you to analyze their components, follow this process:
When a user asks about adding `@blaze` to a component or wants you to analyze their components, follow this process:

### 1. Read and Analyze the Component

Expand All @@ -67,37 +67,37 @@ First, examine the component source code for:
- Dynamic content that changes per request
- Dependencies on global state or context

### 2. Safe Patterns for @pure
### 2. Safe Patterns for @blaze

Components are safe for `@pure` when they only:
Components are safe for `@blaze` when they only:
- Accept props and render them consistently
- Perform simple data formatting (dates, strings, etc.)
- Render slots without modification

Examples:
```blade
{{-- UI components --}}
@pure
@blaze
<div class="card p-4 bg-white rounded shadow">{{ $slot }}</div>

{{-- Prop-based styling --}}
@pure
@blaze
@props(['variant' => 'primary'])
<button class="btn btn-{{ $variant }}">{{ $slot }}</button>

{{-- Simple formatting --}}
@pure
@blaze
@props(['price'])
<span class="font-mono">${{ number_format($price, 2) }}</span>

{{-- Components using @aware --}}
@pure
@blaze
@aware(['theme'])
@props(['theme' => 'light'])
<div class="theme-{{ $theme }}">{{ $slot }}</div>
```

### 3. Unsafe Patterns (Never @pure)
### 3. Unsafe Patterns (Never @blaze)

**Authentication & Authorization:**
- `@auth`, `@guest`, `@can`, `@cannot`
Expand Down Expand Up @@ -134,89 +134,89 @@ Examples:
- Components that display pagination controls
- Data tables with pagination

**Nested Non-Pure Components:**
**Nested Non-Foldable Components:**
- Components that contain other components which use runtime data
- Parent components can't be `@pure` if any child component is dynamic
- Watch for `<x-*>` tags inside the component that might be non-pure
- Parent components can't be `@blaze` if any child component is dynamic
- Watch for `<x-*>` tags inside the component that might be non-foldable

### 4. Analysis Process

When analyzing a component:

1. **Scan for unsafe patterns** using the lists above
2. **Check for child components** - look for any `<x-*>` tags and verify they are also pure
2. **Check for child components** - look for any `<x-*>` tags and verify they are also foldable
3. **Check for indirect dependencies** - props that might contain dynamic data (like paginator objects)
4. **Consider context** - how the component is typically used
5. **Test edge cases** - what happens with different prop values

#### Special Case: Nested Components

When a component directly renders other Blade components in its template (not via slots), verify those are also pure:
When a component directly renders other Blade components in its template (not via slots), verify those are also foldable:

```blade
{{-- Parent component --}}
@pure <!-- ⚠️ Only safe if directly rendered child components are pure -->
@blaze <!-- ⚠️ Only safe if directly rendered child components are foldable -->

<div class="data-table">
<x-table-header /> <!-- Must be pure -->
<x-table-header /> <!-- Must be foldable -->
{{ $slot }} <!-- ✅ Slot content is handled separately, can be dynamic -->
<x-table-footer /> <!-- Must be pure -->
<x-table-pagination /> <!-- ❌ If this uses paginator, parent can't be @pure -->
<x-table-footer /> <!-- Must be foldable -->
<x-table-pagination /> <!-- ❌ If this uses paginator, parent can't be @blaze -->
</div>
```

**Key distinction**:
- Components **hardcoded in the template** must be pure for the parent to be @pure
- Components **hardcoded in the template** must be foldable for the parent to be @blaze
- Content **passed through slots** is handled separately and can be dynamic

### 5. Making Recommendations

**For safe components:**
```
This component is safe for @pure because it only renders static HTML and passed props. Add @pure at the top of the file.
This component is safe for @blaze because it only renders static HTML and passed props. Add @blaze at the top of the file.
```

**For unsafe components:**
```
This component cannot use @pure because it contains [specific pattern]. The [pattern] changes at runtime and would be frozen at compile-time, causing incorrect behavior.
This component cannot use @blaze because it contains [specific pattern]. The [pattern] changes at runtime and would be frozen at compile-time, causing incorrect behavior.
```

**For borderline cases:**
```
This component might be safe for @pure, but consider if [specific concern]. Test thoroughly after adding @pure to ensure it behaves correctly across different requests. If folding isn't possible, memoization will still provide performance benefits.
This component might be safe for @blaze, but consider if [specific concern]. Test thoroughly after adding @blaze to ensure it behaves correctly across different requests. If folding isn't possible, memoization will still provide performance benefits.
```

## Common User Requests

### "Can I add @pure to this component?"
### "Can I add @blaze to this component?"

1. Read the component file
2. Analyze for unsafe patterns
3. Provide a clear yes/no with explanation
4. If no, suggest alternatives or modifications

### "Add @pure to my components"
### "Add @blaze to my components"

1. Find all component files (`resources/views/components/**/*.blade.php`)
2. Analyze each component individually
3. Add `@pure` only to safe components (include a line break after `@pure` )
3. Add `@blaze` only to safe components (include a line break after `@blaze` )
4. Report which components were modified and which were skipped with reasons

### "Optimize my Blade components"

1. Audit existing components for @pure eligibility
2. Identify components that could be refactored to be pure
1. Audit existing components for @blaze eligibility
2. Identify components that could be refactored to be foldable
3. Suggest architectural improvements for better optimization
4. Provide before/after examples

## Implementation Guidelines

### Adding @pure to Components
### Adding @blaze to Components

When adding `@pure` to a component:
When adding `@blaze` to a component:

1. **Always read the component first** to understand its structure
2. **Add @pure as the very first line** of the component file
2. **Add @blaze as the very first line** of the component file
3. **Preserve existing formatting** and structure
4. **Don't modify component logic** unless specifically requested

Expand All @@ -228,7 +228,7 @@ Example edit:
<h1>{{ $title }}</h1>

{{-- After --}}
@pure
@blaze

@props(['title'])

Expand All @@ -241,21 +241,21 @@ When processing multiple components:

1. **Process files individually** - don't batch edits
2. **Report results clearly** - which succeeded, which failed, and why
3. **Provide summary statistics** - "Added @pure to 15 of 23 components"
3. **Provide summary statistics** - "Added @blaze to 15 of 23 components"
4. **List problematic components** with specific reasons for skipping

### Error Handling

If Blaze detects unsafe patterns in a `@pure` component, it will show compilation errors. When helping users:
If Blaze detects unsafe patterns in a `@blaze` component, it will show compilation errors. When helping users:

1. **Explain the error** in simple terms
2. **Show the problematic code** and why it's unsafe
3. **Suggest solutions** - remove @pure or refactor the component
3. **Suggest solutions** - remove @blaze or refactor the component
4. **Provide alternatives** if the optimization is important

## Testing Recommendations

After adding `@pure` to components:
After adding `@blaze` to components:

1. **Test with different props** to ensure consistent rendering
2. **Verify in different contexts** - authenticated vs guest users
Expand Down
Loading