Utilização

Limit the work an interaction performs.

tsx
// Limit the work an interaction performs.
import { Button, Text, VStack, signal } from 'kuito';
import { costOf, press, render, screen, test, type CostBudget } from 'kuito/tests';

function Like() {
  const liked = signal(false);

  return (
    <VStack>
      <Text color={liked.value ? '#ff3b30' : '#8e8e93'}>♥</Text>
      <Button onPress={() => (liked.value = !liked.value)}>Like</Button>
    </VStack>
  );
}

// A color change repaints one view: no layout, no new views.
const repaintOnly: CostBudget = { layoutPasses: 0, viewsCreated: 0, propWrites: 1 };

test('a like only repaints the heart', async () => {
  await render(<Like />);

  (await costOf(() => press(screen.getByText('Like')))).toStayWithin(repaintOnly);
});

Declaração do tipo

ts
export type CostBudget = Partial<Counts>;

Membros 13

NomeTipoObrigatórioDescrição
recordsAppliednumberNãoRecords of the batches applied, the UI thread's prop writes included.
propWritesnumberNão—
wastedPropWritesnumberNãoProp writes of the value the view already had.
layoutPassesnumberNãoLayouts that computed at least one node.
wastedLayoutPassesnumberNãoLayout passes after which no box changed.
nodesLaidOutnumberNãoNodes the engine computed rather than took from its cache.
nodesFramednumberNãoBoxes the renderer took from a pass.
wastedFramesnumberNãoBoxes taken unchanged.
measureCallsnumberNãoLeaves measured: each one a miss of the engine's measure cache.
wastedMeasuresnumberNãoMeasures that answered what the leaf measured before it was marked dirty.
uiEntriesnumberNãoCalls into the UI-thread kernel: operations received, events, frames.
wastedUiEntriesnumberNãoEvents the UI-thread kernel had no handler for.
viewsCreatednumberNãoViews made with a native view: a flattened node has none.
Gerado a partir das declarações TypeScript públicas: assinaturas, props e predefinições vêm da fonte verificada, as descrições da sua JSDoc. Nenhuma predefinição é inventada.