fix: optimize preview rendering to only process changed blocks

Author: eldomagan

composer.json

@@ -27,7 +27,7 @@
     "andreiio/blade-remix-icon": "^3.6",
     "blade-ui-kit/blade-heroicons": "^2.4",
     "blade-ui-kit/blade-icons": "^1.7",
-    "craftile/laravel": "^0.4.1",
+    "craftile/laravel": "^0.4.2",
     "illuminate/contracts": "^11.0||^12.0",
     "mallardduck/blade-lucide-icons": "^1.23",
     "matthieumastadenis/couleur": "^0.1.2",

src/Http/Controllers/Admin/ThemeEditorController.php

@@ -44,7 +44,7 @@ public function index($themeCode)
             'config' => [
                 'baseUrl' => parse_url(route('visual.admin.editor', ['theme' => $themeCode]), PHP_URL_PATH),
                 'imagesBaseUrl' => Storage::disk(config('bagisto_visual.images_storage'))->url(''),
-                'storefrontUrl' => url('/').'?'.http_build_query(['_designMode' => $themeCode]),
+                'storefrontUrl' => url('/') . '?' . http_build_query(['_designMode' => $themeCode]),
                 'channels' => $this->getChannels(),
                 'defaultChannel' => core()->getDefaultChannelCode(),
                 'blockSchemas' => $this->loadBlocks(),
@@ -87,13 +87,14 @@ public function persistUpdates(Request $request)
             'updates.regions' => ['present', 'array'],
         ]);
 
-        $this->persistEditorUpdates->handle($validated);
+        $result = $this->persistEditorUpdates->handle($validated);
+        $loadedBlocks = $result['loadedBlocks'] ?? [];
 
-        $changedBlockIds = $this->extractChangedBlockIds($validated['updates']);
+        $allBlockIds = $this->buildRenderSet($validated['updates'], $loadedBlocks);
 
         $url = $request->input('template.url');
 
-        return $this->renderPreview->execute($url, $changedBlockIds);
+        return $this->renderPreview->execute($url, $allBlockIds);
     }
 
     public function persistThemeSettings(Request $request)
@@ -136,7 +137,7 @@ public function uploadImages(Request $request)
         return $images->map(function ($image) {
             $originalName = pathinfo($image->getClientOriginalName(), PATHINFO_FILENAME);
             $extension = $image->guessExtension();
-            $storedName = bin2hex($originalName).'_'.uniqid().'.'.$extension;
+            $storedName = bin2hex($originalName) . '_' . uniqid() . '.' . $extension;
 
             $path = $image->storeAs(
                 config('bagisto_visual.images_directory'),
@@ -211,15 +212,15 @@ public function icons(Request $request, Factory $factory, IconsManifest $iconsMa
 
                 $icons->push([
                     'name' => $name,
-                    'id' => $set['prefix'].'-'.$name,
+                    'id' => $set['prefix'] . '-' . $name,
                     'svg' => File::get($file->getRealPath()),
                 ]);
             }
         }
 
         return [
             'currentSet' => $selectedSet,
-            'sets' => collect($sets)->map(fn ($set, $key) => ['id' => $key, 'prefix' => $set['prefix'], 'name' => Str::headline($key)])->values(),
+            'sets' => collect($sets)->map(fn($set, $key) => ['id' => $key, 'prefix' => $set['prefix'], 'name' => Str::headline($key)])->values(),
             'icons' => $icons->values(),
         ];
     }
@@ -262,7 +263,7 @@ protected function loadBlocks()
                     'category' => $blockSchema->category,
                     'description' => $blockSchema->description,
                     'previewImageUrl' => asset($blockSchema->previewImageUrl),
-                    'isSection' => collect([SimpleSection::class, BladeSection::class, LivewireSection::class])->some(fn ($class) => is_subclass_of($blockSchema->class, $class)),
+                    'isSection' => collect([SimpleSection::class, BladeSection::class, LivewireSection::class])->some(fn($class) => is_subclass_of($blockSchema->class, $class)),
                     'enabledOn' => $blockSchema->enabledOn ?? [],
                     'disabledOn' => $blockSchema->disabledOn ?? [],
                 ],
