Though it is possible to use a third-party lazy-loading library for images within your Autocomplete item templates (templates.item
), this will only work if state changes for the image (such as an update of the <img class=
) are performed within templates.item()
.
Autocomplete uses Preact under the hood to render templates, which means it has its own rendering lifecycle. Any changes performed in onStateChange
are outside of this lifecycle and are not in sync, which can show breaking behavior or side effects.
Alternatively, you can also set <img loading="lazy"/>
to benefit from out-of-the-box (but non-customizable) support from the browser.