Skip to content

feat(studio): Preserve playhead/current time on Studio refresh after code change #996

@O1Anas

Description

@O1Anas

Problem

Currently, when editing a composition in Hyperframes Studio, the playhead (current time) resets to the start whenever a code change triggers a refresh (e.g., updating padding, element styles, or HTML structure). This can be disruptive, especially when iteratively adjusting an element's appearance or timing, as users must repeatedly scrub back to the previous time after every code edit or hot reload.

Proposed solution

Preserve and restore the current playhead time (timeline seek position) during Studio composition refreshes caused by code changes:

  1. Before triggering a refresh, capture and persist the current playhead time (e.g., via React state, store, or URL hash).
  2. After the composition and player reload, programmatically seek to the saved time before resuming playback or allowing editing.

Ideally, the player would seamlessly keep the playhead at its previous position whenever the composition's visual code or structure changes, making the editing process much smoother.

Additional context

See related implementation details:

  • The playhead time is tracked in usePlayerStore and through liveTime.
  • Light refreshes (refreshKey, refreshPlayer()) for HMR use setRefreshKey but don't always sync with currentTime.

Relevant code references:

Implementation would improve UX during rapid iteration when styling or timing elements, especially in longer compositions.

No existing issues were found for this feature at the time of filing.

Metadata

Metadata

Assignees

Labels

enhancementNew feature or request

Type

No type
No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions