Explain the widget tree and how it updates.

Every widget is a lightweight configuration object. Widgets are rebuilt often and should stay cheap. The element tree is the long-lived structure that connects widgets to render objects and preserves state. The render tree performs layout, painting and hit testing.

Widget build(BuildContext context) {
  return Padding(
    padding: const EdgeInsets.all(16),
    child: Column(
      mainAxisSize: MainAxisSize.min,
      children: const [
        Text('Account'),
        SizedBox(height: 8),
        Card(child: ListTile(title: Text('Billing'))),
      ],
    ),
  );
}

What happens on setState

• The framework marks the element dirty and schedules a frame
• build runs again and returns a new widget subtree
• Elements compare old and new widget runtime type and key
• Matching elements update their widget reference and rebuild children as needed
• Render objects update only when their configuration or constraints changed

A rebuild is not the same as a repaint. Rebuilding can be cheap if the widgets are const and the subtree is small. Repainting is expensive when it touches large areas or triggers layer allocation. Splitting widgets limits how far a rebuild propagates.