Skip to content

Conversation

Haroenv
Copy link
Contributor

@Haroenv Haroenv commented Sep 2, 2025

In Safari, an animation with animateTransform being in the dom (even if hidden) will cause a style recalculation on every frame. This also causes needless processor usage, and slowdown on old devices.

This PR solves this issue in instantsearch by preventing rendering of the loading icon if it shouldn't be displayed.

  • react: remove rendering
  • js: remove rendering
  • vue: already not rendering

ref: https://bugs.webkit.org/show_bug.cgi?id=298217
ref: algolia/autocomplete#1322
ref: algolia/autocomplete#1323

In Safari, an animation with animateTransform being in the dom (even if hidden) will cause a style recalculation on every frame. This also causes needless processor usage, and slowdown on old devices.

This PR solves this issue in instantsearch by preventing rendering of the loading icon if it shouldn't be displayed.

- react: remove rendering
- js: remove rendering
- vue: already not rendering

ref: https://bugs.webkit.org/show_bug.cgi?id=298217
ref: algolia/autocomplete#1322
ref: algolia/autocomplete#1323
Copy link

codesandbox-ci bot commented Sep 2, 2025

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Latest deployment of this branch, based on commit a8b30c1:

Sandbox Source
example-instantsearch-getting-started Configuration
example-react-instantsearch-getting-started Configuration
example-react-instantsearch-next-app-dir-example Configuration
example-react-instantsearch-next-routing-example Configuration
example-vue-instantsearch-getting-started Configuration

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant