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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add SPA Integration #2899

Closed
wants to merge 7 commits into from
Closed

Add SPA Integration #2899

wants to merge 7 commits into from

Conversation

natemoo-re
Copy link
Member

@natemoo-re natemoo-re commented Mar 26, 2022

Changes

  • Name TBD.
  • The integration system made adding this a breeze! This is much cleaner that the previous attempt in feat/spa.
  • Adds a SPA integration
    • Powered by micromorph, the same diffing engine that powers our HMR for astro dev
    • Island state is preserved between navigations by default. Integration accepts a { persistent: false } option to disable this behavior.

Testing

Manually using the new SPA example

Docs

TODO

@changeset-bot
Copy link

changeset-bot bot commented Mar 26, 2022

⚠️ No Changeset found

Latest commit: 7833459

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@github-actions github-actions bot added pkg: astro Related to the core `astro` package (scope) pkg: example Related to an example package (scope) labels Mar 26, 2022
packages/astro/src/runtime/client/idle.ts Outdated Show resolved Hide resolved
packages/astro/src/runtime/client/idle.ts Outdated Show resolved Hide resolved
packages/astro/src/runtime/client/idle.ts Outdated Show resolved Hide resolved
packages/astro/src/runtime/client/idle.ts Outdated Show resolved Hide resolved
packages/astro/src/runtime/client/idle.ts Outdated Show resolved Hide resolved
packages/astro/src/runtime/server/index.ts Outdated Show resolved Hide resolved
packages/astro/src/runtime/server/index.ts Outdated Show resolved Hide resolved
const uid = island.getAttribute('uid');
const current = document.querySelector(`astro-root[uid="${uid}"]`);
if (current) {
current.dataset.persist = true;
Copy link
Member Author

Choose a reason for hiding this comment

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

data-persist is a special attribute that instructs micromorph to leave a node in place during diffing.

packages/integrations/spa/client-persist.js Show resolved Hide resolved
@natemoo-re
Copy link
Member Author

Many of the necessary hydration changes are going to land in #3455, at which point this PR can be slimmed down significantly.

@github-actions github-actions bot added the pkg: integration Related to any renderer integration (scope) label Jun 1, 2022
@github-actions
Copy link
Contributor

github-actions bot commented Jun 1, 2022

⚖️ Bundle Size Check

Latest commit: 7833459

File Old Size New Size Change
client:media 1005 B 1.04 KB + 59 B
client:visible 1.08 KB 1.14 KB + 59 B

@natemoo-re
Copy link
Member Author

@bholmesdev is exploring this area this week. Don't want to close this PR since it's gotten quite a bit of attention, but Ben might have some more updates to share soon.

@bholmesdev
Copy link
Contributor

Erm, not this week sadly 😆 But I have an RFC planned, yes!

@FredKSchott
Copy link
Member

No longer in scope for v1.0. Will revisit post v1.0.

@ZiadJ
Copy link

ZiadJ commented Sep 6, 2022

Hopefully, there will be a roadmap for SPA support soon, now that we're past v1.0.

@emmsdan
Copy link

emmsdan commented Jan 29, 2023

Is there ever going to be an SPA support. Looking at building a user dashboard, but a bit skeptical about doing that

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pkg: astro Related to the core `astro` package (scope) pkg: example Related to an example package (scope) pkg: integration Related to any renderer integration (scope)
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants