Skip to content

LQIP not updated when src changes #1583

@simonihmig

Description

@simonihmig

I see LQIP styles (bg image) only getting applied on the initial "use" of the component. In a scenario where the src argument changes dynamically, but the component instance is reused, it would properly load the new image, but its LQIP styles are not getting applied while loading.

I experienced this with the React component, but I believe all implementations are subject to this bug. All have an isLoaded reactive property (@tracked, useState, signal, rune, whatever they are called) that is initially false and gets set to true on load event. But this should be "scoped" to the src, or reset when src changes, as changing src would trigger a new load and a new load event.

It'll be a bit interesting how to best implement this in terms of proper reactivity patterns. Ideally, you would only have tracked state or derived state, this would be something in-between, as it is tracked state but also depends on other tracked state (src).

For Ember there is a @trackedReset decorator covering this use case, for other frameworks it remains to be seen what the proper APIs to use here are...

Metadata

Metadata

Assignees

No one assigned

    Labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions