sitecrafting / groot

:seedling: The official SiteCrafting WordPress starter theme, built on Timber and Conifer
MIT License
3 stars 1 forks source link

Prevent unnecessary downloads of unchanged assets #57

Closed acobster closed 3 years ago

acobster commented 4 years ago

Testing

Switch to the branch and watch assets for changes as you normally would:

git checkout feature/assets-hash
lando webpack --watch

Make some changes to JS/CSS files and note that the contents of scripts.version and styles.version change, and correspond to the query string being served for the <script> and <link> tags for those assets. Specifically, saving a change and then undoing that change should result in the same hash.

Background

This introduces a useHash option to the custom Webpack AssetsVersionPlugin which is responsible for writing to the assets.version file, or any other version file you configure. This is the file that Conifer's Site::enqueue_script() and Site::enqueue_style() methods read from to do cache-busting.

The new plugin option tells the plugin to write the hash of the bundled asset's content (for example, a hash of all the JS it just compiled) to the version file instead of a simple timestamp. Passing this option has the effect of busting the browser cache only when the contents of the bundle change.

This PR also separates the CSS and JS bundles out onto their own asset version "channels," i.e. they get cached (and cache-busted) independently of each other. For example, when CSS changes, the browser will only re-download the new CSS files and JS will stay cached.

rbhensley commented 3 years ago

Tested, and works as expected and defined. Only thing of note is while watching it seemed to take a really long time to compile on a javascript change.

acobster commented 3 years ago

@rbhensley this seems to happen on main too. It might be an issue that was introduced before the PR. Do any of your recently spun-up projects have this issue?

Wrote up #60 to look into this.