skills.rest
trusted-american
trusted-americanOFFICIAL
Explore all skills by this author →
WebsiteGitHub

tracked-built-ins

Track mutations of Glimmer state structures with TrackedArray, TrackedObject, TrackedMap, and TrackedSet wrappers.

Updated Mar 24, 2026
Search Tags:#state-management#ember#glimmer#tracked-built-ins#autotracking#tracked-array#tracked-object
One-click install
npx skills add https://github.com/trusted-american/marketplace --skill tracked-built-ins
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tracked-built-ins
Source: https://github.com/trusted-american/marketplace/tree/main/plugins/a3-plugin/skills/tracked-built-ins
Command: npx skills add https://github.com/trusted-american/marketplace --skill tracked-built-ins

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Glimmer templates re-render primarily on property reassignment, but mutating contained state objects and collections does not trigger updates. tracked-built-ins provides wrapper types for Array, Object, Map, and Set that automatically track mutations and reads, keeping UI in sync without manual re-creation.

Core Features & Use Cases

  • TrackedArray, TrackedObject, TrackedMap, TrackedSet replace native data structures to emit change notifications on mutations.
  • Reads and mutations are tracked so templates and computed properties update automatically without refactoring code.
  • Ideal for long-lived component state that evolves via in-place edits, insertions, removals, and dynamic keys.

Quick Start

Install and start using TrackedArray, TrackedObject, TrackedMap, and TrackedSet to enable automatic UI updates.

Frequently Asked Questions about tracked-built-ins

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Why do my Ember Glimmer templates fail to re-render when I mutate an array or object in place?▼

Glimmer templates re-render on property reassignment, so mutating contained state objects does not trigger UI updates automatically. You must track mutations of common state data structures to ensure UI reactivity and keep templates in sync.

How do I track mutations on Maps and Sets in Glimmer without manually re-creating references?▼

Use TrackedMap and TrackedSet wrappers to replace native data structures, automatically tracking both reads and mutations. This emits change notifications for in-place edits and dynamic keys without requiring manual reference re-creation.

Can I use tracked-built-ins wrappers for long-lived component state like form inputs and caches?▼

Yes, TrackedArray, TrackedObject, TrackedMap, and TrackedSet are ideal for long-lived component state that evolves via insertions, removals, and in-place edits. They apply to dynamic UI lists, form state, caches, and mutable collections.

What is the best way to enable autotracking for dynamic UI lists in Ember?▼

The best way to enable autotracking is replacing native Arrays and Objects with TrackedArray and TrackedObject. Reads and mutations are tracked so templates and computed properties update automatically without refactoring existing code.

Do I need to refactor my code to use TrackedObject for my mutable collections?▼

No refactoring is needed to use TrackedObject. You replace your native Object with the wrapper, and both reads and mutations are tracked automatically, ensuring computed properties and templates update without changing your logic.

Related Skills

Explore More Software Engineering Skills→
jaredlanderjaredlander

javascript-ember

Build Ember.js applications using Octane conventions and Glimmer components.

Community
Advanced
mohamedgshoaibmohamedgshoaib
5

react-hook-form

Apply 41 performance rules to minimize re-renders in React Hook Form.

Community
Advanced
trusted-americantrusted-american

xstate-statecharts

Model complex UI state machines with XState 5 and ember-statechart-component.

Official
Advanced
pyinxpyinx
14

react-native-best-practices

Optimize React Native app performance by reducing re-renders and frame drops.

Community
Advanced