What are Svelte conditional and loop template blocks?

Answer

Svelte provides template blocks for logic in markup. {#if}: {#if user.isAdmin} <AdminPanel /> {:else if user.isEditor} <EditorPanel /> {:else} <UserPanel /> {/if}. {#each}: {#each items as item, index (item.id)} <div>{index}: {item.name}</div> {:else} <p>No items</p> {/each}. The (item.id) is a key for efficient DOM reconciliation — similar to React's key prop. {#await}: handle promises: {#await promise} <Loading /> {:then data} <p>{data}</p> {:catch error} <p>Error: {error.message}</p> {/await}. {#key}: destroy and recreate a block when an expression changes. These blocks compile to efficient DOM manipulation code with no runtime overhead.