Quick Tip: Clear Cache & Hard Refresh on Chrome
Cache issues are really irritating while developing on front end technologies. Here is a quick tip on how you can clear the cache and do a hard refresh on Chrome Browser
While developing using front end technologies, the biggest problem a front-end developer might face is clearing the cache every now and then, or doing a hard refresh. Most of the changes done in the code are not reflected at once, unless you are using Codekit or Yeoman.io.
So when I am working on front end stuff, I normally do ‘Ctrl+Shift+R’ (Cmd+Shift+R on OS X) or I go to the settings pane by pressing ‘Ctrl+Shift+Delete’ (Cmd+Shift+Delete on OS X) and then clear the cache. This normally disrupts the whole development flow.
Google’s Chrome browser is one of the most widely used web browsers out there. One reason it became so famous is because of its advanced “Chrome Dev Tools” for web developers. I really enjoy developing on chrome and most importantly, debugging java-script.
Recently, I discovered this small but awesome feature of the Chrome Dev Tools that helps you clear the cache and do a hard refresh easily, without breaking your flow or changing tabs. What ever tab you are on, just open the Chrome Dev Tools by pressing F12. Once the chrome dev tools are open, just right click on the refresh button and a menu will drop down. This menu gives you the option of doing a hard refresh, or even clearing the cache and do a hard refresh automatically.
It is a very small tip but is really useful in maintaining the workflow or reducing the number of steps to do the cache clearing task.
Hope this is helpful and improves your workflow. Let me know if you have any other tools of automating the development steps