💧 Indicating hydration status by svelte-store
npm i svelte-hydratedThe $hydrated store is updated to true at the next tick when the browser is true
<script>
import { hydrated } from 'svelte-hydrated'
import { slide } from 'svelte/transition'
</script>
{#if $hydrated}
<h2 transition:slide>Hydrated</h2>
{:else}
<h2 transition:slide>Not Hydrated</h2>
{/if}The browser ($app/environment) is useful for identifying the execution environment of the code, but its value is determined before the first rendering is started.
This means that transition etc. will not be triggered when hydration completes.
The $hydrated store is updated to true at the next tick when the browser is true, making it simpler to set transition.
![wraith-ci[bot] avatar](https://avatars.githubusercontent.com/in/420132?v=4 "wraith-ci[bot]")
![renovate[bot] avatar](https://avatars.githubusercontent.com/in/2740?v=4 "renovate[bot]")
![dependabot[bot] avatar](https://avatars.githubusercontent.com/in/29110?v=4 "dependabot[bot]")
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent