More and more Slater-powered Webflow projects are running in production! So, let's talk about what that means.

Slater works a little differently in a production environment. Instead of serving a file from the Slater server, we serve a file from Amazon S3. The S3 file is extremely resilient, and by default, it is cached by the browser.

When your site doesn't seem to be updated, even after publishing changes, it's likely a caching issue. Your browser is simply not getting the latest copy of the site files. Caching is every developer's arch-nemesis, even though it is every developer's best friend. Caching makes the web faster, even if it leads to the common advice of "try it in incognito mode."

Slater has provided cache-busting functionality since early on, but it wasn't easy or intuitive. You had to manually update the v variable in the script to force a cache refresh.

We're excited to announce that we've just launched improvements to make production deployment more straightforward. With the new minification setting and improved caching, working in production should now be as easy as working in the staging environment!

​

​

Javascript 101: All about caching

Have you ever noticed how some websites load super fast when you visit them again? That's thanks to web caching! Caching provides a personal storage space on your computer or phone for website files.

Here's how it works:

• When you visit a website for the first time, your browser downloads all the files it needs to display the page correctly. These files include HTML, CSS, JavaScript, and images.
• Instead of just using these files once and then forgetting about them, your browser keeps copies of them in its storage.
• The next time you visit that same website, your browser checks its cache first. If the cached files are still valid (meaning they haven't changed on the website), it can quickly load those files from the cache instead of downloading them again from the internet.

So why cache? Here are a few reasons:

1. Faster load times! Since the files are already on your device, they load almost instantly from the cache, rather than having to download everything from the internet again. This makes websites feel super snappy!
2. Less data usage: By using cached files, your browser doesn't need to download as much data from the internet, which is great if you have a limited data plan or a slow internet connection.
3. Reduced server load: Websites don't have to send the same files over and over again to every visitor, which makes their servers less stressed and keeps things running smoothly.
4. Offline browsing: Some websites can even let you view cached versions of their pages when you're not connected to the internet at all, thanks to a technology called service workers.

But! Sometimes you might want to force your browser to ignore the cached files and load the latest version of a website. This is called "cache busting," and there are a few ways developers can do it:

• Changing the file names or adding version numbers to the end (like style.css?v=2). This is how we use to support cache busting.
• Setting special headers that tell the browser how long to cache the files. This is what we optimized in the latest release.
• Using unique "fingerprints" based on the file contents, so any change creates a new fingerprint. Webflow does a lot of this.
• Adding random values or query strings to the file URLs. We use this method as well.

Cache busting is useful when a website has been updated, and you want to ensure you're seeing the latest version without any old, cached files interfering. Go see if you can find cache busting in the wild and let us know what you find.
​

Happy coding!

- The Slater Team

​

​

If Slater helps you create better websites, please support the team behind it.