@@ -294,7 +295,7 @@ protected function loadTheme($themeCode)
     protected function loadTemplates()
     {
         return collect(app(\BagistoPlus\Visual\ThemeEditor::class)->getTemplates())
-            ->map(fn ($template) => [
+            ->map(fn($template) => [
                 'template' => $template->template,
                 'label' => $template->label,
                 'icon' => $template->icon,
@@ -331,7 +332,7 @@ protected function translateSettingsSchema(array $settingsSchema): array
 
     protected function getChannels()
     {
-        return core()->getAllChannels()->map(fn ($channel) => [
+        return core()->getAllChannels()->map(fn($channel) => [
             'code' => $channel->code,
             'name' => $channel->name,
             'locales' => $channel->locales,
@@ -342,7 +343,7 @@ protected function getChannels()
     protected function getChannelCodes(): array
     {
         return $this->getChannels()
-            ->map(fn ($channel) => $channel['code'])
+            ->map(fn($channel) => $channel['code'])
             ->toArray();
     }
 
@@ -354,28 +355,66 @@ protected function getLocaleCodes(string $channel): array
             return [];
         }
 
-        return $channel['locales']->map(fn ($locale) => $locale['code'])->toArray();
+        return $channel['locales']->map(fn($locale) => $locale['code'])->toArray();
     }
 
     protected function getVisualThemes(): array
     {
         return collect(config('themes.shop', []))
-            ->filter(fn ($config) => $config['visual_theme'] ?? false)
-            ->map(fn ($config) => $config['code'])
+            ->filter(fn($config) => $config['visual_theme'] ?? false)
+            ->map(fn($config) => $config['code'])
             ->toArray();
     }
 
     /**
-     * Extract changed block IDs from updates.
-     * Tree expansion (parents + children) happens during render via BlockRenderFilter.
+     * Build complete render set: changed blocks + all their parents + all their children.
      */
-    protected function extractChangedBlockIds(array $updates): array
+    protected function buildRenderSet(array $updates, array $loadedBlocks): array
     {
         $changes = $updates['changes'] ?? [];
-
-        return array_merge(
+        $changedIds = array_merge(
             $changes['added'] ?? [],
             $changes['updated'] ?? []
         );
+
+        $renderSet = [];
+
+        foreach ($changedIds as $id) {
+            $renderSet[] = $id;
+
+            // Walk up parent chain
+            $currentId = $id;
+            while (isset($loadedBlocks[$currentId]['parentId']) && $loadedBlocks[$currentId]['parentId']) {
+                $parentId = $loadedBlocks[$currentId]['parentId'];
+                $renderSet[] = $parentId;
+
+                // If parent is a repeated block, include its entire children structure
+                if (isset($loadedBlocks[$parentId]['repeated']) && $loadedBlocks[$parentId]['repeated']) {
+                    $this->addChildren($parentId, $loadedBlocks, $renderSet);
+                }
+
+                $currentId = $parentId;
+            }
+
+            // Walk down children
+            $this->addChildren($id, $loadedBlocks, $renderSet);
+        }
+
+        return array_unique($renderSet);
+    }
+
+    /**
+     * Recursively add all children to the render set.
+     */
+    protected function addChildren(string $blockId, array $loadedBlocks, array &$renderSet): void
+    {
+        if (! isset($loadedBlocks[$blockId]['children'])) {
+            return;
+        }
+
+        foreach ($loadedBlocks[$blockId]['children'] as $childId) {
+            $renderSet[] = $childId;
+            $this->addChildren($childId, $loadedBlocks, $renderSet);
+        }
     }
 }

src/Persistence/RenderPreview.php

@@ -6,6 +6,7 @@
 use Craftile\Laravel\Facades\Craftile;
 use Craftile\Laravel\View\JsonViewParser;
 use Illuminate\Http\Request;
+use Illuminate\Support\Str;
 
 class RenderPreview
 {
@@ -20,17 +21,20 @@ public function execute(string $url, ?array $blockIds = null): string
         $baseUrl = rtrim(config('app.url'));
         $basePath = parse_url($baseUrl, PHP_URL_PATH);
 
+        // Store block IDs in session with unique key if provided
+        if ($blockIds !== null && count($blockIds) > 0) {
+            $key = Str::random(16);
+            session()->put("visual.render.{$key}", $blockIds);
+
+            $separator = str_contains($url, '?') ? '&' : '?';
+            $url .= $separator.'_vkey='.$key;
+        }
+
         // Handle subdirectory installs by redirecting
         if ($basePath !== null) {
             return redirect($url);
         }
 
-        // Append _blocks query parameter if specific blocks are requested
-        if ($blockIds !== null && count($blockIds) > 0) {
-            $separator = str_contains($url, '?') ? '&' : '?';
-            $url .= $separator.'_blocks='.implode(',', $blockIds);
-        }
-
         // Reset Craftile's preview mode cache before sub-request
         Craftile::detectPreviewUsing(function () {
             return \BagistoPlus\Visual\Facades\ThemeEditor::inDesignMode();

src/Providers/CoreServiceProvider.php

@@ -106,7 +106,7 @@ protected function bootCraftile(): void
         Craftile::normalizeTemplateUsing(new \BagistoPlus\Visual\Support\TemplateNormalizer);
 
         Craftile::checkIfBlockCanRenderUsing(function (BlockData $blockData) {
-            if (! ThemeEditor::inDesignMode() || ! request()->has('_blocks')) {
+            if (! ThemeEditor::inDesignMode() || ! request()->has('_vkey')) {
                 return ! $blockData->disabled;
             }
 
@@ -150,7 +150,7 @@ protected function registerBlockCompilers(): void
             // Register Livewire blocks as Livewire components when they're discovered
             Event::listen(BlockSchemaRegistered::class, function (BlockSchemaRegistered $event) {
                 if ($event->schema->class && is_subclass_of($event->schema->class, \Livewire\Component::class)) {
-                    $componentName = 'craftile-'.$event->schema->slug;
+                    $componentName = 'craftile-' . $event->schema->slug;
                     \Livewire\Livewire::component($componentName, $event->schema->class);
                 }
             });
@@ -161,13 +161,13 @@ protected function bootShopRoutes(): void
     {
         Route::prefix('/visual/template-preview')
             ->middleware(['web', 'locale', 'theme', 'currency'])
-            ->group(__DIR__.'/../../routes/shop.php');
+            ->group(__DIR__ . '/../../routes/shop.php');
     }
 
     protected function bootViewsAndTranslations(): void
     {
-        $this->loadViewsFrom(__DIR__.'/../../resources/views', 'visual');
-        $this->loadTranslationsFrom(__DIR__.'/../../resources/lang', 'visual');
+        $this->loadViewsFrom(__DIR__ . '/../../resources/views', 'visual');
+        $this->loadTranslationsFrom(__DIR__ . '/../../resources/lang', 'visual');
     }
 
     protected function bootMiddlewares(): void
@@ -213,11 +213,11 @@ protected function bootCommands(): void
     protected function bootPublishAssets(): void
     {
         $this->publishes([
-            __DIR__.'/../../public/vendor/bagistoplus' => public_path('vendor/bagistoplus'),
+            __DIR__ . '/../../public/vendor/bagistoplus' => public_path('vendor/bagistoplus'),
         ], ['public', 'visual', 'visual-assets']);
 
         $this->publishes([
-            __DIR__.'/../../config/bagisto-visual.php' => config_path('bagisto_visual.php'),
+            __DIR__ . '/../../config/bagisto-visual.php' => config_path('bagisto_visual.php'),
         ], ['config', 'visual', 'visual-config']);
     }
 
@@ -241,8 +241,8 @@ protected function bootTemplates(): void
 
     protected function registerConfigs(): void
     {
-        $this->mergeConfigFrom(__DIR__.'/../../config/bagisto-visual.php', 'bagisto_visual');
-        $this->mergeConfigFrom(__DIR__.'/../../config/svg-iconmap.php', 'bagisto_visual_iconmap');
+        $this->mergeConfigFrom(__DIR__ . '/../../config/bagisto-visual.php', 'bagisto_visual');
+        $this->mergeConfigFrom(__DIR__ . '/../../config/svg-iconmap.php', 'bagisto_visual_iconmap');
     }
 
     protected function registerSingletons(): void
@@ -265,7 +265,7 @@ protected function registerCustomUrlGenerator(): void
 
             return new UrlGenerator(
                 $routes,
-                $app->rebinding('request', fn ($app, $request) => $app['url']->setRequest($request)),
+                $app->rebinding('request', fn($app, $request) => $app['url']->setRequest($request)),
                 $app['config']['app.asset_url']
             );
         });

src/Support/BlockRenderFilter.php

@@ -7,78 +7,39 @@
 
 class BlockRenderFilter
 {
-    protected ?array $renderSet = null;
+    protected array $blockIds;
 
-    protected array $processed = [];
-
-    /**
-     * Check if a block should be rendered based on the _blocks query parameter.
-     */
-    public function shouldRender(BlockData $blockData): bool
-    {
-        if ($this->renderSet === null) {
-            $this->buildRenderSet();
-        }
-
-        return isset($this->renderSet[$blockData->id]);
-    }
-
-    /**
-     * Build the set of blocks to render from query parameter.
-     */
-    protected function buildRenderSet(): void
+    public function __construct()
     {
-        $changedBlocks = explode(',', request()->query('_blocks', ''));
-        $this->renderSet = array_flip($changedBlocks);
+        $key = request()->query('_vkey');
 
-        foreach ($changedBlocks as $blockId) {
-            $this->expandBlockTree($blockId);
+        if ($key) {
+            $this->blockIds = session()->get("visual.render.{$key}", []);
+            session()->forget("visual.render.{$key}");
+        } else {
+            $this->blockIds = [];
         }
     }
 
     /**
-     * Recursively expand block tree to include all parents and children.
+     * Check if a block should be rendered.
      */
-    protected function expandBlockTree(string $blockId): void
+    public function shouldRender(BlockData $blockData): bool
     {
-        if (isset($this->processed[$blockId])) {
-            return;
+        // No filter = render all blocks
+        if (empty($this->blockIds)) {
+            return true;
         }
 
-        $this->processed[$blockId] = true;
-
-        try {
-            $blockData = BlockDatastore::getBlock($blockId);
-
-            if (! $blockData) {
-                return;
-            }
-
-            $this->renderSet[$blockData->id] = true;
-
-            // Walk up: include all parents
-            if ($blockData->parentId) {
-                $this->expandBlockTree($blockData->parentId);
-            }
-
-            // Walk down: include all children
-            if ($blockData->hasChildren()) {
-                foreach ($blockData->childrenIds() as $childId) {
-                    $this->expandBlockTree($childId);
-                }
-            }
-        } catch (\Exception $e) {
-            // Block not found or error - skip silently
-            return;
-        }
+        // Check if block is in render set
+        return in_array($blockData->id, $this->blockIds);
     }
 
     /**
      * Reset the filter state (useful for testing).
      */
     public function reset(): void
     {
-        $this->renderSet = null;
-        $this->processed = [];
+        $this->blockIds = [];
     }
 }