search

ElMassimo / vite_ruby

⚡️ Vite.js in Ruby, bringing joy to your JavaScript experience
https://vite-ruby.netlify.app/
MIT License
1.28k stars 117 forks source link

docs: More robust solution to Safari dev cache bug #476

Closed mattbrictson closed 2 months ago

mattbrictson commented 2 months ago

Description 📖

Safari had an annoying bug where it will ignore changes to CSS files, breaking the developer's hot-reload experience. The Vite Ruby troubleshooting guide recommends moving CSS into the JS entrypoint as a workaround.

However, in Safari 17.5, the problem is now even worse: the bug now affects JS files as well. That means the previously documented workaround is no longer a solution for the entire scope of Safari HMR issues.

Background 📜

Ultimately, the problem is a known bug in Safari where it aggressively caches JS and CSS files that are marked rel=preload.

If a request is preloaded, Safari will always retrieve it from the cache, regardless of the cache headers for that request.

https://bugs.webkit.org/show_bug.cgi?id=193533

The Fix 🔨

Update the Vite Ruby troubleshooting guide with a more robust workaround: disable the rel=preload Link header in development. This completely solves the issue for me.

FWIW, I'm running:

macOS 14.5 (23F79) Safari 17.5 (19618.2.12.11.6)

mattbrictson commented 2 months ago

Looks like there is a global way to disable rel=preload that is supported all the way back to Rails 6.1. I'll revise my PR to recommend this approach instead.

https://guides.rubyonrails.org/configuring.html#config-action-view-preload-links-header

Edit: done ✅

ElMassimo commented 2 months ago

Looks great, thanks Matt!