BrowserSync/Sage reload jank

browsersync

#1

Hi there,

Thanks for this excellent starter theme. I think the workflow is great :slight_smile:

Here’s an issue that’s been grating on me while I’ve been developing my latest theme.

When I hit reload on the page, or navigate to another page, it seems like BrowserSync is “replaying” all of my changes since I first ran yarn start… Surely it should just send the most recent changes?

The theme is running in a Trellis Vagrant box, fresh clone of Trellis and Sage.

I’ve not modified any of the configuration other than to add the proxyUrl to my XXXX.test domain.

Any help massively appreciated.


#2

No issue with Sage here, that’s just Webpack injecting the latest styles after the page loads. Sometimes the initial load will have no styles (“Flash Of Unstyled Content”) or previously built styles. Correct me if I’m wrong, but you do end up with the latest styles after the moment of “jankiness”?

Nuxt.js has a nice explanation + screenshot explaining this issue: https://nuxtjs.org/faq/css-flash/