The Benefit of the Hard Refresh
You may have noticed that when you return to a website you’ve visited before, it loads a bit speedier than it did on your first visit. This little boost is thanks to the power of caching. Caching makes commonly used websites load faster and use less bandwidth, but there are a few instances in which it can all lead to some pretty screwy behavior. What is caching anyways? Well, to answer that question, first you must understand what happens when you visit a website in your browser.
Unfortunately, when a site is being developed, the contents of these files are changing rapidly, and the cached files may no longer be the most up to date versions. This can lead to pages displaying as outdated versions, or sometimes looking broken if old, cached files are loaded alongside other files fresh from the server. To solve this problem, you can do a “hard refresh” (sometimes called a “force reload”). A hard refresh forces the browser to load all fresh copies of the files from a specific page regardless of what it has in its cache. If you’re viewing a webpage that is under development and things don’t look right, try a hard refresh first!
The steps to do a hard refresh vary depending on the browser and operating system you are using, but below are the keyboard shortcuts for the most common ones.
Windows: Hold down Ctrl and press F5
Mac: Hold down ⌘ Cmd and ⇧ Shift key and then press R
Windows: Hold down Ctrl and ⇧ Shift and then press R
Mac: Hold down ⌘ Cmd and ⇧ Shift and then press R
Hold the Ctrl key and press the F5 key
To empty the cache, you need to turn on the Develop menu. Got to Safari > Preferences…, click the Advanced tab, and check Show Develop menu in menu bar.
Hold down alt and ⌘ Cmd, and then press E to empty the cache.
Hold the ⌘ Cmd key, and press R to refresh the page.
Before you go, download our PDF document outlining how to hard refresh!