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

feat(ssr): transition appear work with SSR #8859

Merged
merged 22 commits into from
Oct 24, 2023

Conversation

edison1105
Copy link
Member

@edison1105 edison1105 commented Jul 27, 2023

close #6951

Solution:

  • Compile phase: If Transtion with appear, wrap it in template after compilation:
<Transition appear>
  <div>foo</div>
</Transition>
function ssrRender(_ctx, _push, _parent, _attrs, $props, $setup, $data, $options) {
  _push(`<template><div${_ssrRenderAttrs(_attrs)}>foo</div></template>`)
}
  • Hydration phase: Replace the template element with an element within the template

see demo

@slavanossar
Copy link

slavanossar commented Oct 13, 2023

@posva Is it possible to get this tagged p4-important to align it with #6951? It's causing downstream issues in Nuxt that breaks enter page transitions on initial load. Thanks!

@edison1105 edison1105 added scope: transition scope: ssr ❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. ready for review This PR requires more reviews labels Oct 13, 2023
@github-actions
Copy link

github-actions bot commented Oct 20, 2023

Size Report

Bundles

File Size Gzip Brotli
runtime-dom.global.prod.js 86.5 kB (+503 B) 32.9 kB (+171 B) 29.7 kB (+164 B)
vue.global.prod.js 132 kB (+503 B) 49.6 kB (+174 B) 44.5 kB (+167 B)

Usages

Name Size Gzip Brotli
createApp 47.9 kB (+26 B) 18.9 kB (+9 B) 17.3 kB (+56 B)
createSSRApp 51.2 kB (+503 B) 20.2 kB (+185 B) 18.4 kB (+174 B)
defineCustomElement 50.3 kB (+26 B) 19.7 kB (+7 B) 17.9 kB (-36 B)
overall 61.3 kB (+26 B) 23.7 kB (+12 B) 21.6 kB (-29 B)

@yyx990803 yyx990803 merged commit 5ea8a8a into vuejs:main Oct 24, 2023
11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
❗ p4-important Priority 4: this fixes bugs that violate documented behavior, or significantly improves perf. ready for review This PR requires more reviews scope: ssr scope: transition
Projects
Development

Successfully merging this pull request may close these issues.

Transition appear flag doesn't work in SSR
3 participants