Cache busting

[kristoforsalmin]

Let's think how we can add cache busting: webpack, gulp-rev?

Another thing is that it'd be nice to use same approach, let's see if that's possible.

And do we actually need to have cache busting included in rammevaerk by default? What do you think?

[mi2oon]

@racse1 What would be a nice think so we don't have to rely on serverside cache busts. However, the only problem I see is; How do we get the references in pug and cshtml files fixed?

[kristoforsalmin]

@mi2oon You mean how do we get actual filenames in Pug or Razor? If so, then maybe like that, otherwise let me know 😄

[kristoforsalmin]

@mi2oon Just an update from me. On a project I'm currently working on we had some weird caching on the back end, so we decided to do cache busting on the front end. The thing is that we use gulp to build Sass and webpack to build JavaScript, so we could've used both Webpack Manifest Plugin and gulp-rev (supports merge of existing manifest file), but to me it looked a bit ugly: we were going to have 2 dependencies for the exactly same thing and there's a race condition (which one creates manifest first; what if you run only scripts task). I ended up building styles with webpack. Works fine, but now I'm wondering whether that's a way to go... What do you think?

As a side note, webpack now supports screen.scss as an entry point, so you don't necessarily have to import your styles.

[mi2oon]

@racse1 I don't mind having style as a webpack entrypoint if it works with postcss and all the first. Sourcemaps were the only thing that bugged me last time I tired that.. let me know if you've run across that problem. Also, how was the speed and build time?

[kristoforsalmin]

@mi2oon I'll check source maps... Regarding build times, for watch mode:

Version: webpack 4.10.2
Time: 225ms
                                                Asset       Size  Chunks             Chunk Names
                  app.d79a36b94b426a981b9e.bundle.css    284 KiB     app             app
                   app.523e0cb0c8c85e4168fc.bundle.js    595 KiB     app  [emitted]  app
                vendor.49f160e1edb6bf10087c.bundle.js    2.4 MiB  vendor             vendor

Feels fast 😄 Also I'm more than sure there's number of home remedies to reduce build times even further.

[mi2oon]

@racse1 Well, if source maps can be confirmed I am all up for this. Also, the only reason why I worried about the build time is because we don't really leverage webpacks own module swapping and internal caching. Looking forward to your verdict. :D

[kristoforsalmin]

@mi2oon Hi, I finally found some time to verify the source maps issue. You're right, inline CSS source maps don't really work, which is sad (https://github.com/webpack-contrib/mini-css-extract-plugin/issues/29). Other types of source maps are too slow. I'll see what other options we have (📦 Parcel?)...

[mi2oon]

@racse1 Lets hope it gets working.. I might also have a look at it at one point.. Parcel 📦 hmm.. how about rollup 🤣 Jokes aside.. I think it might be the way to go at some point. But for not it just doesn't feel mature enough.

[kristoforsalmin]

@mi2oon Couldn't agree more, shall we close this one for the time being or let it hang open?

[kristoforsalmin]

@mi2oon Will close this one for now 😄