Repository navigation
Smoother reloads: flash-free stylesheet swap, debounced reload, reload only changed pages - #50
Merged
Merged
Conversation
Both follow Vite's dev client. A stylesheet update changed the href of the existing <link>, which leaves the page unstyled until the new stylesheet arrives. The client now inserts a second <link> and removes the previous one when the new one loads or fails. Each message that needs a reload called location.reload() directly. They now go through one debounced pageReload(), so a save that produces several such messages reloads once. The overlay browser fixture still used the pre-0.19.0 overlay API and failed, which stopped the client fixture run before the stylesheet tests. It is rewritten for the current API.
A change in reload_dirs asked every open page for a full reload, whether or not the file affects it. Volt does not know which pages a template or content file feeds, and neither Vite nor Astro tracks that either: Vite scopes reloads to the edited .html page, and Astro reloads everything. Pages now carry an entity tag of the HTML they were rendered with. On a change the watcher broadcasts a "document" update; the client requests its page again with If-None-Match, and the dev server, which renders it anyway, answers 304 when the HTML is the same. Only another answer reloads the page. No server state or dependency graph is involved. Volt.DevServer does this for the HTML responses it adds its client to. Volt.HMR.Document describes the contract for servers that inject the client themselves, and Volt.HMR.document_update/2 sends the update. Pages without the tag reload as before.
Site generators such as Astral add Volt's client <script> to the pages they render, and the dev server left those pages alone. They now get the same entity tag, on their existing tag, and the same 304 answer, so they take part in document revalidation without any change of their own.
Merged
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Stacked on #49. Makes dev reloads less disruptive for server-rendered sites (Phoenix pages, Astral), after looking at how Vite and Astro handle the same cases.
Changes
<link>for the updated stylesheet and removes the previous one once the new one has loaded or failed, instead of changinghrefin place.pageReload(), so a save that produces several messages reloads once.reload_dirsused to reload every open page.How page revalidation works
Volt does not know which pages a template or content file feeds. Neither Vite nor Astro tracks that either: Vite scopes reloads to the edited
.htmlpage, and Astro reloads everything.Volt.DevServergets an entity tag of its HTML, in theetagheader and indata-volt-etagon the client<script>.documentupdate instead of a full reload.If-None-Match. The server renders it, as it would for a reload, and answers304when the HTML is the same.No server state or dependency graph is involved. Pages that already load the dev client (site generators inject it themselves) are tagged on their existing tag, so Astral 0.5.1 works without changes. Pages without the tag, or whose HTML differs on every render, reload as before.
Volt.HMR.document_update/2sends the update from other packages;Volt.HMR.Documentdocuments the contract for servers that send HTML without going throughVolt.DevServer.Verification
mix test: 754 passed. Credo, the architecture check and Dialyzer pass locally.--include integration, not run in CI): 29 passed, including a new one where editing another page's content does not reload the open page and editing its own content reloads it once.tsgolintmissing on my machine).Also in this PR
Not included