Skip to content

refactor(site): expose time values in render functions as centralized, pure state #17587

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Draft
wants to merge 12 commits into
base: main
Choose a base branch
from

Conversation

Parkreiner
Copy link
Member

@Parkreiner Parkreiner commented Apr 28, 2025

WIP. Mainly getting this in place to get feedback on the interfaces, but I might not be able to start this officially until the next sprint.

Examples of using the hook

Getting a new date from the hook (the hook will trigger an update to TimeSync every second, unless there is another consumer that's mounted and has a faster update interval)

const date = useTimeSync({
  idealRefreshIntervalMs: 1_000,
});

Getting a one-time date from the hook (the hook can still re-render if there are other consumers that trigger an update)

const date = useTimeSync({
  idealRefreshIntervalMs: Number.POSITIVE_INFINITY,
});

Getting a derived value from the hook (even if there is an update for the underlying TimeSync class, the hook will only re-render if the result of the select call is different compared to last time)

const year = useTimeSync({
  idealRefreshIntervalMs: 3_000,
  select: (date) => date.getFullYear()
});

With explicit type parameter

const year = useTimeSync<string>({
  idealRefreshIntervalMs: 3_000,
  select: (date) => date.getFullYear()
});

@Parkreiner Parkreiner self-assigned this Apr 28, 2025
@Emyrk
Copy link
Member

Emyrk commented Apr 28, 2025

@Parkreiner does this have any relation to the Time Variance Authority (TVA) in the Marvel Universe?

@Parkreiner
Copy link
Member Author

@Parkreiner does this have any relation to the Time Variance Authority (TVA) in the Marvel Universe?

No, but that is where Class Variance Authority got its name from (which we use in the frontend to manage style variants)

@Parkreiner Parkreiner changed the title refactor(site): create centralized time authority for codebase refactor(site): expose time values in render functions as centralized, pure state Apr 28, 2025
* updates are happening too frequently in React, restructure how you're
* composing your components to minimize the costs of re-renders.
*/
export class TimeSync implements TimeSyncApi {
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Might end up splitting this class up into a base TimeSync class with a smaller, framework-agnostic API, and a ReactTimeSync class that composes TimeSync into it

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants