Created
October 24, 2023 09:01
-
-
Save jpvincent/bc1a2327d14869685f2e2c78e3ab6c28 to your computer and use it in GitHub Desktop.
Lazy loading svelte component
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
let lazyModalComponent; | |
let isPending = false; | |
function openModal() { | |
isPending = true; | |
lazyModalComponent = import(`./Modal.svelte`); | |
lazyModalComponent.catch((error) => { | |
// gestion en cas d'erreur de connexion ici | |
}).finally(() => { | |
isPending = false; | |
}); | |
} | |
</script> | |
<button on:click={openModal}> | |
{#if isPending} | |
Loading | |
{:else} | |
Open | |
{/if} | |
</button> | |
{#if lazyModalComponent} | |
{#await lazyModalComponent then { default: Modal }} | |
<Modal /> | |
{/await} | |
{/if} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
tiré du code de Julien Pradet https://www.julienpradet.fr/tutoriels/comment-alleger-son-javascript/