Skip to content
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鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

rfc: introduce "connected" and "disconnected" lifecycle hooks to FASTElement #6760

Open
nicholasrice opened this issue Jun 9, 2023 · 0 comments
Labels
area:fast-element Pertains to fast-element status:under-consideration Issue is being reviewed by the team.

Comments

@nicholasrice
Copy link
Contributor

nicholasrice commented Jun 9, 2023

馃挰 RFC

A feature I've been considering recently is the addition of a "connected" and "disconnected" lifecycle hook to FASTElement instances. These callbacks would be invoked by the ElementController just prior to exiting the connect() and disconnect() methods, respectively.

馃敠 Context

Why would we want this? The browser already calls connectedCallback() and disconnectedCallback(), right? It does, but there-in lies the problem. In SSR scenarios, the defer-hydration attribute will prevent the ElementController from performing hydration work during the connectedCallback, including initializing template bindings, connecting behaviors, and re-binding observable values, only doing so after the defer-hydration attribute is removed. This means the element and ElementController's state within the connectedCallback could be very different between CSR and SSR+Hydration.

By introducing connected (and disconnected) and invoking the hooks from the ElementController, authors can craft components that operate under more consistent conditions between CSR and SSR + Hydration. Additionally, using these hooks and failing to call the super method would not break the ElementController.

馃捇 Examples

class MyElement extends FASTElement {
    connected() {
       // Always invoked after the ElementController has done connection work,
       // either during connectedCallback() in CSR scenarios or asynchronously
       // during defer-hydration scenarios.
    }
}
@nicholasrice nicholasrice added status:triage New Issue - needs triage area:fast-element Pertains to fast-element and removed status:triage New Issue - needs triage labels Jun 9, 2023
@janechu janechu added the status:under-consideration Issue is being reviewed by the team. label May 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area:fast-element Pertains to fast-element status:under-consideration Issue is being reviewed by the team.
Projects
None yet
Development

No branches or pull requests

2 participants