Optimize question about livewire component

i have a Optimize question

i want to build E-commerce site
and i build that page with a list of products with pagination

i want to make livewire action on every product
what is the best why and the Optimize to make that:

  1. a one livewire component with a foreach loop and one
    somthing like that: in a livewire component html:
    @foreach ($products as $product)
    livewire:click=‘dosomothing($product)’>product name<

** ------------------ or ------------------ **

  1. a foreach loop and then pass the product to a livewire component
    and because of that i get a lot of components in the page
    somthing like that:
    @foreach ($products as $product)
    @livewire(‘productpage’, [‘product’ => $product])

thanks :slight_smile:

Would the first option not be best? Build a paginated data table (or a list) of the various products and then when you click on them open a new page or a modal with that products details?

The answer to your question depends very much on functionality of your page. If you would need to change/update single product without reloading all others, then option 2, otherwise option 1 is fine.

So basically if you are unsure now, then start with option 1 and then extend it to option 2 when it would be required.