Remember to Reload

September 2018 — Tip of the Month

No, this is not a tip for playing a first-person shooter (FPS video game, though it also applies to that. I'm talking about reloading webpages.

When you visit a webpage you have recently viewed, certain assets like the CSS, JavaScript, or even the page's HTML will most likely be cached. That means your browser is loading these resources from your local computer or device instead of fetching a fresh copy from the server.

This is usually fine. It also improves performance since you don't have to re-download the same data when you view the page (or another page on the same website) again. However, it also means you may not be getting the latest version of the data.

If elements on a webpage look out of place or are the wrong size when the page loads in your browser, chances are certain assets were cached and need to be reloaded. You need to reload (or in Microsoft terms, "refresh") the page in order to get the latest assets, such as the CSS files or JavaScript files referenced by the page. If the page looks completely out of wack, such as only displaying text, the CSS may have not loaded successfully. Reloading the page will often fix this problem as well.

Force Reload

Sometimes a simple reload isn't enough. Browsers often just reload the HTML when you use the standard Reload or Refresh command. To make sure you reload everything, including all the assets referenced by the page, you can use a "Force Reload" or "Hard Refresh" command.

Google Chrome Mac Force Reload Command

You can use the following shortcuts to perform a force reload in different web browsers:

Chrome (Windows): Control+F5
Chrome (Mac): Command+Shift+R
Firefox (Windows): Control+F5
Firefox (Mac): Command+Shift+R
Edge (Windows): Control+F5
Safari (Mac): Commmand+Option+R

If a webpage isn't looking quite right, remember to reload. If that doesn't fix the issue, try a force reload. In some cases, I've had to force reload a page two or three times in order actually reload all the assets. If a page still doesn't look right after multiple force reloads, you can always try another web browser to confirm you are viewing the latest version of the webpage.

- Per Christensson