filamentphp / filament

A collection of beautiful full-stack components for Laravel. The perfect starting point for your next app. Using Livewire, Alpine.js and Tailwind CSS.
https://filamentphp.com
MIT License
18.21k stars 2.85k forks source link

ImageColumn checking image existence causes component rendering to become very very slow #9959

Closed instanceofman closed 10 months ago

instanceofman commented 10 months ago

Package

filament/tables

Package Version

v3.0.94

Laravel Version

10.33.0

Livewire Version

v3.1.0

PHP Version

PHP 8.1.26

Problem description

I'm using R2 (cloudflare s3 storage) to host my app's images. I have problem rendering component which use ImageColumn. Checking the profiler, I discovered the cause was because method Filament\Tables\Columns\ImageColumn@getImageUrl checked for the existence of the image before displaying it, it called an http request, so it make rendering slow...

Let see demo in the attachments:

  1. When use ImageColumn: before

  2. Profiler shown profiling

  3. When I comment out the ImageColumn after

  4. Filament\Tables\Columns\ImageColumn@getImageUrl method

Expected behavior

It should not take ~820ms to render a simple component.

Steps to reproduce

I've posted in problem description yet.

Reproduction repository

https://github.com/filamentphp/filament/tree/3.x/packages/tables

Relevant log output

No response

github-actions[bot] commented 10 months ago

Hey @instanceofman! We're sorry to hear that you've hit this issue. 💛

However, it looks like you forgot to fill in the reproduction repository URL. Can you edit your original post and then we'll look at your issue?

We need a public GitHub repository which contains a Laravel app with the minimal amount of Filament code to reproduce the problem. Please do not link to your actual project, what we need instead is a minimal reproduction in a fresh project without any unnecessary code. This means it doesn't matter if your real project is private / confidential, since we want a link to a separate, isolated reproduction. That would allow us to download it and review your bug much easier, so it can be fixed quicker. Please make sure to include a database seeder with everything we need to set the app up quickly.

phpust commented 4 months ago

there is a method called checkFileExistence that you can use like follow:

ImageColumn::make('thumbnail')
             ->circular()
             ->checkFileExistence(false)
             ->extraImgAttributes(['loading' => 'lazy']);
instanceofman commented 2 weeks ago

there is a method called checkFileExistence that you can use like follow:

ImageColumn::make('thumbnail')
             ->circular()
             ->checkFileExistence(false)
             ->extraImgAttributes(['loading' => 'lazy']);

Thank you!