Is there a way to avoid repeating $todo.data.todo.id etc?

[frederikhors]

Using the Svelte example in docs:

<script>
  import { operationStore, query } from '@urql/svelte';

  const todos = operationStore(`
    query {
      todos {
        id
        title
      }
    }
  `);

  query(todos);
</script>

{#if $todos.fetching}
  <p>Loading...</p>
{:else if $todos.error}
  <p>Oh no... {$todos.error.message}</p>
{:else}
  <ul>
    {#each $todos.data.todos as todo}
      <li>{todo.title}</li>
    {/each}
  </ul>
{/if}

is there a way I can avoid to use $todos.data.todos?

Sometimes I have a big object and I'm repeating $todo.data.todo.id, $todo.data.todo.name etc.

Something like:

const [data, error, fetching] = operationStore()

[frederikhors]

I think I can use this but I don't know if is good enough (performances):

const todos = operationStore();

query(todos);

$: data = $todos.data?.todos

What do you think?

[JoviDeCroock]

Assigning to a variable should not really incur a performance cost 😅 you can even try destructuring

[frederikhors]

Destructuring for array, but for object?