Skip to content

Commit

Permalink
refactor: use vue hydration to avoid re-rendering whole page
Browse files Browse the repository at this point in the history
This avoids a flash due to animations/transitions being triggered.
  • Loading branch information
maartenbreddels committed Nov 27, 2023
1 parent 9434546 commit 8f6c363
Showing 1 changed file with 6 additions and 4 deletions.
10 changes: 6 additions & 4 deletions solara/server/templates/solara.html.j2
Original file line number Diff line number Diff line change
Expand Up @@ -205,14 +205,16 @@
{% endif %}
{% if theme.variant == "auto" %}
{% endif %}
{% if theme.variant == "light" %}
{%- if theme.variant == "light" -%}
<div id="app" class="v-application v-application--is-ltr theme--light" data-app="true">
{% elif theme.variant == "dark" %}
{%- elif theme.variant == "dark" -%}
<div id="app" class="v-application v-application--is-ltr theme--dark" data-app="true">
{% endif %}
{%- endif -%}
{{ pre_rendered_html|safe }}
{%- if pre_rendered_html|length == 0 -%}
{# next div is used in ssg code to see if vue took over rendering #}
<div id="pre-rendered-html-present" style="display: none"></div>
{%- endif -%}
</div>
{% block after_pre_rendered_html %}{% endblock %}
{% if vue3 == True %}
Expand Down Expand Up @@ -339,7 +341,7 @@
// so we mount it when loading becomes false
if (solara.preRendered && !this.mounted) {
this.isMounted = true;
this.$mount("#app")
this.$mount("#app", true);
} else {
this.isMounted = true;
}
Expand Down

0 comments on commit 8f6c363

Please sign in to comment.