PHPackages                             livewire/blaze - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Templating & Views](/categories/templating)
4. /
5. livewire/blaze

ActiveLibrary[Templating & Views](/categories/templating)

livewire/blaze
==============

A tool for optimizing Blade component performance by folding them into parent templates

v1.0.10(2mo ago)688221.3k↑163.8%32[2 issues](https://github.com/livewire/blaze/issues)[6 PRs](https://github.com/livewire/blaze/pulls)15MITPHPPHP ^8.1

Since Aug 23Pushed 1mo ago10 watchersCompare

[ Source](https://github.com/livewire/blaze)[ Packagist](https://packagist.org/packages/livewire/blaze)[ RSS](/packages/livewire-blaze/feed)WikiDiscussions main Synced 1mo ago

READMEChangelog (10)Dependencies (13)Versions (36)Used By (15)

🔥 Blaze
=======

[](#-blaze)

Speed up your Laravel app with optimized Blade component rendering.

```
Rendering 25,000 anonymous components:

Without Blaze  ████████████████████████████████████████  500ms
With Blaze     █                                          13ms

```

Introduction
============

[](#introduction)

Out of the box, Blaze is a **drop-in replacement** for anonymous Blade components that requires no changes to your existing code.

It works by compiling your templates into optimized PHP functions instead of using the standard rendering pipeline — eliminating 91-97% of the overhead while maintaining near full feature parity with Blade.

For even greater performance, Blaze offers two additional strategies. These require extra configuration and careful consideration:

- **Memoization**: caching for repeated renders
- **Folding**: pre-rendering into static HTML

Installation
============

[](#installation)

You may install Blaze via Composer:

```
composer require livewire/blaze:^1.0
```

Tip

If you're using [Flux UI](https://fluxui.dev), simply install Blaze and you're ready to go — no configuration needed!

Getting started
===============

[](#getting-started)

There are two ways to enable Blaze:

**A) Add the `@blaze` directive** to individual components — great for trying it out or enabling Blaze on specific templates.

**B) Optimize entire directories** from your service provider — ideal for optimizing many components at once.

After enabling Blaze with either approach, clear your compiled views:

```
php artisan view:clear
```

Option A: The `@blaze` directive
--------------------------------

[](#option-a-the-blaze-directive)

Add `@blaze` to the top of any anonymous component to enable Blaze for that template:

```
@blaze

    {{ $slot }}

```

Strategies may be specified as arguments:

```
@blaze(memo: true)

@blaze(fold: true)
```

Option B: Optimize directories
------------------------------

[](#option-b-optimize-directories)

Call `Blaze::optimize()` in your `AppServiceProvider` to enable Blaze for entire directories at once:

```
use Livewire\Blaze\Blaze;

/**
 * Bootstrap any application services.
 */
public function boot(): void
{
    Blaze::optimize()->in(resource_path('views/components'));

    // ...
}
```

We recommend starting with specific directories, as your app may rely on features Blaze doesn't support. Gradually expand coverage and verify compatibility with [known limitations](#limitations).

```
Blaze::optimize()
    ->in(resource_path('views/components/button'))
    ->in(resource_path('views/components/modal'));
```

To exclude a subdirectory, use `compile: false`.

```
Blaze::optimize()
    ->in(resource_path('views/components'))
    ->in(resource_path('views/components/legacy'), compile: false);
```

You may also enable different optimization strategies per folder.

```
Blaze::optimize()
    ->in(resource_path('views/components/icons'), memo: true)
    ->in(resource_path('views/components/cards'), fold: true);
```

Component-level `@blaze` directives override directory-level settings.

Limitations
===========

[](#limitations)

Blaze supports all essential features and produces HTML output identical to Blade. While the focus is on maximizing performance with full compatibility, there are some limitations to be aware of:

- **Class-based components** are not supported
- **The `$component` variable** is not available
- **View composers / creators / lifecycle events** do not fire
- **Auto-injecting `View::share()` variables** is not supported

    Access shared data manually using `$__env->shared('key')`
- **Cross boundary `@aware`** between Blade and Blaze

    Both parent and child must use Blaze for values to propagate
- **Rendering Blaze components using `view()`** will not work

    Blaze components can only be rendered using the component tag

Optimization Strategies
=======================

[](#optimization-strategies)

By default, Blaze uses the **Function Compiler**. It works for virtually all components and provides significant performance improvements — sufficient for most use cases.

For even greater gains, you may consider the advanced strategies below. These require additional thought and care.

StrategyParameterDefaultBest For[Function Compiler](#function-compiler)`compile``true`General use[Runtime Memoization](#runtime-memoization)`memo``false`Repeated components[Compile-Time Folding](#compile-time-folding)`fold``false`Maximum performanceFunction Compiler
=================

[](#function-compiler)

This is the default behavior. It's a reliable optimization that requires no changes and can be safely applied to nearly all templates without concerns about stale data or dynamic content.

Rendering 25,000 anonymous components in a loop:

ScenarioBladeBlazeReductionNo attributes500ms13ms97.4%Attributes only457ms26ms94.3%Attributes + merge()546ms44ms91.9%Props + attributes780ms40ms94.9%Default slot460ms22ms95.1%Named slots696ms49ms93.0%@aware (nested)1,787ms129ms92.8%> These numbers reflect rendering pipeline overhead. If your templates perform expensive operations internally, that work will still affect performance.

How it works
------------

[](#how-it-works)

When you enable Blaze, your templates are compiled into optimized PHP functions that skip the standard rendering pipeline while maintaining compatibility with Blade syntax.

```
@blaze

@props(['type' => 'button'])

merge(['type' => $type]) }}>
    {{ $slot }}

```

Compiles to:

```
function _c4f8e2a1($__data, $__slots) {
    $type = $__data['type'] ?? 'button';
    $attributes = new BlazeAttributeBag($__data);
    // ...
}
```

When you include the component, Blaze calls this function directly.

```
Send
```

Becomes:

```
_c4f8e2a1(['type' => 'submit'], ['default' => 'Send']);
```

Runtime Memoization
===================

[](#runtime-memoization)

This strategy is ideal for icons, avatars, and other elements that frequently appear with the same props. When a memoized component appears multiple times on a page, it renders only once.

Important

Memoization only works on components without slots.

How it works
------------

[](#how-it-works-1)

The output is cached based on the component name and props passed to it.

```
@blaze(memo: true)

@props(['name'])

```

When you include the component, Blaze wraps it in a cache check and only renders it the first time it's used with those props.

```

```

Becomes:

```